/* ECEP · Runner de prueba real */
.ecq-wrap{ max-width:780px; margin:0 auto; padding:28px 18px 60px; font-family:Inter,system-ui,sans-serif; color:#0f172a; }
.ecq-eyebrow{ display:inline-flex; align-items:center; gap:7px; font:700 12px/1 Inter,sans-serif; letter-spacing:.05em; text-transform:uppercase; color:#0e7d8a; background:#e4f1f2; padding:6px 13px; border-radius:999px; }

/* intro */
.ecq-intro{ background:#fff; border:1px solid #e2e8f0; border-radius:20px; padding:34px 30px; box-shadow:0 20px 50px -30px rgba(15,23,42,.25); }
.ecq-intro h1{ font:800 27px/1.2 Poppins,sans-serif; margin:14px 0 10px; }
.ecq-intro p{ color:#475569; line-height:1.6; }
.ecq-tips{ list-style:none; padding:0; margin:18px 0; display:flex; flex-direction:column; gap:9px; }
.ecq-tips li{ display:flex; align-items:center; gap:10px; color:#334155; font-size:14.5px; }
.ecq-tips i{ color:#0e7d8a; }
.ecq-resume{ background:#fef9c3; border:1px solid #fde68a; border-radius:11px; padding:11px 14px; font-size:14px; color:#854d0e; margin-bottom:16px; }
.ecq-introbtns{ display:flex; gap:10px; flex-wrap:wrap; }
.ecq-start{ background:#0e7d8a; color:#fff; border:0; border-radius:13px; padding:14px 26px; font:700 16px Inter,sans-serif; cursor:pointer; }
.ecq-start:hover{ background:#0a6470; }
.ecq-reset{ background:#f1f5f9; color:#475569; border:0; border-radius:13px; padding:14px 20px; font:600 15px Inter,sans-serif; cursor:pointer; }

/* run */
.ecq-top{ margin-bottom:16px; }
.ecq-prog{ height:7px; background:#e2e8f0; border-radius:999px; overflow:hidden; }
.ecq-prog span{ display:block; height:100%; background:linear-gradient(90deg,#0e7d8a,#14b8a6); transition:width .3s; }
.ecq-meta{ font-size:12.5px; color:#64748b; margin-top:7px; font-weight:600; }
.ecq-card{ background:#fff; border:1px solid #e2e8f0; border-radius:18px; padding:26px 24px; box-shadow:0 12px 36px -24px rgba(15,23,42,.2); position:relative; }
.ecq-num{ position:absolute; top:-14px; left:22px; width:34px; height:34px; border-radius:10px; background:#0e7d8a; color:#fff; display:grid; place-items:center; font:800 16px Poppins,sans-serif; }
.ecq-texto{ background:#f8fafc; border:1px solid #e2e8f0; border-left:4px solid #94a3b8; border-radius:10px; padding:12px 15px; margin:8px 0 16px; font-size:14px; color:#334155; line-height:1.55; }
.ecq-texto .tt{ display:block; font-weight:700; color:#475569; font-size:12px; text-transform:uppercase; letter-spacing:.04em; margin-bottom:6px; }
.ecq-enun{ font-size:16.5px; line-height:1.6; color:#0f172a; margin:8px 0 16px; font-weight:500; }
.ecq-img{ margin:0 0 18px; border:1px solid #e2e8f0; border-radius:12px; overflow:hidden; background:#fff; }
.ecq-img img{ display:block; width:100%; height:auto; }
.ecq-img figcaption{ font-size:12px; color:#64748b; padding:8px 12px; background:#f8fafc; border-top:1px solid #e2e8f0; }
.ecq-alts{ display:flex; flex-direction:column; gap:10px; }
.ecq-alt{ display:flex; align-items:flex-start; gap:12px; width:100%; text-align:left; background:#fff; border:2px solid #e2e8f0; border-radius:13px; padding:13px 15px; cursor:pointer; font:500 15px/1.45 Inter,sans-serif; color:#1e293b; transition:border-color .15s, background .15s; }
.ecq-alt:hover:not(:disabled){ border-color:#0e7d8a; background:#f0fdfa; }
.ecq-alt .lt{ flex:0 0 auto; width:26px; height:26px; border-radius:7px; background:#f1f5f9; color:#475569; display:grid; place-items:center; font-weight:800; font-size:14px; }
.ecq-alt.ok{ border-color:#16a34a; background:#dcfce7; }
.ecq-alt.ok .lt{ background:#16a34a; color:#fff; }
.ecq-alt.bad{ border-color:#dc2626; background:#fee2e2; }
.ecq-alt.bad .lt{ background:#dc2626; color:#fff; }
.ecq-alt.dim{ opacity:.6; }
.ecq-alt:disabled{ cursor:default; }
.ecq-verdict{ margin-top:15px; padding:12px 15px; border-radius:11px; font-size:14.5px; font-weight:600; display:flex; align-items:center; gap:9px; }
.ecq-verdict.ok{ background:#dcfce7; color:#15803d; }
.ecq-verdict.bad{ background:#fee2e2; color:#b91c1c; }
.ecq-nav{ display:flex; gap:10px; margin-top:20px; flex-wrap:wrap; }
.ecq-nav button{ border:0; border-radius:11px; padding:12px 18px; font:700 14.5px Inter,sans-serif; cursor:pointer; display:inline-flex; align-items:center; gap:7px; }
.ecq-prev,.ecq-grid-btn,.ecq-back{ background:#f1f5f9; color:#334155; }
.ecq-next,.ecq-fin{ background:#0e7d8a; color:#fff; margin-left:auto; }
.ecq-next:hover,.ecq-fin:hover{ background:#0a6470; }
.ecq-nav button:disabled{ opacity:.4; cursor:default; }
.ecq-reset2{ background:#fef2f2; color:#b91c1c; }

/* grid */
.ecq-gtitle{ font:800 20px Poppins,sans-serif; margin:0 0 16px; }
.ecq-grid{ display:grid; grid-template-columns:repeat(auto-fill,minmax(46px,1fr)); gap:8px; }
.ecq-grid .g{ aspect-ratio:1; border:2px solid #e2e8f0; background:#fff; border-radius:10px; font-weight:700; color:#475569; cursor:pointer; }
.ecq-grid .g.ok{ border-color:#16a34a; background:#dcfce7; color:#15803d; }
.ecq-grid .g.bad{ border-color:#dc2626; background:#fee2e2; color:#b91c1c; }

/* resultado */
.ecq-result{ background:#fff; border:1px solid #e2e8f0; border-radius:20px; padding:36px 30px; text-align:center; box-shadow:0 20px 50px -30px rgba(15,23,42,.25); }
.ecq-big{ font:800 64px/1 Poppins,sans-serif; color:#0f172a; margin:14px 0 4px; }
.ecq-big span{ font-size:30px; color:#94a3b8; }
.ecq-pct{ font:800 22px Poppins,sans-serif; margin-bottom:8px; }
.ecq-pct.ok{ color:#15803d; } .ecq-pct.bad{ color:#b45309; }
.ecq-result .ecq-nav{ justify-content:center; }
.ecq-result .ecq-back{ background:#0e7d8a; color:#fff; }

/* crédito CPEIP */
.ecq-credit{ margin:24px auto 0; max-width:680px; text-align:center; font-size:12px; line-height:1.5; color:#94a3b8; border-top:1px solid #e2e8f0; padding-top:14px; }
.ecq-credit b{ color:#64748b; font-weight:700; }