/* Composition, embedded imagery, type scale and palette remain in reference design.css. */
[data-page="inicio"] .fato{padding-inline:16px}
[data-page="inicio"] .fato b{font-size:clamp(1.25rem,2vw,1.65rem)}
.foto-porta {
  background-image:var(--img-det-porta)}
.foto-mao {
  background-image:var(--img-det-mao)}
.foto-lado {
  background-image:var(--img-det-lado)}
.secao-final {
  padding-top:0}
.rotulo-ouro {
  color:var(--gold)}

.local-grid {
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:16px}
.local-nav {
  display:flex;
  flex-wrap:wrap;
  gap:12px;
  margin:16px 0}
.local-record {
  padding:24px 0;
  border-top:1px solid var(--line);
  overflow-wrap:anywhere}
.local-record label {
  display:block;
  margin:12px 0}
.local-card {
  padding:clamp(20px,4vw,36px)}
.local-card .campo {
  margin-bottom:16px}
#minor-fields {
  margin-top:24px}
#admin-panel h3 {
  margin-top:28px}
.local-card .btn {
  margin-top:8px}
#conteudo:focus {
  outline:none}
@media(max-width:760px) {
  .local-grid {
  grid-template-columns:1fr}
}


[data-page="inicio"] .fato,[data-page="inicio"] .fato>* {
  min-width:0;
  overflow-wrap:normal;
  word-break:normal;
}
[data-page="inicio"] .fatos { grid-template-columns:repeat(5,minmax(0,1fr)); }
@media(max-width:1000px){[data-page="inicio"] .fatos{grid-template-columns:repeat(2,minmax(0,1fr));}}
@media(max-width:760px){[data-page="inicio"] .fatos{grid-template-columns:1fr;}}

/* Five reference stages shrink within tablet width instead of overflowing. */
[data-page="inicio"] .trilha {
  grid-template-columns:repeat(5,minmax(0,1fr))}
[data-page="inicio"] .trilha li {
  min-width:0;
  overflow-wrap:anywhere}
[data-page="inicio"] .trilha li>* {
  min-width:0;
  max-width:100%}
@media(max-width:760px) {
  [data-page="inicio"] .trilha {
  grid-template-columns:1fr}
}

/* Isolate top-bar .barra from the prototype's finance progress-bar selector. */
.top .barra {
  height:auto;
  min-height:64px;
  border:0;
  border-radius:0;
  background:transparent;
  overflow:visible}

[hidden] {
  display:none!important}
.nav a {
  display:inline-flex;
  align-items:center;
  min-height:44px;
  padding:0 12px;
  border-radius:10px;
  color:inherit;
  text-decoration:none;
  font-size:.92rem;
  font-weight:500}
.site-header .nav a{padding:10px 16px;min-height:44px;border-radius:12px}
.nav a:hover,.nav a:focus-visible,.nav a[aria-current="page"] {
  background:#172e49;
  color:#fff}
.marca {
  color:inherit;
  text-decoration:none}
.btn {
  text-decoration:none}
.rodape a {
  color:inherit;
  min-height:44px;
  display:inline-flex;
  align-items:center}
.route-form {
  max-width:880px}
.route-admin {
  max-width:1128px}
.local-card h2 {
  margin-bottom:14px}
.local-card p {
  margin-bottom:12px}
.form-grid {
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:16px}
fieldset {
  border:0;
  padding:0;
  margin:0;
  min-width:0}
legend {
  font-weight:700;
  margin-bottom:16px}
.form-grid label {
  display:grid;
  gap:6px;
  font-weight:600;
  min-width:0}
input,select {
  width:100%;
  min-height:44px;
  border:1px solid var(--line);
  border-radius:10px;
  background:var(--surface);
  color:var(--fg);
  padding:10px;
  font:inherit}
input:focus,select:focus {
  outline:3px solid var(--gold);
  outline-offset:2px}
.check {
  display:flex;
  align-items:flex-start;
  gap:10px;
  margin:16px 0}
.check input {
  width:20px;
  height:20px;
  min-height:20px;
  flex:none;
  margin-top:3px;
  accent-color:var(--brand)}
.local-card small {
  display:block;
  margin-top:6px;
  color:var(--muted)}
.local-actions {
  display:flex;
  gap:10px;
  flex-wrap:wrap;
  margin:16px 0;
  align-items:center}
.local-actions label {
  flex:1 1 190px}
.msg {
  min-height:1.5em;
  margin:12px 0;
  font-weight:600}
.msg.error {
  color:var(--bad)}
:disabled {
  cursor:not-allowed;
  opacity:.65}
.table-scroll {
  overflow:auto;
  margin-top:16px}
table {
  width:100%;
  border-collapse:collapse}
th,td {
  padding:12px;
  border-bottom:1px solid var(--line);
  text-align:left;
  vertical-align:top;
  font-size:.9rem}
th {
  background:var(--surface-2)}
#reg-state {
  margin:20px 0}
#login {
  max-width:460px}
#login .botao {
  margin-top:16px}
#admin-panel {
  margin-top:20px}

@media(max-width:760px) {
  .form-grid {
  grid-template-columns:1fr}
.local-actions>* {
  width:100%}
.nav {
  margin-left:-12px}
.demo .wrap {
  font-size:.75rem}
.route-form,.route-admin {
  padding-top:24px}
}

