:root{--red:#d71920;--red2:#aa2d37;--gray:#595959;--ink:#202635;--muted:#5f6b80;--line:#e2e5eb;--soft:#fff3f4;--ok:#20855f;--shadow:0 22px 55px rgba(40,40,50,.18);--radius:26px}
*{box-sizing:border-box}body{margin:0;min-height:100vh;font-family:Inter,system-ui,-apple-system,"Segoe UI",Roboto,Arial,sans-serif;color:var(--ink);background:radial-gradient(circle at 8% 0%,rgba(215,25,32,.18),transparent 28%),radial-gradient(circle at 95% 88%,rgba(215,25,32,.16),transparent 30%),linear-gradient(135deg,#fff6f7,#f5f5f6 52%,#ebecee);padding:34px;display:flex;align-items:center;justify-content:center}.layout{width:min(1080px,100%);display:grid;grid-template-columns:300px 1fr;gap:18px}.side,.card{background:rgba(255,255,255,.86);border:1px solid rgba(255,255,255,.85);box-shadow:var(--shadow);backdrop-filter:blur(14px)}.side{border-radius:var(--radius);padding:22px;min-height:690px;position:relative;overflow:hidden}.side:after{content:"";position:absolute;width:230px;height:230px;border-radius:50%;right:-90px;bottom:-90px;background:rgba(215,25,32,.12)}.official-logo{display:flex;align-items:center;gap:6px;background:#fff;border:1px solid var(--line);border-radius:17px;padding:10px;font-size:13px;font-weight:750;color:#fff;box-shadow:0 10px 25px rgba(30,30,30,.08)}.official-logo .crest{font-size:26px;background:#fff}.official-logo .peru{background:#ed1c24;font-size:18px;padding:12px 10px}.official-logo span:last-child{background:#555;padding:7px 10px;line-height:1.05}.brand{display:flex;gap:12px;align-items:center;margin:18px 0}.mark{width:50px;height:50px;border-radius:16px;background:linear-gradient(135deg,var(--red),#f05d65);display:grid;place-items:center;color:#fff;font-size:22px;font-weight:900}.brand h1{font-size:19px;line-height:1.15;margin:0}.brand p{margin:3px 0 0;color:var(--muted);font-size:12px;font-weight:700}.side h2{font-size:16px;margin:20px 0 14px}.route{position:relative;z-index:1}.route-item{display:grid;grid-template-columns:34px 1fr;gap:10px;margin:12px 0;align-items:start}.dot{width:34px;height:34px;border-radius:50%;display:grid;place-items:center;background:#eef0f3;border:2px solid #fff;color:#566070;font-weight:900}.route-item.active .dot{background:linear-gradient(135deg,var(--red),#777);color:white}.route-item.done .dot{background:var(--ok);color:white}.route-item strong{font-size:13px;display:block}.route-item small{color:var(--muted);font-size:12px;line-height:1.35;display:block;margin-top:3px}.note{position:relative;z-index:1;margin-top:26px;border:1px solid #ffc6cc;background:#fff3f4;border-radius:18px;padding:14px;font-size:12px;line-height:1.45}.card{border-radius:var(--radius);min-height:690px;display:flex;flex-direction:column;overflow:hidden}.topbar{height:74px;padding:18px 24px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid var(--line);background:linear-gradient(90deg,rgba(255,243,244,.8),rgba(241,242,244,.7))}.pill{border:1px solid #f0aeb5;border-radius:999px;padding:8px 12px;color:#9d1820;background:#fff;font-weight:900;font-size:13px}#stepText{font-size:13px;font-weight:800;color:var(--muted)}.content{padding:34px 28px;flex:1;display:flex;flex-direction:column;justify-content:center}.panel{border:1px solid #f0aeb5;background:linear-gradient(135deg,#fff8f9,#f8f8f9);border-radius:24px;padding:24px}.eyebrow{font-size:12px;text-transform:uppercase;letter-spacing:.08em;font-weight:950;color:var(--red);margin-bottom:12px}.question{font-size:clamp(26px,3.3vw,38px);line-height:1.12;margin:0 0 14px}.hint{font-size:16px;line-height:1.6;color:#44536d;margin:0 0 22px}.options{display:grid;gap:12px}.option{border:2px solid var(--line);border-radius:17px;padding:16px;display:flex;gap:12px;cursor:pointer;background:#fff;font-weight:800}.option:hover,.option.selected{border-color:#e78189;background:#fff7f8}.field,select,textarea,input{width:100%;border:2px solid var(--line);border-radius:15px;background:#fff;padding:14px;font-size:16px}textarea{min-height:120px}.grid{display:grid;grid-template-columns:1fr 1fr 1fr;gap:12px}.school-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px}.school-grid .full{grid-column:1/-1}.alert{color:#ad2418;background:#fff2f0;border:1px solid #ffd0c9;border-radius:14px;padding:12px;margin-top:14px;font-weight:800}.hidden{display:none!important}.footer{border-top:1px solid var(--line);padding:18px 28px 26px;background:linear-gradient(180deg,#fff,#f4f4f5)}.actions{display:flex;justify-content:space-between;gap:12px;margin-bottom:16px}.actions button{border:none;border-radius:15px;padding:14px 20px;font-weight:950;font-size:15px;cursor:pointer}.ghost{background:#eef0f3;color:#555}.main{background:linear-gradient(135deg,var(--red),#7c6e73);color:#fff;box-shadow:0 12px 25px rgba(215,25,32,.2)}.send{background:linear-gradient(135deg,#20855f,#626b67);color:#fff}.progress-row{display:grid;grid-template-columns:1fr auto;gap:12px;align-items:center}.progress{height:12px;border-radius:999px;background:#dde1e7;overflow:hidden}.progress div{height:100%;width:0;background:linear-gradient(90deg,var(--red),#ed8f96,#777);transition:.25s ease}#progressText{font-size:12px;color:var(--muted);font-weight:950}.success{max-width:720px;margin:auto}.success h2{font-size:38px;margin:0 0 12px}.success p{font-size:17px;line-height:1.6;color:#44536d}@media(max-width:900px){body{padding:12px;display:block}.layout{grid-template-columns:1fr}.side{min-height:auto}.route{display:none}.card{min-height:calc(100vh - 220px)}.grid,.school-grid{grid-template-columns:1fr}.actions{flex-direction:column-reverse}.actions button{width:100%}.topbar{height:auto;gap:10px}}

/* Corrección para que radio/checkbox no hereden width:100% de los inputs generales */
.option input[type="radio"],
.option input[type="checkbox"] {
    width: 20px;
    height: 20px;
    min-width: 20px;
    max-width: 20px;
    padding: 0;
    margin: 0;
    flex: 0 0 20px;
}

/* Branding institucional y logo configurable por encuesta */
.layout{width:min(1120px,100%);grid-template-columns:340px 1fr}
.official-logo{width:100%;max-width:100%;display:flex;align-items:center;justify-content:center;background:#fff;border:1px solid var(--line);border-radius:17px;padding:8px;overflow:hidden;color:inherit}
.official-logo img{display:block;width:92%;max-width:92%;height:auto;object-fit:contain;margin:0 auto}
.survey-logo{width:70px;height:auto;max-height:64px;object-fit:contain;display:block;flex:0 0 70px}
.option{align-items:center;justify-content:flex-start;text-align:left}
.option span,.option strong,.option label{width:auto;flex:1;text-align:left}
@media(max-width:900px){.layout{grid-template-columns:1fr}.survey-logo{width:60px;flex-basis:60px}}

/* =========================================================
   Ajustes v2.4.1 - rutas /s/{slug}, logos y radios
   ========================================================= */
.official-logo {
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    background: #fff !important;
    border: 1px solid var(--line) !important;
    border-radius: 17px !important;
    padding: 8px 10px !important;
    overflow: hidden !important;
    color: inherit !important;
}

.official-logo img {
    display: block !important;
    width: 100% !important;
    max-width: 100% !important;
    height: auto !important;
    max-height: 64px !important;
    object-fit: contain !important;
}

.survey-logo {
    width: 72px !important;
    height: 58px !important;
    object-fit: contain !important;
    display: block !important;
    flex: 0 0 72px !important;
}

.option {
    align-items: center !important;
    justify-content: flex-start !important;
    text-align: left !important;
}

.option input[type="radio"],
.option input[type="checkbox"] {
    width: 20px !important;
    height: 20px !important;
    min-width: 20px !important;
    max-width: 20px !important;
    padding: 0 !important;
    margin: 0 !important;
    flex: 0 0 20px !important;
}

/* v2.7 - matrices */
.matrix-wrap{overflow-x:auto;background:#f8fafc;border:1px solid var(--line);border-radius:18px;padding:14px;margin-top:12px}
.matrix-table{width:100%;border-collapse:separate;border-spacing:0 8px;min-width:560px}
.matrix-table th{font-size:13px;color:#334155;text-align:center;font-weight:800;padding:8px 10px}
.matrix-table th:first-child{text-align:left;width:48%}
.matrix-table td{background:#fff;padding:10px;border-top:1px solid #e5e7eb;border-bottom:1px solid #e5e7eb;text-align:center}
.matrix-table td:first-child{border-left:1px solid #e5e7eb;border-radius:12px 0 0 12px;text-align:left}
.matrix-table td:last-child{border-right:1px solid #e5e7eb;border-radius:0 12px 12px 0}
.matrix-row-label{font-size:14px;line-height:1.35;color:#0f172a}
.matrix-table input[type="radio"],.matrix-table input[type="checkbox"]{width:20px;height:20px;accent-color:#2563eb}
.linked-note{background:#eef2ff;border:1px solid #c7d2fe;border-radius:14px;padding:10px 12px;margin-bottom:12px;color:#312e81}

/* Mensaje final configurable */
.final-image{
  display:block;
  width:min(100%, 420px);
  max-height:220px;
  object-fit:contain;
  margin:0 auto 18px auto;
  border-radius:18px;
  background:#fff;
}
.final-link-wrap{ margin-top:16px; }
.final-link{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  padding:12px 18px;
  border-radius:999px;
  font-weight:800;
  text-decoration:none;
  background:#0f766e;
  color:#fff;
}

/* v3.2 - Pie institucional sutil */
.public-system-footer{position:fixed;left:0;right:0;bottom:4px;text-align:center;color:#7a8496;font-size:11px;font-weight:700;pointer-events:none;opacity:.8}
@media(max-width:900px){.public-system-footer{position:static;margin:10px 0 14px}}


/* v3.6 - limite visual para preguntas checkbox con max_choices */
.option.limit-disabled{
    opacity:.48;
    cursor:not-allowed !important;
    background:#f3f4f6 !important;
    border-color:#e5e7eb !important;
}
.option.limit-disabled:hover{
    background:#f3f4f6 !important;
    border-color:#e5e7eb !important;
}
.option.limit-disabled input[type="checkbox"]{
    cursor:not-allowed;
}

.school-info{display:flex;flex-wrap:wrap;gap:8px 14px;margin-top:-8px;margin-bottom:18px;padding:12px 14px;border:1px solid #dce3ed;border-radius:14px;background:#f8fafc;color:#44536d;font-size:14px}.school-info span{display:inline-flex;gap:5px}.school-info strong{color:#273449}

.mt-12{margin-top:12px}
.progress {
    height: 12px;
    min-width: 120px;
    border-radius: 999px;
    background: #dde1e7;
    overflow: hidden;
}

#progressBar {
    display: block;
    height: 100%;
    width: 0;
    min-width: 0;
    border-radius: inherit;
    background: #d71920;
    background: linear-gradient(90deg, #d71920 0%, #e65761 55%, #20855f 100%);
    transition: width .25s ease;
}