* { font-family: 'Montserrat', sans-serif; }
html { scroll-behavior: smooth; }

.bg-grid {
  background-color: #09090b;
  background-image:
    linear-gradient(rgba(139,92,246,0.08) 1px, transparent 1px),
    linear-gradient(90deg, rgba(139,92,246,0.08) 1px, transparent 1px);
  background-size: 60px 60px;
}
.gradient-purple { background: linear-gradient(135deg, #6d28d9, #8b5cf6); }
.btn-glow:hover  { box-shadow: 0 0 28px rgba(139,92,246,0.65); }
.progress-bar    { transition: width 0.4s ease; }
.card-purple     { border: 1px solid rgba(139,92,246,0.2); box-shadow: 0 4px 24px rgba(139,92,246,0.08); }
.field-input:focus { border-color: #8b5cf6; box-shadow: 0 0 0 3px rgba(139,92,246,0.1); }
.field-error     { border-color: #ef4444 !important; box-shadow: 0 0 0 3px rgba(239,68,68,0.1) !important; }
::-webkit-scrollbar { width: 6px; }
::-webkit-scrollbar-track { background: #09090b; }
::-webkit-scrollbar-thumb { background: #6d28d9; border-radius: 3px; }
.section-fade { animation: fadeIn 0.4s ease; }
@keyframes fadeIn { from { opacity:0; transform:translateY(12px); } to { opacity:1; transform:translateY(0); } }
.video-wrapper { position:relative; padding-bottom:56.25%; height:0; overflow:hidden; }
.video-wrapper iframe { position:absolute; top:0; left:0; width:100%; height:100%; border-radius:12px; }
.text-gradient { background: linear-gradient(135deg, #c4b5fd, #8b5cf6); -webkit-background-clip:text; -webkit-text-fill-color:transparent; background-clip:text; }
.hero-glow { position:absolute; width:600px; height:600px; background:radial-gradient(circle, rgba(139,92,246,0.18) 0%, transparent 70%); top:50%; left:50%; transform:translate(-50%,-50%); pointer-events:none; }
@keyframes pulse-green { 0%,100%{box-shadow:0 0 0 0 rgba(34,197,94,0.4);} 50%{box-shadow:0 0 0 6px rgba(34,197,94,0);} }
.badge-pulse { animation: pulse-green 2.5s ease infinite; }
.benefit-card { transition: transform 0.3s ease, box-shadow 0.3s ease; }
.benefit-card:hover { transform: translateY(-4px); box-shadow: 0 12px 32px rgba(139,92,246,0.15); }

/* Radio button customizado */
.radio-option { display:flex; align-items:flex-start; gap:12px; padding:12px 16px; border:1.5px solid #e5e7eb; border-radius:12px; cursor:pointer; transition:all 0.2s; }
.radio-option:hover { border-color: rgba(139,92,246,0.4); background: rgba(139,92,246,0.03); }
.radio-option.selected { border-color: #8b5cf6; background: rgba(139,92,246,0.06); }
.radio-option input[type="radio"], .radio-option input[type="checkbox"] { margin-top:2px; accent-color: #8b5cf6; flex-shrink:0; width:18px; height:18px; }
.radio-option label { cursor:pointer; font-size:0.875rem; line-height:1.5; color:#374151; }

.blur-sm { filter: blur(6px); user-select: none; pointer-events: none; }

#print-area { display: none; }