:root{
  --bg: #f6f7fb;
  --card: #ffffff;
  --muted: #6b7280;
  --accent: #2b6cb0;
  --radius: 10px;
  --maxw: 1100px;
}

/* Reset / base */
*{box-sizing:border-box;margin:0;padding:0}
html,body{height:100%}
body{
  font-family: Inter, system-ui, -apple-system, 'Helvetica Neue', Arial, sans-serif;
  line-height:1.45;
  background:var(--bg);
  color:#111;
  margin:0;
  padding:24px;
}

.container{max-width:var(--maxw);margin:0 auto;background:transparent}

/* Header */
.site-header{display:grid;grid-template-columns:72px 1fr 180px;align-items:center;gap:18px;padding:18px 0}
.header-left{display:flex;align-items:center}
.logo{width:72px;height:auto;border-radius:8px;box-shadow:0 6px 18px rgba(15,23,42,0.06)}
.header-center{text-align:center}
.header-center h1{font-size:20px;margin:0;color:#0f172a;font-weight:700}
.header-center h2{font-size:14px;margin:6px 0 0;color:#0b2540;font-weight:600}
.header-right{text-align:right}
.header-right h2{font-size:13px;margin:0;color:var(--muted);font-weight:500;padding-bottom:6px;border-bottom:3px solid rgba(43,108,176,0.08)}

.titulo-fondamento{background:linear-gradient(90deg, rgba(43,108,176,0.06), rgba(43,108,176,0.02));padding:10px;border-radius:8px;color:#0f172a;margin-bottom:18px}

/* Sections */
section{background:var(--card);padding:18px;border-radius:10px;margin-bottom:16px;box-shadow:0 6px 18px rgba(15,23,42,0.04)}
section h2{font-size:16px;margin:0 0 12px}

.datos-generales{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.campo{min-width:180px;margin-bottom:10px}
label{display:block;font-size:13px;color:var(--muted);margin-bottom:6px}
input[type=text],input[type=date],input[type=number],select,textarea{width:100%;padding:8px 10px;border:1px solid #e6e9ef;border-radius:8px;background:#fff}

.opciones{display:flex;gap:10px;flex-wrap:wrap}
.opcion{display:flex;align-items:center;gap:6px}
.instrucciones{font-size:13px;color:var(--muted);margin-bottom:8px}

.escala-tabla{width:100%;border-collapse:collapse}
.escala-tabla th,.escala-tabla td{border:1px solid #eef2f7;padding:8px;text-align:left;font-size:13px}
.escala-tabla thead th{background:#fbfdff;color:#223}
.escala-tabla tbody tr:nth-child(even){background:#fafbff}

input[type=radio]{transform:scale(1.05)}
input[type=text].small{width:90%}

.btns{display:flex;gap:8px;margin-top:12px}
.btn{background:var(--accent);color:#fff;padding:8px 14px;border-radius:8px;border:none;cursor:pointer}
.btn.secondary{background:#eef2f7;color:var(--accent)}

/* Action buttons at page bottom */
.action-buttons{display:flex;gap:18px;justify-content:center;padding:20px 0}
.action-buttons .btn{padding:10px 18px;font-weight:600}
.action-buttons .btn.secondary{background:#f3f6fb;color:var(--accent);border:1px solid rgba(43,108,176,0.12)}
.action-buttons .btn svg{vertical-align:middle;margin-right:8px;fill:currentColor}
.action-buttons .btn svg path{fill:currentColor}

/* Accessibility helpers */
input:focus,select:focus,textarea:focus{outline:3px solid rgba(43,108,176,0.12);outline-offset:2px}

/* Form helpers */
.fechas{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.escala-tabla{font-size:13px}

.interpretacion{background-color:#ecf0f1;padding:15px;border-left:4px solid #3498db;margin:15px 0;border-radius:4px}

.firma-section{margin-top:30px;page-break-inside:avoid}
.firma-line{border-bottom:1px solid #2c3e50;width:250px;display:inline-block;margin:20px 0}

.instrucciones{background-color:#ffeaa7;padding:12px;border-radius:4px;margin:15px 0;font-size:12px;font-style:italic}

.titulo-fondamento{font-size:12px;color:#7f8c8d;margin:15px 0;background-color:#ecf0f1;padding:10px;border-radius:4px}

.action-buttons{text-align:center;margin-top:30px;margin-bottom:20px}
button{background-color:#3498db;color:white;padding:10px 20px;border:none;border-radius:4px;cursor:pointer;font-size:12px;margin:10px 5px}
button:hover{background-color:#2980b9}

.total-box{background-color:#3498db;color:white;padding:20px;border-radius:4px;font-size:14px;font-weight:bold;text-align:center;margin:20px 0}
.total-box span{font-size:24px}

.page-break{page-break-after:always}

.compromiso{font-size:12px;line-height:1.6}

@media (max-width:760px){
  .site-header{grid-template-columns:64px 1fr;gap:12px}
  .datos-generales{grid-template-columns:1fr}
  .header-right{display:none}
}

@media print{
  body{background-color:white}
  .action-buttons button{display:none}
  .container{box-shadow:none;padding:0}
}