/* AGESCONT — Cuestionario minerales · estilo Ant Design Pro sobrio */
:root{
  --brand:#004c97;
  --brand-600:#00417f;
  --accent:#1677ff;
  --accent-100:#e6f0fb;
  --ink:#1f2733;
  --ink-2:#5b6673;
  --ink-3:#8a94a3;
  --line:#e6e9ef;
  --line-2:#d7dce4;
  --bg:#f0f2f5;
  --card:#ffffff;
  --ok:#237804;
  --radius:8px;
  --shadow:0 1px 2px rgba(15,34,66,.04), 0 1px 3px rgba(15,34,66,.03);
}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{
  margin:0;background:var(--bg);color:var(--ink);
  font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,"PingFang SC","Noto Sans",sans-serif;
  font-size:14px;line-height:1.6;
}
a{color:var(--accent);text-decoration:none}
a:hover{text-decoration:underline}
.wrap{max-width:820px;margin:0 auto;padding:24px 16px 80px}

/* Encabezado */
.masthead{
  background:var(--card);border:1px solid var(--line);border-radius:var(--radius);
  box-shadow:var(--shadow);padding:22px 26px;display:flex;gap:18px;align-items:center;margin-bottom:20px;
}
.masthead img{height:52px;width:auto;display:block}
.masthead .mh-txt h1{margin:0;font-size:19px;font-weight:600;letter-spacing:.1px;color:var(--ink)}
.masthead .mh-txt p{margin:3px 0 0;color:var(--ink-2);font-size:13px}
.mh-rule{height:3px;background:linear-gradient(90deg,var(--brand),var(--accent) 70%,#47a8d1);border-radius:0 0 var(--radius) var(--radius);margin:-20px 0 20px}

/* Bloque introducción */
.intro{
  background:var(--card);border:1px solid var(--line);border-left:3px solid var(--brand);
  border-radius:var(--radius);box-shadow:var(--shadow);padding:18px 22px;margin-bottom:20px;color:var(--ink-2);
}
.intro b{color:var(--ink)}

/* Tarjeta de sección */
.section{
  background:var(--card);border:1px solid var(--line);border-radius:var(--radius);
  box-shadow:var(--shadow);padding:8px 26px 22px;margin-bottom:18px;
}
.section-head{display:flex;align-items:center;gap:12px;padding:16px 0 6px;border-bottom:1px solid var(--line);margin-bottom:14px}
.section-num{
  flex:none;width:26px;height:26px;border-radius:6px;background:var(--brand);color:#fff;
  font-size:13px;font-weight:600;display:flex;align-items:center;justify-content:center;
}
.section-head h2{margin:0;font-size:15.5px;font-weight:600;color:var(--ink)}
.section-note{color:var(--ink-2);font-size:13px;margin:0 0 16px;background:#f7f9fc;border-radius:6px;padding:12px 14px}

/* Preguntas */
.q{padding:14px 0;border-top:1px dashed var(--line)}
.q:first-of-type{border-top:none}
.q-label{display:flex;gap:10px;font-weight:500;color:var(--ink);margin-bottom:8px;font-size:14px}
.q-n{flex:none;color:var(--ink-3);font-variant-numeric:tabular-nums;min-width:20px}
.q-hint{color:var(--ink-3);font-size:12.5px;margin:-2px 0 10px 30px}

input[type=text],input[type=email],input[type=tel],input[type=date],textarea,select{
  width:100%;border:1px solid var(--line-2);border-radius:6px;padding:9px 12px;font:inherit;color:var(--ink);
  background:#fff;transition:border-color .15s, box-shadow .15s;
}
input[type=text]:focus,input[type=email]:focus,input[type=tel]:focus,input[type=date]:focus,textarea:focus,select:focus{
  outline:none;border-color:var(--accent);box-shadow:0 0 0 3px rgba(22,119,255,.12);
}
textarea{min-height:82px;resize:vertical}
.field-indent{margin-left:30px}

/* Opciones radio / checkbox como tarjetas */
.opts{display:flex;flex-wrap:wrap;gap:8px;margin-left:30px}
.opt{
  position:relative;display:inline-flex;align-items:center;gap:8px;
  border:1px solid var(--line-2);border-radius:20px;padding:7px 14px 7px 12px;cursor:pointer;
  color:var(--ink-2);background:#fff;transition:all .12s;user-select:none;font-size:13.5px;
}
.opt:hover{border-color:var(--accent);color:var(--ink)}
.opt input{position:absolute;opacity:0;width:0;height:0}
.opt .dot{width:14px;height:14px;border:1.5px solid var(--line-2);border-radius:50%;flex:none;transition:all .12s}
.opt .box{width:14px;height:14px;border:1.5px solid var(--line-2);border-radius:4px;flex:none;transition:all .12s}
.opt:has(input:checked){border-color:var(--accent);background:var(--accent-100);color:var(--brand-600);font-weight:500}
.opt:has(input:checked) .dot{border-color:var(--accent);box-shadow:inset 0 0 0 3px var(--accent)}
.opt:has(input:checked) .box{border-color:var(--accent);background:var(--accent);position:relative}
.opt:has(input:checked) .box::after{content:"";position:absolute;left:3.5px;top:1px;width:4px;height:8px;border:solid #fff;border-width:0 2px 2px 0;transform:rotate(45deg)}

.subtext{margin:10px 0 0 30px}
.subtext label{display:block;font-size:12.5px;color:var(--ink-3);margin-bottom:5px}

/* Datos de contacto */
.grid2{display:grid;grid-template-columns:1fr 1fr;gap:14px}
@media(max-width:620px){.grid2{grid-template-columns:1fr}.opts,.q-hint,.field-indent,.subtext{margin-left:0}.q-label{gap:6px}}

/* Botonera */
.actions{position:sticky;bottom:0;background:linear-gradient(180deg,rgba(240,242,245,0),var(--bg) 40%);padding:20px 0 4px;margin-top:8px;display:flex;justify-content:flex-end;gap:12px}
.btn{
  border:1px solid var(--brand);background:var(--brand);color:#fff;border-radius:6px;
  padding:11px 26px;font:inherit;font-weight:600;cursor:pointer;transition:all .12s;box-shadow:var(--shadow);
}
.btn:hover{background:var(--brand-600);border-color:var(--brand-600)}
.btn.ghost{background:#fff;color:var(--ink-2);border-color:var(--line-2);font-weight:500}
.btn.ghost:hover{color:var(--ink);border-color:var(--ink-3)}

.footnote{color:var(--ink-3);font-size:12px;text-align:center;margin-top:26px}

/* Confirmación */
.done{background:var(--card);border:1px solid var(--line);border-radius:var(--radius);box-shadow:var(--shadow);padding:40px 32px;text-align:center}
.done .check{width:56px;height:56px;border-radius:50%;background:#eaf6e8;margin:0 auto 18px;position:relative}
.done .check::after{content:"";position:absolute;left:20px;top:15px;width:12px;height:22px;border:solid var(--ok);border-width:0 3px 3px 0;transform:rotate(45deg)}
.done h2{margin:0 0 8px;font-size:20px;color:var(--ink)}
.done p{color:var(--ink-2);margin:0 auto;max-width:520px}

/* ---- Panel interno ---- */
.admin-bar{background:var(--brand);color:#fff;padding:12px 20px;display:flex;align-items:center;gap:14px}
.admin-bar h1{margin:0;font-size:15px;font-weight:600}
.admin-bar .sp{flex:1}
.admin-bar a{color:#cfe0f3}
.table{width:100%;border-collapse:collapse;background:#fff;border-radius:var(--radius);overflow:hidden;box-shadow:var(--shadow);border:1px solid var(--line)}
.table th{background:#f7f9fc;text-align:left;font-size:12px;text-transform:uppercase;letter-spacing:.4px;color:var(--ink-3);padding:11px 14px;border-bottom:1px solid var(--line)}
.table td{padding:12px 14px;border-bottom:1px solid var(--line);vertical-align:top}
.table tr:last-child td{border-bottom:none}
.table tr:hover td{background:#fafbfd}
.tag{display:inline-block;font-size:11.5px;padding:2px 9px;border-radius:12px;background:var(--accent-100);color:var(--brand-600);font-weight:500}
.a-detail{background:#fff;border:1px solid var(--line);border-radius:var(--radius);box-shadow:var(--shadow);padding:6px 24px 20px;margin-bottom:18px}
.a-q{padding:11px 0;border-top:1px dashed var(--line)}
.a-q:first-child{border-top:none}
.a-q .lab{color:var(--ink-2);font-size:13px}
.a-q .lab .n{color:var(--ink-3);margin-right:6px}
.a-q .ans{color:var(--ink);font-weight:500;margin-top:3px;white-space:pre-wrap}
.a-q .ans.empty{color:var(--ink-3);font-weight:400;font-style:italic}
.anexo{background:#fffdf5;border:1px solid #f0e6c8;border-radius:var(--radius);padding:6px 22px 18px;margin-top:22px}
.anexo .a-hd{display:flex;align-items:center;gap:10px;padding:14px 0 6px;border-bottom:1px solid #f0e6c8;margin-bottom:8px}
.anexo .a-hd b{font-size:14px;color:#8a6d00}
.anexo .a-hd span{font-size:11.5px;color:#b08900;background:#fbf1cf;padding:2px 8px;border-radius:10px}
.anexo h4{margin:14px 0 4px;font-size:13px;color:var(--ink)}
.anexo p{margin:0;color:var(--ink-2);font-size:13px}
.login{max-width:360px;margin:12vh auto 0;background:#fff;border:1px solid var(--line);border-radius:var(--radius);box-shadow:var(--shadow);padding:28px}
.login h1{font-size:17px;margin:0 0 4px}
.login p{color:var(--ink-3);font-size:13px;margin:0 0 18px}
.login input{margin-bottom:14px}
.err{background:#fff1f0;border:1px solid #ffccc7;color:#a8071a;padding:9px 12px;border-radius:6px;font-size:13px;margin-bottom:14px}