/* Página /contato/: apresentação à esquerda, formulário em cartão à direita. */
.contato [hidden] { display: none !important; }

.contato { display: grid; grid-template-columns: minmax(0, 1fr); gap: var(--space-2xl); padding-block: calc(var(--nav-height) + var(--space-2xl)) var(--space-3xl); }
@media (min-width: 60rem) { .contato { grid-template-columns: minmax(0, 5fr) minmax(0, 6fr); gap: var(--space-3xl); align-items: start; } }

.contato__intro { display: grid; gap: var(--space-md); align-content: start; }
.contato__intro h1 { font-size: var(--text-display-s); max-width: 16ch; }
.contato__intro .lede { max-width: 44ch; }
.contato__canais { display: grid; margin-top: var(--space-md); border-top: var(--rule-hair) solid var(--color-rule); }
.contato__canais li { display: grid; gap: var(--space-3xs); padding-block: var(--space-sm); border-bottom: var(--rule-hair) solid var(--color-rule); color: var(--color-ink-2); }
.contato__canais span { font-size: var(--text-xs); color: var(--color-muted); }
.contato__canais a { color: var(--color-ink); font-family: var(--font-display); font-weight: 500; }
.contato__nota { font-size: var(--text-sm); color: var(--color-muted); }
.contato__nota a { color: var(--color-accent-deep); }

.contato__card { background: var(--color-paper); border: var(--rule-hair) solid var(--color-rule); border-radius: var(--radius-lg, 12px); padding: var(--space-lg); }
@media (min-width: 40rem) { .contato__card { padding: var(--space-xl); } }

.cform { display: grid; gap: var(--space-md); }
.cform__row { display: grid; gap: var(--space-md); }
@media (min-width: 40rem) { .cform__row { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
.cform__field { display: grid; gap: var(--space-2xs); align-content: start; }
.cform label { font-family: var(--font-display); font-weight: 500; font-size: var(--text-sm); color: var(--color-ink); }
.cform input, .cform select, .cform textarea {
  width: 100%; min-height: 44px; padding: var(--space-xs) var(--space-sm);
  font: inherit; font-size: var(--text-base); color: var(--color-ink);
  background: var(--color-paper); border: 1px solid var(--color-rule); border-radius: var(--radius-sm, 4px);
  transition: border-color var(--dur-short) var(--ease-out);
}
.cform textarea { resize: vertical; min-height: 7rem; }
.cform input::placeholder, .cform textarea::placeholder { color: var(--color-muted); opacity: 0.8; }
.cform input:hover, .cform select:hover, .cform textarea:hover { border-color: var(--color-muted); }
.cform input:focus-visible, .cform select:focus-visible, .cform textarea:focus-visible { outline: 2px solid var(--color-focus); outline-offset: 1px; border-color: var(--color-focus); }
.cform [aria-invalid="true"] { border-color: oklch(52% 0.18 27); }
.cform__err { font-size: var(--text-xs); color: oklch(45% 0.17 27); }
.cform__lgpd { font-size: var(--text-xs); color: var(--color-muted); }
.cform__lgpd a { color: var(--color-accent-deep); }
.cform .btn { justify-self: start; }

.cform__ok { display: grid; gap: var(--space-sm); }
.cform__ok h2 { font-size: var(--text-xl); }
.cform__ok p { color: var(--color-ink-2); max-width: 44ch; }
.cform__ok:focus { outline: none; }

.sr-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0; }
