/* Base typography and container */ body { font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif; } /* Container max width override */ .container { max-width: 1200px; } /* Custom keyframes for fade in */ @keyframes fadeIn { from { opacity: 0; transform: translateY(20px); } to { opacity: 1; transform: translateY(0); } } /* Animation helper */ .animate-fadeIn { animation: fadeIn 1s ease-out forwards; } /* Hero section background and overlay */ .hero-bg { background-image: url('https://source.unsplash.com/1600x900/?business,analytics'); background-size: cover; background-position: center; position: relative; height: 80vh; } .hero-overlay { position: absolute; top: 0; left: 0; right: 0; bottom: 0; background: rgba(0, 0, 0, 0.5); } /* Button styles */ .btn-learn-more { display: inline-block; padding: 0.75rem 1.5rem; font-size: 0.875rem; font-weight: 600; border-radius: 0.5rem; transition: background-color 0.3s ease; background-color: #3b82f6; /* Tailwind blue-500 */ color: #ffffff; box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1); } .btn-learn-more:hover { background-color: #2563eb; /* Tailwind blue-600 */ } .btn-custom { transition: transform 0.3s ease; } .btn-custom:hover { transform: scale(1.05); } /* ----- Module Base Styles (Reusable for all modules) ----- */ .module { padding: 1rem; } .module-title { font-size: 1.875rem; /* 30px equivalent */ font-weight: 700; color: #1f2937; /* Tailwind gray-800 */ } .module-intro { font-size: 1.125rem; color: #4b5563; /* Tailwind gray-600 */ } .module-section { background-color: #ffffff; padding: 1.5rem; border-radius: 0.5rem; box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1); margin-bottom: 1.5rem; } .module-section-header { font-size: 1.5rem; /* 24px equivalent */ font-weight: 700; color: #374151; /* Tailwind gray-700 */ margin-bottom: 0.5rem; } .module-section-content { font-size: 1rem; color: #4b5563; } .module-list li { margin-bottom: 0.5rem; }