/* Formulários nativos (diagnóstico, newsletter, checklist) — markup do hifi. */

/* ==========================================================================
   1. Estrutura
   ========================================================================== */
.amk-form-block {
	width: 100%;
}

/* O próprio <form> é o card; o wrapper antigo da seção deixa de desenhar card. */
.amk-form-card {
	padding: 0;
	background: transparent;
	border: 0;
	border-radius: 0;
	box-shadow: none;
}

.amk-form {
	display: grid;
	gap: 1.1rem;
}

.amk-form__title {
	margin: 0;
	color: var(--amk-ink);
	font-size: var(--amk-fs-h3);
}

.amk-form__row2 {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 1.1rem;
}

.amk-field {
	display: grid;
	gap: .4rem;
	min-width: 0;
}

.amk-field--full,
.amk-form__actions,
.amk-check {
	grid-column: 1 / -1;
}

/* ==========================================================================
   2. Campos
   ========================================================================== */
.amk-field label {
	color: var(--amk-ink);
	font-size: var(--amk-fs-sm);
	font-weight: 600;
}

.amk-field input[type="text"],
.amk-field input[type="email"],
.amk-field input[type="tel"],
.amk-field input[type="url"],
.amk-field select,
.amk-field textarea {
	width: 100%;
	padding: .8rem .95rem;
	background: var(--amk-surface);
	border: 1px solid var(--amk-line);
	border-radius: var(--amk-r-sm);
	color: var(--amk-ink);
	font: inherit;
	font-size: var(--amk-fs-base);
}

.amk-field textarea {
	min-height: 120px;
	resize: vertical;
}

.amk-field input:focus,
.amk-field select:focus,
.amk-field textarea:focus {
	border-color: var(--amk-cyan-text);
	outline: 2px solid var(--amk-cyan);
	outline-offset: 0;
}

.amk-field--err input,
.amk-field--err select,
.amk-field--err textarea,
.amk-check.amk-field--err {
	border-color: var(--amk-crit);
}

.amk-field__err {
	color: var(--amk-crit);
}

.amk-form__req {
	color: var(--amk-crit);
}

.amk-hint {
	margin: .2rem 0 0;
	color: var(--amk-muted);
	font-size: var(--amk-fs-xs);
}

.amk-hint a {
	color: var(--amk-cyan-text);
}

.amk-check {
	display: flex;
	gap: .6rem;
	align-items: flex-start;
	color: var(--amk-ink-2);
	font-size: var(--amk-fs-sm);
	font-weight: 400;
}

.amk-check input {
	margin-top: .25rem;
	accent-color: var(--amk-cyan-text);
}

.amk-form__actions {
	display: flex;
	justify-content: flex-start;
	margin-top: .25rem;
}

/* ==========================================================================
   3. Avisos
   ========================================================================== */
.amk-form__ok {
	margin: 0 0 1rem;
	padding: .75rem 1rem;
	background: var(--amk-surface-2);
	border-left: 3px solid var(--amk-cyan-text);
	border-radius: 0 var(--amk-r-sm) var(--amk-r-sm) 0;
	color: var(--amk-ink);
}

.amk-form__errors {
	margin: 0 0 1rem;
	padding: .75rem 1rem .75rem 2rem;
	background: rgba(201, 61, 61, .08);
	border-left: 3px solid var(--amk-crit);
	border-radius: 0 var(--amk-r-sm) var(--amk-r-sm) 0;
	color: var(--amk-ink);
}

.amk-form__errors li {
	margin: .15rem 0;
}

.amk-form__hp {
	position: absolute !important;
	left: -9999px !important;
	width: 1px;
	height: 1px;
	overflow: hidden;
}

.amk-form__html {
	margin-top: .5rem;
}

.amk-form__html h2 {
	margin: 0 0 .5rem;
	font-size: var(--amk-fs-h3);
}

/* ==========================================================================
   4. Newsletter (dentro do card .amk-newsletter) e mobile
   ========================================================================== */
.amk-newsletter .amk-form {
	grid-template-columns: minmax(0, 1fr);
	margin-top: .75rem;
	padding: 0;
	background: transparent;
	border: 0;
	border-radius: 0;
	box-shadow: none;
}

.amk-newsletter .amk-form .amk-field label {
	color: var(--amk-ink);
}

.amk-newsletter .amk-form__actions .amk-btn {
	width: 100%;
	justify-content: center;
}

@media (max-width: 47.98em) {
	.amk-form__row2 {
		grid-template-columns: minmax(0, 1fr);
	}
}
