/*======================================================
FORMULARIO DE PRESUPUESTO
======================================================*/

.quote-form-wrapper{

	scroll-margin-top:2rem;

}

.quote-form-card{

	background:#fff;

	border:1px solid var(--gray-200);

	border-radius:var(--radius-lg);

	padding:clamp(1.75rem,4vw,3rem);

	max-width:720px;

	margin:0 auto;

	box-shadow:var(--shadow-md);

}

.quote-form-card__title{

	margin-bottom:.5rem;

	font-size:1.6rem;

}

.quote-form-card__description{

	color:var(--text-light);

	margin-bottom:2rem;

}

.quote-form__notice{

	padding:1rem 1.25rem;

	border-radius:var(--radius-md);

	margin-bottom:1.5rem;

	font-size:.9rem;

}

.quote-form__notice--error{

	background:#fdecea;

	color:#8a1f11;

	border:1px solid #f5c2bc;

}

.quote-form__row{

	display:grid;

	grid-template-columns:1fr 1fr;

	gap:1.25rem;

}

.quote-form__field{

	margin-bottom:1.25rem;

}

.quote-form__field label{

	display:block;

	font-weight:var(--weight-semibold);

	font-size:.9rem;

	margin-bottom:.4rem;

	color:var(--heading-color);
}

.quote-form__field input[type="text"],
.quote-form__field input[type="tel"],
.quote-form__field input[type="email"],
.quote-form__field select,
.quote-form__field textarea{

	width:100%;

	padding:.8rem 1rem;

	border:1px solid var(--gray-300);

	border-radius:var(--radius-md);

	font-family:var(--font-primary);

	font-size:1rem;

	background:#fff;

	color:var(--heading-color);

	transition:var(--transition-fast);

}

.quote-form__field input:focus,
.quote-form__field select:focus,
.quote-form__field textarea:focus{

	outline:none;

	border-color:var(--color-secondary);

	box-shadow:0 0 0 3px rgba(197,157,47,.2);

}

.quote-form__field input[aria-invalid="true"],
.quote-form__field select[aria-invalid="true"],
.quote-form__field textarea[aria-invalid="true"]{

	border-color:#c0392b;

}

.quote-form__error{

	display:block;

	color:#c0392b;

	font-size:.82rem;

	margin-top:.4rem;

}

.quote-form__field--checkbox label{

	display:flex;

	align-items:flex-start;

	gap:.6rem;

	font-weight:var(--weight-normal);

	font-size:.9rem;

}

.quote-form__field--checkbox input[type="checkbox"]{

	margin-top:.2rem;

	flex-shrink:0;

	width:18px;

	height:18px;

}

.quote-form__field--checkbox a{

	color:var(--color-secondary-dark);

	text-decoration:underline;

}

.quote-form__submit{

	width:100%;

	justify-content:center;

	font-size:1.05rem;

	padding:1rem;

}

.quote-form__privacy-note{

	font-size:.78rem;

	color:var(--text-light);

	text-align:center;

	margin:1rem 0 0;

}

/* Honeypot: oculto visualmente, pero presente en el HTML para los bots */
.myc-hp{

	position:absolute;

	left:-9999px;

	width:1px;

	height:1px;

	overflow:hidden;

}

/*======================================================
CONFIRMACIÓN
======================================================*/

.quote-form-card--success{

	text-align:center;

}

.quote-form-success__icon{

	width:64px;

	height:64px;

	margin:0 auto 1.5rem;

	border-radius:50%;

	background:#e6f4ea;

	color:#1e7e34;

	font-size:2rem;

	display:flex;

	align-items:center;

	justify-content:center;

}

.quote-form-success__actions{

	display:flex;

	justify-content:center;

	gap:1rem;

	flex-wrap:wrap;

	margin-top:1.5rem;

}

/*======================================================
ACCESIBILIDAD — FLUENT FORMS
======================================================*/

/* Fluent Forms aplica por defecto un azul demasiado claro en algunos temas.
   Este override usa el azul oscuro corporativo, manteniendo contraste AA/AAA. */
.quote-form-card .ff-btn-submit,
.quote-form-card button[type="submit"].ff-btn{
	background:var(--color-primary) !important;
	border-color:var(--color-primary) !important;
	color:#fff !important;
}

.quote-form-card .ff-btn-submit:hover,
.quote-form-card .ff-btn-submit:focus-visible,
.quote-form-card button[type="submit"].ff-btn:hover,
.quote-form-card button[type="submit"].ff-btn:focus-visible{
	background:var(--color-primary-light) !important;
	border-color:var(--color-primary-light) !important;
	color:#fff !important;
}

/*======================================================
RESPONSIVE
======================================================*/

@media (max-width:600px){

	.quote-form__row{

		grid-template-columns:1fr;

	}

}
