/* TecnosZubia · Simulacros — estilos del front-end
   Colores de marca: navy #002f5f / #0b4d8c, dorado #d4a24c */

.tzs-app{
	--tzs-navy:#002f5f;
	--tzs-navy2:#0b4d8c;
	--tzs-gold:#d4a24c;
	--tzs-bg:#eeeff2;
	--tzs-bg2:#dce4ef;
	--tzs-text:#3a3a3a;
	--tzs-muted:#5a5a5a;
	--tzs-ok:#1f7a3d;
	--tzs-err:#c0392b;
	font-family:"Roboto","Helvetica Neue",Arial,sans-serif;
	color:var(--tzs-text);
	max-width:760px;
	margin:0 auto;
	line-height:1.55;
}

.tzs-card{
	background:#fff;
	border:1px solid var(--tzs-bg2);
	border-radius:14px;
	box-shadow:0 10px 30px rgba(0,47,95,.08);
	padding:32px;
}
.tzs-card--center{text-align:center;padding:48px 32px;}

.tzs-badge{
	display:inline-block;
	background:linear-gradient(135deg,var(--tzs-navy),var(--tzs-navy2));
	color:#fff;
	font-size:12px;
	font-weight:700;
	letter-spacing:.5px;
	text-transform:uppercase;
	padding:5px 12px;
	border-radius:999px;
	margin-bottom:14px;
}

.tzs-title{
	color:var(--tzs-navy);
	font-size:26px;
	font-weight:700;
	margin:0 0 10px;
}
.tzs-intro{color:var(--tzs-muted);margin:0 0 14px;}

.tzs-meta{
	list-style:none;
	margin:0 0 24px;
	padding:16px;
	display:flex;
	flex-wrap:wrap;
	gap:20px;
	background:var(--tzs-bg);
	border-radius:10px;
}
.tzs-meta li{font-size:14px;color:var(--tzs-muted);}
.tzs-meta strong{color:var(--tzs-navy);font-size:18px;display:block;}

/* Formulario de lead */
.tzs-form-intro{font-weight:600;color:var(--tzs-navy);margin:0 0 16px;}
.tzs-field{margin-bottom:16px;}
.tzs-field label{display:block;font-weight:600;font-size:14px;margin-bottom:6px;}
.tzs-field input[type=text],
.tzs-field input[type=email],
.tzs-field input[type=tel]{
	width:100%;
	padding:12px 14px;
	border:1px solid #c7d0dd;
	border-radius:8px;
	font-size:15px;
	box-sizing:border-box;
	transition:border-color .15s,box-shadow .15s;
}
.tzs-field input:focus{
	outline:none;
	border-color:var(--tzs-navy2);
	box-shadow:0 0 0 3px rgba(11,77,140,.15);
}
.tzs-field--check label{display:flex;align-items:flex-start;gap:10px;font-weight:400;cursor:pointer;}
.tzs-field--check input{margin-top:3px;flex:0 0 auto;width:18px;height:18px;}
.tzs-field--check span{font-size:14px;color:var(--tzs-muted);}

.tzs-errors{
	background:#fdecea;
	border:1px solid #f5c6c0;
	color:var(--tzs-err);
	border-radius:8px;
	padding:12px 14px;
	margin-bottom:16px;
	font-size:14px;
}
.tzs-errors ul{margin:0;padding-left:18px;}

/* Botones */
.tzs-btn{
	font-family:inherit;
	font-size:15px;
	font-weight:700;
	border:none;
	border-radius:8px;
	padding:13px 24px;
	cursor:pointer;
	transition:transform .05s,filter .15s,background .15s;
}
.tzs-btn:active{transform:translateY(1px);}
.tzs-btn--primary{
	background:linear-gradient(135deg,var(--tzs-navy),var(--tzs-navy2));
	color:#fff;
	width:100%;
}
.tzs-btn--primary:hover{filter:brightness(1.08);}
.tzs-btn--primary:disabled{opacity:.6;cursor:not-allowed;}
.tzs-btn--ghost{
	background:var(--tzs-bg);
	color:var(--tzs-navy);
}
.tzs-btn--ghost:hover{background:var(--tzs-bg2);}
.tzs-btn--ghost:disabled{opacity:.45;cursor:not-allowed;}

/* Barra superior del test */
.tzs-testbar{
	display:flex;
	align-items:center;
	gap:20px;
	margin-bottom:24px;
	flex-wrap:wrap;
}
.tzs-progress-wrap{flex:1;min-width:180px;}
.tzs-progress{
	height:10px;
	background:var(--tzs-bg2);
	border-radius:999px;
	overflow:hidden;
}
.tzs-progress-bar{
	display:block;
	height:100%;
	width:0;
	background:linear-gradient(90deg,var(--tzs-navy2),var(--tzs-gold));
	transition:width .25s;
}
.tzs-progress-text{font-size:13px;color:var(--tzs-muted);margin-top:6px;}
.tzs-timer{
	background:var(--tzs-navy);
	color:#fff;
	padding:8px 16px;
	border-radius:8px;
	font-size:14px;
}
.tzs-timer .tzs-timer-label{color:var(--tzs-gold);font-weight:600;}
.tzs-timer .tzs-timer-value{color:#fff;font-variant-numeric:tabular-nums;font-size:16px;}
.tzs-timer.tzs-timer--warning{background:var(--tzs-err);}
.tzs-timer.tzs-timer--warning .tzs-timer-label{color:#fff;}

/* Pregunta */
.tzs-question .tzs-q-enunciado{
	font-size:19px;
	font-weight:600;
	color:var(--tzs-navy);
	margin:0 0 20px;
}
.tzs-options{list-style:none;margin:0;padding:0;display:grid;gap:12px;}
.tzs-option{
	display:flex;
	align-items:center;
	gap:14px;
	border:2px solid var(--tzs-bg2);
	border-radius:10px;
	padding:14px 16px;
	cursor:pointer;
	transition:border-color .12s,background .12s;
}
.tzs-option:hover{border-color:var(--tzs-navy2);background:#f7faff;}
.tzs-option input{position:absolute;opacity:0;width:0;height:0;}
.tzs-option .tzs-letter{
	flex:0 0 auto;
	width:30px;height:30px;
	border-radius:50%;
	background:var(--tzs-bg);
	color:var(--tzs-navy);
	font-weight:700;
	display:flex;align-items:center;justify-content:center;
	transition:background .12s,color .12s;
}
.tzs-option.is-selected{border-color:var(--tzs-navy);background:#eef4fb;}
.tzs-option.is-selected .tzs-letter{background:var(--tzs-navy);color:#fff;}

/* Navegación */
.tzs-nav{
	display:flex;
	gap:12px;
	margin-top:28px;
	align-items:center;
	flex-wrap:wrap;
}
.tzs-nav .tzs-finish{margin-left:auto;}

/* Spinner de "procesando" */
.tzs-spinner{
	width:56px;height:56px;
	border:5px solid var(--tzs-bg2);
	border-top-color:var(--tzs-navy);
	border-radius:50%;
	margin:0 auto 24px;
	animation:tzs-spin 1s linear infinite;
}
@keyframes tzs-spin{to{transform:rotate(360deg);}}

/* Iconos de estado final (hecho / error) */
.tzs-icon{
	width:64px;height:64px;
	border-radius:50%;
	margin:0 auto 24px;
	display:flex;align-items:center;justify-content:center;
	font-size:36px;font-weight:700;color:#fff;line-height:1;
	animation:tzs-pop .3s ease-out;
}
.tzs-icon--ok{background:var(--tzs-ok);}
.tzs-icon--err{background:var(--tzs-err);}
@keyframes tzs-pop{0%{transform:scale(.4);opacity:0;}100%{transform:scale(1);opacity:1;}}

@media (max-width:600px){
	.tzs-card{padding:22px;}
	.tzs-title{font-size:22px;}
	.tzs-nav .tzs-finish{margin-left:0;width:100%;order:3;}
	.tzs-prev,.tzs-next{flex:1;}
}
