*{margin:0;padding:0;box-sizing:border-box;-webkit-user-select:none;-moz-user-select:none;user-select:none;-webkit-touch-callout:none}

body{font-family:'Inter','Segoe UI',Arial,sans-serif;background:#d7d7d7;min-height:100vh;padding:20px;display:flex;flex-direction:column;align-items:center;justify-content:center}

.container{background:#fff;border-radius:20px;padding:40px;margin:20px auto;max-width:600px;width:100%;box-shadow:0 20px 60px rgba(0,0,0,.3);animation:slideUp .5s ease-out}

@keyframes slideUp{from{opacity:0;transform:translateY(30px)}to{opacity:1;transform:translateY(0)}}

.header{text-align:center;margin-bottom:30px}

.logo{font-size:60px;margin-bottom:15px;animation:bounce 2s infinite}

@keyframes bounce{0%,100%{transform:translateY(0)}50%{transform:translateY(-10px)}}

h1{color:#1a202c;font-size:28px;font-weight:700;margin-bottom:10px}

.subtitle{color:#718096;font-size:16px;line-height:1.6;margin-bottom:20px}

.horario-info{color:#4a5568;font-size:14px;margin-top:10px;padding:10px;background:#f7fafc;border-radius:8px;border-left:4px solid #DFBC44}

.question-form{animation:fadeIn .4s ease}

@keyframes fadeIn{from{opacity:0}to{opacity:1}}

h2{color:#2d3748;font-size:22px;font-weight:600;margin-bottom:25px;text-align:center}

.button-group{display:flex;flex-direction:column;gap:15px}

.btn{display:flex;align-items:center;justify-content:center;gap:12px;padding:18px 30px;border:2px solid transparent;border-radius:12px;font-size:16px;font-weight:600;cursor:pointer;transition:all .3s ease;width:100%;text-decoration:none;border:none;font-family:inherit;user-select:none}

.btn .emoji{font-size:24px}

.btn-primary{background:linear-gradient(135deg,#667eea,#764ba2);color:#fff}

.btn-primary:hover{transform:translateY(-2px);box-shadow:0 10px 25px rgba(102,126,234,.4)}

.btn-secondary{background:#fff;color:#667eea;border:2px solid #667eea}

.btn-secondary:hover{background:#667eea;color:#fff;transform:translateY(-2px);box-shadow:0 10px 25px rgba(102,126,234,.3)}

.btn-success{background:linear-gradient(135deg,#48bb78,#38a169);color:#fff}

.btn-success:hover{transform:translateY(-2px);box-shadow:0 10px 25px rgba(72,187,120,.4)}

.btn:active{transform:scale(.98)}

.form-group{margin-bottom:20px;text-align:left}

.form-group input,.form-group select,.form-group textarea{width:100%;padding:14px 16px;border:2px solid #e2e8f0;border-radius:10px;font-size:15px;font-family:'Inter',sans-serif;transition:all .3s ease;background:#f7fafc}

.form-group input:focus,.form-group select:focus,.form-group textarea:focus{outline:none;border-color:#667eea;background:#fff;box-shadow:0 0 0 3px rgba(102,126,234,.1)}

.nav-buttons{display:flex;justify-content:space-between;margin-top:30px;gap:10px}

.nav-buttons button{width:48%}

.outro-container{display:flex;flex-direction:column;gap:8px;margin-top:15px;width:100%}

.outro-container label{display:flex;align-items:center;gap:8px;color:#2d3748;font-weight:600;font-size:14px}

.outro-container input{width:100%;padding:14px 16px;border:2px solid #e2e8f0;border-radius:10px;font-size:15px;background:#f7fafc;transition:all .3s ease}

.outro-container input:focus{outline:none;border-color:#667eea;background:#fff;box-shadow:0 0 0 3px rgba(102,126,234,.1)}

.validation-message{color:#e53e3e;font-size:14px;margin-top:10px;text-align:center;display:none;animation:shake .5s;padding:10px;background:#fed7d7;border-radius:8px;margin-bottom:15px;border-left:4px solid #e53e3e}

@keyframes shake{0%,100%{transform:translateX(0)}25%{transform:translateX(-5px)}75%{transform:translateX(5px)}}

.outro-required{border-color:#e53e3e!important;background:#fff5f5!important}

.success-message{text-align:center;animation:scaleIn .5s ease}

@keyframes scaleIn{from{opacity:0;transform:scale(.9)}to{opacity:1;transform:scale(1)}}

.success-icon{font-size:80px;margin-bottom:20px;animation:checkmark .8s ease}

@keyframes checkmark{0%{transform:scale(0)}50%{transform:scale(1.2)}100%{transform:scale(1)}}

.success-message h2{color:#38a169;margin-bottom:15px}

.success-message p{color:#4a5568;font-size:16px;line-height:1.6;margin-bottom:15px}

.info-box{background:linear-gradient(135deg,#f0f9ff,#e0e7ff);border-left:4px solid #667eea;border-radius:12px;padding:20px;margin:25px 0;text-align:left}

.info-box p{margin-bottom:12px}

.horario{margin-top:15px;padding-top:15px;border-top:1px solid #cbd5e0}

.horario small{color:#718096;font-size:13px}

.footer{text-align:center;color:#4a5568;font-size:14px;margin-top:20px;opacity:.9}

img,svg{pointer-events:none!important;-webkit-user-drag:none!important}

@media (max-width:768px){body{padding:10px}.container{padding:25px 20px;border-radius:15px}h1{font-size:24px}.subtitle{font-size:14px}.horario-info{font-size:13px}h2{font-size:20px}.btn{padding:15px 20px;font-size:15px}.logo{font-size:50px}.success-icon{font-size:60px}.nav-buttons{flex-direction:column}.nav-buttons button{width:100%}}

@media (max-width:480px){.container{padding:20px 15px}h1{font-size:22px}h2{font-size:18px}.btn{padding:14px 18px;font-size:14px}.btn .emoji{font-size:20px}.form-group input,.form-group select,.form-group textarea,.outro-container input{padding:12px 14px;font-size:14px}}

@media print{body,.container,*{display:none!important}}