@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600;700&family=DM+Serif+Display:ital@0;1&display=swap');
:root{--navy:#18243a;--muted:#647184;--orange:#e7834f;--cream:#f7f3ec;--paper:#fffdfa;--line:#e6e3dd;--teal:#315d62}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--cream);color:var(--navy);font-family:'DM Sans',Arial,sans-serif;line-height:1.5}.shell{max-width:920px;padding:0 28px;margin:auto}.top{height:112px;display:flex;justify-content:space-between;align-items:center;border-bottom:1px solid #dedbd4}.brand{display:flex;gap:12px;align-items:center;color:var(--navy);text-decoration:none;font-size:13px;font-weight:700;letter-spacing:.12em;line-height:1.1}.brand small{letter-spacing:0;font-weight:400;color:var(--muted);font-size:12px}.brand-mark{width:38px;height:38px;background:var(--navy);color:white;display:grid;place-items:center;font-size:23px}.time,.eyebrow,.progress-head,.save-note,.fine,footer{color:var(--muted);font-size:13px}.intro{padding:88px 0 74px}.eyebrow{font-weight:700;letter-spacing:.16em;color:var(--teal)}h1,h2{font-family:'DM Serif Display',Georgia,serif;font-weight:400;line-height:1.04;letter-spacing:-.025em}h1{font-size:clamp(48px,7.5vw,79px);max-width:760px;margin:23px 0 26px}h1 em{color:var(--orange);font-weight:400}.lead{max-width:630px;font-size:20px;color:#485365;line-height:1.65}.intro-cards{display:grid;grid-template-columns:repeat(3,1fr);gap:15px;margin:48px 0 40px}.intro-cards div{border-top:1px solid #c9c4ba;padding:16px 0;display:flex;gap:14px}.intro-cards b{color:var(--orange)}.intro-cards span{font-size:14px}.button{border:0;min-height:52px;padding:13px 22px;font:700 15px 'DM Sans',Arial;cursor:pointer;transition:transform .16s,background .16s}.button:hover{transform:translateY(-2px)}.button:focus-visible,.option:focus-within,textarea:focus-visible,input:focus-visible{outline:3px solid var(--orange);outline-offset:3px}.primary{background:var(--navy);color:#fff;display:inline-flex;gap:34px;align-items:center;justify-content:space-between}.primary:hover{background:var(--teal)}.primary:disabled{opacity:.55;cursor:wait}.secondary{background:transparent;border:1px solid #c7c4bd;color:var(--navy)}.fine{margin-top:18px;max-width:530px}#survey{max-width:730px;margin:55px auto 70px}.progress-head{display:flex;justify-content:space-between;font-weight:700;letter-spacing:.05em;text-transform:uppercase}.progress{height:5px;background:#e1ddd4;margin:12px 0 45px}.progress div{height:100%;background:var(--orange);transition:width .3s}.step-kicker{font-size:13px;color:var(--teal);font-weight:700;letter-spacing:.14em;text-transform:uppercase}.step h2{font-size:clamp(38px,6vw,56px);margin:9px 0 14px}.step-desc{color:var(--muted);margin-bottom:38px}.question{background:var(--paper);border:1px solid var(--line);padding:25px 27px;margin-bottom:16px;box-shadow:0 8px 26px #29344708}.question.invalid{border-color:#bf5348}.question-title{font-size:18px;line-height:1.4;font-weight:700;margin:0 0 18px}.question-title .number{font-family:Georgia,serif;color:var(--orange);margin-right:8px}.req{color:#b9584a}.hint,.counter{font-size:13px;color:var(--muted);margin:0 0 14px}.options{display:grid;gap:9px}.option{display:flex;gap:13px;align-items:flex-start;padding:12px 14px;border:1px solid var(--line);background:#fff;cursor:pointer;border-radius:4px;transition:background .15s,border-color .15s}.option:hover{border-color:#9eaaa9}.option:has(input:checked){background:#e7efee;border-color:var(--teal)}.option input{accent-color:var(--teal);margin:4px 0 0;min-width:17px;height:17px}.option span{flex:1}.other-input,textarea{width:100%;border:1px solid #d7d7d1;background:white;padding:13px 14px;font:inherit;border-radius:4px;margin-top:10px;color:var(--navy)}textarea{min-height:125px;resize:vertical}.scale{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:7px}.scale .option{padding:9px 3px;justify-content:center;text-align:center;font-size:12px;display:block}.scale .option input{display:block;margin:0 auto 5px}.scale-legend{font-size:12px;color:var(--muted);margin-bottom:12px}.counter{margin:10px 0 0}.nav{display:flex;justify-content:space-between;gap:12px;margin-top:25px}.error{padding:14px;background:#fff0ed;border-left:3px solid #bf5348;color:#8c342b;margin-top:16px}.save-note{text-align:center;margin-top:24px}.done{text-align:center;padding:90px 0}.done h1{font-size:clamp(44px,6vw,66px);margin:20px auto}.done p{font-size:19px;color:var(--muted)}.done-icon{width:58px;height:58px;margin:auto;display:grid;place-items:center;background:#dcebe6;border-radius:50%;color:var(--teal);font-size:30px}footer{display:flex;justify-content:space-between;border-top:1px solid #dedbd4;padding:25px 0 40px}.trap{position:absolute;left:-9999px;opacity:0}[hidden]{display:none!important}@media(max-width:650px){.shell{padding:0 18px}.top{height:78px}.time{font-size:12px}.intro{padding:57px 0}.intro-cards{grid-template-columns:1fr;gap:3px;margin:32px 0}.lead{font-size:18px}.question{padding:20px 16px}.scale{grid-template-columns:repeat(3,1fr)}.nav .button{padding:11px 14px;gap:4px}footer{display:block}footer span{display:block;margin-top:7px}}

/* Escala de acuerdo: controles táctiles claros y estados visibles. */
.scale-intro{display:flex;justify-content:space-between;gap:14px;align-items:center;background:#e9efec;border-left:4px solid var(--teal);padding:15px 18px;margin:0 0 22px;font-size:12px;color:var(--teal);letter-spacing:.055em}.scale-intro strong{white-space:nowrap;font-size:13px;letter-spacing:0}.scale-question{padding:29px 27px}.scale-question .question-title{font-size:19px;max-width:620px;margin-bottom:24px}.scale-options{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:8px}.scale-choice{position:relative;cursor:pointer;min-height:126px;border:1px solid #dedfdc;border-radius:8px;background:#fff;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:6px;text-align:center;padding:12px 5px;color:#5b6570;transition:transform .16s,border-color .16s,background .16s,box-shadow .16s}.scale-choice:hover{transform:translateY(-3px);border-color:var(--teal);box-shadow:0 8px 20px #18243a14}.scale-input{position:absolute;opacity:0;width:1px;height:1px}.scale-choice:focus-within,.scale-na:focus-within{outline:3px solid var(--orange);outline-offset:2px}.scale-choice:has(input:checked){background:#e8f1ee;border:2px solid var(--teal);box-shadow:0 6px 18px #315d6220;color:var(--teal)}.scale-face{width:33px;height:33px;display:block}.scale-face svg{width:100%;height:100%}.tone-1 .scale-face{color:#b36761}.tone-2 .scale-face{color:#b78361}.tone-3 .scale-face{color:#899396}.tone-4 .scale-face{color:#5c9184}.tone-5 .scale-face{color:#397b6e}.scale-number{font-size:20px;font-weight:700;line-height:1}.scale-name{font-size:11px;line-height:1.2;min-height:26px;display:flex;align-items:center}.scale-check{position:absolute;right:6px;top:4px;opacity:0;color:var(--teal);font-size:13px;font-weight:700}.scale-choice:has(input:checked) .scale-check{opacity:1}.scale-na{display:flex;align-items:center;gap:10px;margin-top:12px;padding:12px 15px;border:1px solid var(--line);border-radius:7px;cursor:pointer;color:var(--muted);font-size:13px;background:#fff}.scale-na input{accent-color:var(--teal)}.scale-na span:last-child{margin-left:auto}.scale-na:has(input:checked){background:#e8f1ee;border-color:var(--teal);color:var(--teal)}.restart{margin-top:24px}.done{min-height:610px}
@media(max-width:650px){.scale-intro{display:block}.scale-intro strong{display:block;margin-top:5px}.scale-question{padding:22px 15px}.scale-options{gap:4px}.scale-choice{min-height:105px;padding:9px 2px}.scale-face{width:27px;height:27px}.scale-number{font-size:18px}.scale-name{font-size:9px;word-break:normal}.done{min-height:540px}}

.brand-mark img{display:block;width:100%;height:100%;object-fit:contain}
