.utility-intro{padding:62px max(20px,calc((100% - var(--max))/2)) 40px;background:radial-gradient(circle at 82% 0,rgba(32,217,255,.17),transparent 32%),#041329}.utility-intro h1{max-width:850px;margin-bottom:16px;font-size:clamp(2.5rem,6vw,4.7rem)}.utility-intro>p:last-child{max-width:760px;color:var(--muted);font-size:1.05rem}.utility-shell{display:grid;grid-template-columns:minmax(0,1fr) minmax(300px,.65fr);gap:24px;max-width:var(--max);margin:auto;padding:46px 24px 80px;align-items:start}.utility-card,.utility-output{padding:34px;border:1px solid var(--line);border-radius:24px;background:linear-gradient(155deg,rgba(12,41,77,.94),rgba(4,20,42,.98));box-shadow:0 24px 70px rgba(0,0,0,.22)}.utility-card h2,.utility-output h2{font-size:1.75rem}.utility-fields{display:grid;gap:18px;margin-top:24px}.utility-fields label{display:grid;gap:7px;font-weight:800}.utility-fields small,.utility-help,.utility-output p{color:var(--muted)}.utility-fields input,.utility-fields textarea,.utility-fields select{width:100%;min-height:52px;padding:12px 14px;border:1px solid rgba(163,205,242,.25);border-radius:12px;background:#03152d;color:var(--text);font:inherit}.utility-fields textarea{min-height:120px;resize:vertical}.utility-fields input:focus,.utility-fields textarea:focus,.utility-fields select:focus{outline:3px solid rgba(32,217,255,.3);border-color:var(--cyan)}.utility-action{width:100%;margin-top:24px;border:0;cursor:pointer}.utility-secondary{width:100%;margin-top:12px;padding:12px;border:1px solid var(--line);border-radius:12px;background:transparent;color:#dce9f8;font-weight:800;cursor:pointer}.utility-output{position:sticky;top:96px}.output-box{margin-top:18px;padding:18px;border:1px solid var(--line);border-radius:14px;background:#021329;overflow-wrap:anywhere}.output-box strong{display:block;color:var(--cyan);font-size:1.15rem}.cta-strip{max-width:var(--max);margin:0 auto 80px;padding:28px;border:1px solid rgba(32,217,255,.3);border-radius:20px;background:linear-gradient(135deg,rgba(14,61,117,.8),rgba(4,25,54,.96));text-align:center}.cta-strip p{color:var(--muted)}.qr-box{display:grid;place-items:center;min-height:260px;margin-top:18px;padding:20px;border-radius:16px;background:white}.qr-box:empty::before{content:'Tu código aparecerá aquí';color:#526274}.password-result{font-family:ui-monospace,SFMono-Regular,Consolas,monospace;font-size:1.2rem}.range-row{display:grid;grid-template-columns:1fr auto;gap:12px;align-items:center}.range-row output{min-width:48px;text-align:center;color:var(--cyan);font-weight:900}.checks{display:grid;grid-template-columns:1fr 1fr;gap:10px}.checks label{display:flex;gap:9px;align-items:center;font-weight:600}.checks input{width:20px;min-height:20px;accent-color:var(--cyan)}.image-preview{max-height:330px;object-fit:contain;border-radius:12px;background:#fff}.stat-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:15px}.stat-grid div{padding:14px;border-radius:12px;background:rgba(255,255,255,.05)}.stat-grid span{display:block;color:var(--muted);font-size:.8rem}.calc-grid{display:grid;grid-template-columns:1fr 1fr;gap:16px}.result-big{display:block;margin-top:8px;color:var(--cyan);font-size:clamp(2rem,5vw,3.2rem);font-weight:950}.tool-explainer{max-width:var(--max);margin:auto;padding:0 24px 80px}.tool-explainer-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}.tool-explainer article{padding:24px;border:1px solid var(--line);border-radius:16px;background:var(--card)}.tool-explainer h3{margin-bottom:8px}.tool-explainer p{color:var(--muted)}@media(max-width:850px){.utility-shell{grid-template-columns:1fr}.utility-output{position:static}.tool-explainer-grid{grid-template-columns:1fr}}@media(max-width:620px){.utility-intro{padding:46px 20px 34px}.utility-shell{padding:28px 20px 60px}.utility-card,.utility-output{padding:24px 20px}.checks,.calc-grid{grid-template-columns:1fr}}
