/* Escala compacta para celulares; los controles conservan áreas táctiles amplias. */
@media(max-width:600px){
 body{font-size:14px;line-height:1.5}
 .container-wide{padding-left:18px;padding-right:18px}
 h2,.section-heading h2{font-size:24px;line-height:1.2}
 h3{font-size:17px;line-height:1.3}
 .section{padding:32px 0}
 .section-heading{margin-bottom:20px}
 .section-heading p{font-size:14px;margin-top:10px;line-height:1.55}
 .eyebrow{font-size:10px;letter-spacing:.1em;margin-bottom:11px}
 .hero-copy{padding-top:18px;padding-bottom:22px}
 .hero-copy .hero-headline{font-size:clamp(1.85rem,7.6vw,2.35rem);line-height:1.08;margin-bottom:15px}
 .hero-copy .hero-description{font-size:14px;line-height:1.5;margin-bottom:18px}
 .hero-copy .hero-product-label{margin-bottom:12px}
 .hero-copy .hero-assurance{font-size:11px}
 .hero-stage{padding-top:22px;padding-bottom:30px;max-width:410px}
 .hero-stage .preview-card{padding:15px}
 .hero-stage .preview-card h3{font-size:15px!important;margin:14px 0!important}
 .hero-stage .preview-card .option{font-size:13px}
 .trust-inner{gap:15px;padding-top:18px;padding-bottom:18px;font-size:12px}
 #como-funciona .grid-3{grid-template-columns:1fr!important;gap:0}
 #como-funciona .step{display:grid;grid-template-columns:34px minmax(0,1fr);gap:5px 12px;padding:15px 0;border-bottom:1px solid var(--line)}
 #como-funciona .step:last-child{border-bottom:0;padding-bottom:0}
 #como-funciona .step-num{grid-column:1;grid-row:1 / span 2;font-size:12px;margin:0;padding-top:3px;line-height:1.4}
 #como-funciona .step h3{grid-column:2;font-size:16px;line-height:1.3;margin:0}
 #como-funciona .step p{grid-column:2;font-size:13px;line-height:1.5;margin:0}
 .profile-tile{padding:14px;gap:11px}
 .profile-tile strong{font-size:14px;line-height:1.35}
 .profile-tile .icon-box{width:38px;height:38px;border-radius:10px}
 .grid-3,.grid-2{gap:14px}
 .cta-panel{padding:23px;gap:19px}
 .cta-panel h2{font-size:24px}
 .cta-panel p{font-size:14px}
 .faq{margin-top:18px}
 .faq details{padding:15px 0}
 .faq summary{font-size:14px}
 .faq p{font-size:13px;margin-top:10px}
 .footer{padding:23px 0}
 .auth-wrap{padding:0 18px;margin-top:10px;gap:6px}
 .auth-story{padding:12px 0}
 .auth-story h1{font-size:27px}
 .auth-story p{font-size:14px;margin-bottom:10px}
 .auth-form{padding:20px}
 .auth-form h2{font-size:23px!important}
 .form-grid{gap:13px}
 .field{gap:5px}
 .field label{font-size:12px}
 .form-control,.form-select{font-size:16px;min-height:44px;padding-top:9px;padding-bottom:9px}
 .btn{font-size:13px;min-height:44px;padding:10px 14px}
 .workspace{padding:20px 16px 24px}
 .page-heading{margin-bottom:20px;gap:12px}
 .page-heading h1{font-size:24px;line-height:1.2;margin-bottom:6px}
 .page-heading p{font-size:13px;line-height:1.5}
 .card-box{padding:18px;border-radius:13px}
 .card-heading{margin-bottom:17px}
 .card-heading h2{font-size:16px}
 .practice-banner{padding:23px;gap:18px}
 .practice-banner h2{font-size:22px}
 .practice-banner p{font-size:13px}
 .stats{gap:10px;margin:17px 0}
 .stat{padding:14px}
 .stat-label{font-size:12px}
 .stat-value{font-size:24px;margin-top:6px}
 .stat-note{font-size:12px}
 .question-card h2{font-size:18px;line-height:1.45;margin:20px 0}
 .question-card .option{font-size:14px;padding:12px;gap:11px;min-height:52px;margin:9px 0}
 .question-nav{margin-top:20px;padding-top:18px}
 .question-map{padding:17px}
 .result-hero h2{font-size:22px!important}
 .review-card h3{font-size:16px;line-height:1.5}
 .review-card .option{font-size:14px;padding:12px}
 .explanation{font-size:13px;padding:14px}
 .notice{font-size:13px;padding:12px 14px}
 .empty-state{padding:25px 12px}
 .empty-state h3{font-size:16px}
 .empty-state p{font-size:13px}
 .toolbar{gap:10px;margin-bottom:16px}
 .data-table.responsive tbody{gap:13px;padding-left:3px;padding-right:3px}
 .data-table.responsive td{padding:6px 0}
 .data-table.responsive td:first-child{padding-bottom:10px}
 .modal-head{padding:18px}
 .modal-head h2{font-size:19px}
 .modal-body-custom{padding:18px}
 .modal-footer-custom{padding-top:18px}
 .tabs{margin-bottom:18px;gap:4px}
 .tabs button{font-size:13px;padding:9px 11px;min-height:44px}
 .pill-selection label{font-size:13px;padding:8px 10px}
}
