| /* Custom styles that extend Tailwind */ | |
| body { | |
| font-family: 'Inter', -apple-system, BlinkMacSystemFont, sans-serif; | |
| line-height: 1.6; | |
| } | |
| .container { | |
| max-width: 1200px; | |
| } | |
| @keyframes fadeIn { | |
| from { opacity: 0; transform: translateY(20px); } | |
| to { opacity: 1; transform: translateY(0); } | |
| } | |
| .animate-fade-in { | |
| animation: fadeIn 0.6s ease-out forwards; | |
| } | |
| /* Custom button styles */ | |
| .btn-primary { | |
| transition: all 0.3s ease; | |
| } | |
| .btn-primary:hover { | |
| transform: translateY(-2px); | |
| box-shadow: 0 10px 20px -10px rgba(79, 70, 229, 0.5); | |
| } | |
| /* Custom shadow for cards */ | |
| .custom-shadow { | |
| box-shadow: 0 10px 25px -5px rgba(0, 0, 0, 0.1), | |
| 0 10px 10px -5px rgba(0, 0, 0, 0.04); | |
| } | |
| /* Form radio button selection */ | |
| input[type="radio"]:checked + label { | |
| color: #4f46e5; | |
| font-weight: 600; | |
| } | |
| /* Responsive typography */ | |
| @media (min-width: 768px) { | |
| .text-responsive { | |
| font-size: calc(1rem + 0.5vw); | |
| } | |
| } |