/* Presentación de los formularios de andwos-core. La lógica vive en el plugin. */

.aw-form-wrap {
	font-family: var(--aw-font-body);
	color: var(--aw-ink);
	max-width: 760px;
	margin-inline: auto;
}

.aw-form [hidden],
.aw-form-wrap [hidden] {
	display: none !important;
}

/* Campo trampa: fuera de pantalla, no display:none (algunos bots lo ignoran). */
.aw-hp {
	position: absolute !important;
	left: -9999px;
	width: 1px;
	height: 1px;
	overflow: hidden;
}

.aw-form fieldset {
	border: 0;
	margin: 0 0 1.5rem;
	padding: 0;
	min-width: 0;
}

.aw-form legend {
	font-family: var(--aw-font-heading);
	font-weight: 700;
	font-size: clamp(1.25rem, 1rem + 1vw, 1.625rem);
	line-height: 1.25;
	margin-bottom: 1rem;
	padding: 0;
}
.aw-form legend:focus {
	outline: none;
}

.aw-label {
	font-weight: 500;
	margin: 1.25rem 0 0.5rem;
}

.aw-field {
	margin: 0 0 1rem;
}
.aw-field label {
	display: block;
	font-weight: 500;
	margin-bottom: 0.375rem;
}
.aw-field input[type="text"],
.aw-field input[type="email"],
.aw-field input[type="tel"],
.aw-field textarea {
	width: 100%;
	box-sizing: border-box;
	font: inherit;
	color: var(--aw-ink);
	background: var(--aw-surface);
	border: 1.5px solid var(--aw-line);
	border-radius: var(--aw-radius-sm);
	padding: 0.75rem 0.875rem;
}
.aw-field input:focus,
.aw-field textarea:focus {
	outline: none;
	border-color: var(--aw-anthracite);
	box-shadow: var(--aw-focus);
}

/* Opciones como tarjetas seleccionables */
.aw-options {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
	gap: 0.625rem;
}
.aw-option {
	display: flex;
	align-items: center;
	gap: 0.625rem;
	padding: 0.75rem 0.875rem;
	background: var(--aw-surface);
	border: 1.5px solid var(--aw-line);
	border-radius: var(--aw-radius);
	cursor: pointer;
	transition: border-color 0.15s ease, background-color 0.15s ease;
}
.aw-option:hover {
	border-color: var(--aw-anthracite);
}
.aw-option:has(input:checked) {
	border-color: var(--aw-anthracite);
	background: var(--aw-surface-soft);
	box-shadow: inset 0 0 0 1px var(--aw-anthracite);
}
.aw-option:has(input:focus-visible) {
	box-shadow: var(--aw-focus);
}
.aw-option input {
	accent-color: var(--aw-anthracite);
	width: 1.125rem;
	height: 1.125rem;
	flex: none;
}

.aw-field--check label {
	display: flex;
	gap: 0.625rem;
	align-items: flex-start;
	font-weight: 400;
	font-size: 0.9rem;
	color: var(--aw-muted);
}
.aw-field--check input {
	accent-color: var(--aw-anthracite);
	margin-top: 0.25rem;
	width: 1.125rem;
	height: 1.125rem;
	flex: none;
}
.aw-field--check a {
	color: var(--aw-anthracite);
	text-decoration: underline;
}

/* Progreso */
.aw-progress {
	display: flex;
	gap: 0.375rem;
	list-style: none;
	margin: 0 0 1.75rem;
	padding: 0;
	counter-reset: aw;
}
.aw-progress li {
	flex: 1;
	counter-increment: aw;
	font-size: 0.75rem;
	font-weight: 500;
	color: var(--aw-muted);
	border-top: 4px solid var(--aw-line);
	padding-top: 0.5rem;
}
.aw-progress li.is-done {
	border-top-color: var(--aw-anthracite);
}
.aw-progress li.is-active {
	border-top-color: var(--aw-gold);
	color: var(--aw-ink);
	font-weight: 700;
}
@media (max-width: 600px) {
	.aw-progress li {
		font-size: 0;
	}
	.aw-progress li::before {
		content: counter(aw);
		font-size: 0.75rem;
	}
}

/* Botones */
.aw-actions {
	display: flex;
	flex-wrap: wrap;
	gap: 0.75rem;
	justify-content: flex-end;
	margin-top: 1.25rem;
}
.aw-btn {
	font-family: var(--aw-font-heading);
	font-weight: 700;
	font-size: 1rem;
	line-height: 1;
	padding: 0.95rem 1.6rem;
	border-radius: var(--aw-radius-sm);
	border: 2px solid var(--aw-anthracite);
	background: var(--aw-anthracite);
	color: #fff;
	cursor: pointer;
	transition: transform 0.15s ease, background-color 0.15s ease;
}
.aw-btn:hover {
	background: var(--aw-anthracite-deep);
}
.aw-btn:focus-visible {
	outline: none;
	box-shadow: var(--aw-focus);
}
.aw-btn--primary {
	background: var(--aw-gold);
	border-color: var(--aw-gold);
	color: var(--aw-ink); /* 7,3:1 sobre dorado */
}
.aw-btn--primary:hover {
	background: var(--aw-gold-hover);
	border-color: var(--aw-gold-hover);
}
.aw-btn--ghost {
	background: transparent;
	color: var(--aw-anthracite);
}
.aw-btn--ghost:hover {
	background: var(--aw-surface-soft);
}

/* Avisos */
.aw-notice {
	border-radius: var(--aw-radius);
	padding: 1rem 1.25rem;
	margin-bottom: 1.5rem;
	border: 1.5px solid;
	background: var(--aw-surface);
}
.aw-notice--ok {
	border-color: var(--aw-ok);
	color: var(--aw-ok);
}
.aw-notice--error {
	border-color: var(--aw-error);
	color: var(--aw-error);
}

/* Movimiento: respetar la preferencia del usuario */
@media (prefers-reduced-motion: reduce) {
	.aw-option,
	.aw-btn {
		transition: none;
	}
}

/* Aviso: lo que se pide no corresponde al tipo de sitio elegido */
.aw-ajuste {
	background: #fffaf0;
	border: 1.5px solid var(--aw-gold);
	border-left-width: 6px;
	border-radius: var(--aw-radius);
	padding: 1rem 1.25rem;
	margin: 0 0 1.5rem;
	color: var(--aw-ink);
}
.aw-ajuste strong {
	display: block;
	font-family: var(--aw-font-heading);
	font-size: 1.05rem;
	margin-bottom: 0.25rem;
}
.aw-ajuste p {
	margin: 0.35rem 0;
	line-height: 1.5;
}
.aw-ajuste--suave {
	background: var(--aw-surface-soft);
	border-color: var(--aw-line);
	border-left-color: var(--aw-anthracite);
}
.aw-ajuste__botones {
	display: flex;
	flex-wrap: wrap;
	gap: 0.6rem;
	margin-top: 0.75rem !important;
}
.aw-ajuste__nota {
	font-size: 0.85rem;
	color: var(--aw-muted);
}
/* Etiquetas de costo en las funciones del cotizador */
.aw-ayuda { margin: 0 0 1rem; color: var(--aw-muted); font-size: 0.92rem; line-height: 1.5; }
.aw-costo { display: block; width: fit-content; margin-top: 0.35rem; padding: 0.12rem 0.6rem; border-radius: 99px; font: 700 0.7rem var(--aw-font-heading); font-style: normal; letter-spacing: 0.03em; text-transform: uppercase; }
.aw-costo--incluida { background: #dcfce7; color: #14532d; }
.aw-costo--extra { background: #fdf0cc; color: #6b4a00; }

/* Función incluida: marcada de entrada; si se desmarca, la etiqueta aclara que no estará */
.aw-costo--incluida b { font-weight: inherit; }
.aw-costo--incluida .aw-costo__no { display: none; }
.aw-option:has(input:not(:checked)) .aw-costo--incluida { background: #fee2e2; color: #7f1d1d; text-transform: none; letter-spacing: 0; }
.aw-option:has(input:not(:checked)) .aw-costo--incluida .aw-costo__si { display: none; }
.aw-option:has(input:not(:checked)) .aw-costo--incluida .aw-costo__no { display: inline; }
.aw-option:has(input:not(:checked)) .aw-costo--incluida ~ * { opacity: 1; }

/* Botones bloqueados y pistas */
.aw-btn:disabled { opacity: 0.45; cursor: not-allowed; transform: none; pointer-events: none; }
.aw-hint { display: block; margin: 0.5rem 0 0; color: var(--aw-muted); font-size: 0.88rem; line-height: 1.4; }
.aw-hint[hidden] { display: none; }
.aw-actions + .aw-hint, p.aw-hint { text-align: right; }

/* Aviso al enviar */
.aw-popup { position: fixed; inset: 0; z-index: 100000; display: grid; place-items: center; padding: 1.25rem; background: rgba(14, 13, 8, 0.62); -webkit-backdrop-filter: blur(6px); backdrop-filter: blur(6px); animation: aw-popup-in 0.25s ease both; }
.aw-popup__caja { width: min(100%, 420px); text-align: center; background: var(--aw-lightest); border-radius: 24px; padding: 2rem 1.75rem 1.5rem; box-shadow: 0 30px 70px rgba(0, 0, 0, 0.45); outline: none; animation: aw-popup-caja 0.4s cubic-bezier(.2,.9,.3,1.2) both; }
.aw-popup__ok { width: 72px; height: 72px; border-radius: 50%; margin: 0 auto 1rem; display: grid; place-items: center; background: var(--aw-gold); color: var(--aw-ink); box-shadow: 0 0 0 8px rgba(241, 184, 47, 0.25); }
.aw-popup__ok path { stroke-dasharray: 26; stroke-dashoffset: 26; animation: aw-popup-check 0.5s 0.25s ease forwards; }
.aw-popup h2 { margin: 0 0 0.4rem; font-family: var(--aw-font-heading); font-size: 1.6rem; color: var(--aw-anthracite); }
.aw-popup p { margin: 0 0 1.2rem; color: var(--aw-muted); line-height: 1.55; }
.aw-popup__barra { display: block; height: 5px; border-radius: 99px; background: var(--aw-light); overflow: hidden; }
.aw-popup__barra i { display: block; height: 100%; width: 100%; background: var(--aw-gold); transform-origin: left; animation: aw-popup-cuenta linear forwards; }
.aw-popup.is-pausa .aw-popup__barra i { animation-play-state: paused; }
.aw-popup__ir { display: inline-block; margin-top: 1rem; font-weight: 600; color: var(--aw-anthracite); text-underline-offset: 3px; font-size: 0.92rem; }
@keyframes aw-popup-in { from { opacity: 0; } to { opacity: 1; } }
@keyframes aw-popup-caja { from { opacity: 0; transform: translateY(14px) scale(0.94); } to { opacity: 1; transform: none; } }
@keyframes aw-popup-check { to { stroke-dashoffset: 0; } }
@keyframes aw-popup-cuenta { from { transform: scaleX(1); } to { transform: scaleX(0); } }
@media (prefers-reduced-motion: reduce) { .aw-popup, .aw-popup__caja, .aw-popup__ok path { animation: none; } .aw-popup__ok path { stroke-dashoffset: 0; } }

.aw-ayuda[data-aw-pag-ayuda] { min-height: 2.6em; }

/* Aclaración «¿Cómo es una landing?» */
.aw-aclara { margin: 0 0 1rem; padding: 0.85rem 1rem; border-radius: 12px; background: #fdf0cc; border: 1px solid #f0d27a; color: #4a3a05; font-size: 0.92rem; line-height: 1.55; }
.aw-aclara[hidden] { display: none; }
.aw-aclara strong { display: block; margin-bottom: 0.15rem; font-family: var(--aw-font-heading); }

/* Grupos del paso «Funciones» */
.aw-grupo { margin: 1.4rem 0 0.7rem; font: 700 1.02rem var(--aw-font-heading); color: var(--aw-anthracite); }
.aw-grupo small { display: block; margin-top: 0.15rem; font: 400 0.82rem var(--aw-font-body); color: var(--aw-muted); }
.aw-exceso { margin-top: 1rem; }

/* Aviso «Te falta responder…» en la misma fila del botón (no se mueve al ocultarse) */
.aw-actions { align-items: center; flex-wrap: nowrap; }
.aw-actions .aw-hint--paso { flex: 1 1 auto; margin: 0 auto 0 0; text-align: left; align-self: center; }
.aw-hint--paso.is-oculta { visibility: hidden; }
@media (max-width: 560px) { .aw-actions { flex-wrap: wrap; } .aw-actions .aw-hint--paso { flex-basis: 100%; min-height: 1.4em; margin-bottom: 0.4rem; } }

/* Tu estimado */
.aw-estimado { margin: 0 0 1.4rem; padding: 1.3rem 1.4rem; border-radius: 18px; background: var(--aw-anthracite); color: #fefcf8; }
.aw-estimado h3 { margin: 0; font: 800 1.25rem var(--aw-font-heading); color: #fff; }
.aw-estimado__sub { margin: 0.2rem 0 1rem; color: #e9e6de; font-size: 0.93rem; }
.aw-estimado__sub strong { color: var(--aw-gold); }
.aw-estimado__tit { margin: 0 0 0.5rem; font: 700 0.74rem var(--aw-font-heading); letter-spacing: 0.08em; text-transform: uppercase; color: #cfcabd; }
.aw-estimado__pers { display: flex; flex-wrap: wrap; gap: 0.5rem; margin-bottom: 1rem; }
.aw-estimado__per { position: relative; cursor: pointer; }
.aw-estimado__per input { position: absolute; opacity: 0; inset: 0; width: 100%; height: 100%; margin: 0; cursor: pointer; }
.aw-estimado__per span { display: block; padding: 0.55rem 0.95rem; border-radius: 12px; border: 1.5px solid rgba(254, 252, 248, 0.35); transition: background-color 0.2s ease, border-color 0.2s ease, color 0.2s ease; }
.aw-estimado__per strong { display: block; font: 700 0.95rem var(--aw-font-heading); }
.aw-estimado__per small { display: block; font-size: 0.76rem; opacity: 0.85; }
.aw-estimado__per input:checked + span { background: var(--aw-gold); border-color: var(--aw-gold); color: var(--aw-ink); }
.aw-estimado__per input:focus-visible + span { box-shadow: var(--aw-focus); }
.aw-estimado__lista { margin: 0; }
.aw-estimado__lista > div { display: flex; justify-content: space-between; gap: 1rem; padding: 0.55rem 0; border-bottom: 1px solid rgba(254, 252, 248, 0.16); }
.aw-estimado__lista dt { font: 600 0.95rem var(--aw-font-body); }
.aw-estimado__lista dt small { display: block; font-weight: 400; font-size: 0.78rem; color: #cfcabd; }
.aw-estimado__lista dd { margin: 0; font: 700 1rem var(--aw-font-heading); white-space: nowrap; }
.aw-estimado__lista .aw-estimado__total { border-bottom: 0; padding-top: 0.8rem; }
.aw-estimado__lista .aw-estimado__total dt, .aw-estimado__lista .aw-estimado__total dd { color: var(--aw-gold); font: 800 1.25rem var(--aw-font-heading); }
.aw-estimado__ini { border-bottom: 0 !important; padding-top: 0 !important; }
.aw-estimado__ini dd { font-size: 0.95rem; }
.aw-estimado__nota { margin: 0.9rem 0 0; font-size: 0.8rem; line-height: 1.5; color: #cfcabd; }
.aw-estimado__carga { margin: 0; color: #e9e6de; }
