/* Font faces */ @import url('https://fonts.googleapis.com/css2?family=Playfair+Display:wght@400;500;600;700;800&family=Poppins:wght@300;400;500;600;700&display=swap'); /* Base styles */ :root { --primary-color: #8B0000; --secondary-color: #D4AF37; --accent-color: #2C3E50; --light-color: #F8F8F8; --dark-color: #1A1A1A; --transition: all 0.3s ease; } body { font-family: 'Poppins', sans-serif; line-height: 1.7; color: #333; background-color: #FAFAFA; } .font-serif { font-family: 'Playfair Display', serif; } h1, h2, h3, h4, h5, h6 { font-family: 'Playfair Display', serif; font-weight: 700; color: var(--accent-color); } /* Custom animations */ @keyframes fadeIn { from { opacity: 0; transform: translateY(20px); } to { opacity: 1; transform: translateY(0); } } @keyframes fadeInUp { from { opacity: 0; transform: translateY(30px); } to { opacity: 1; transform: translateY(0); } } .fade-in { animation: fadeIn 1s ease-out; } .fade-in-up { animation: fadeInUp 1s ease-out; } /* Custom components */ .hero-overlay { background: linear-gradient(135deg, rgba(139, 0, 0, 0.85) 0%, rgba(44, 62, 80, 0.7) 100%); } .section-title { position: relative; padding-bottom: 15px; margin-bottom: 30px; } .section-title:after { content: ''; position: absolute; bottom: 0; left: 50%; transform: translateX(-50%); width: 80px; height: 3px; background: linear-gradient(to right, var(--primary-color), var(--secondary-color)); border-radius: 3px; } .card { background: #FFFFFF; border-radius: 15px; box-shadow: 0 10px 30px rgba(0, 0, 0, 0.08); transition: var(--transition); border: 1px solid rgba(0, 0, 0, 0.05); } .card:hover { transform: translateY(-10px); box-shadow: 0 15px 40px rgba(0, 0, 0, 0.15); } .btn-primary { background: linear-gradient(135deg, var(--primary-color) 0%, #A52A2A 100%); color: white; padding: 12px 30px; border-radius: 30px; font-weight: 600; text-decoration: none; display: inline-block; transition: var(--transition); border: none; cursor: pointer; box-shadow: 0 4px 15px rgba(139, 0, 0, 0.2); } .btn-primary:hover { transform: translateY(-3px); box-shadow: 0 7px 20px rgba(139, 0, 0, 0.3); color: white; } /* Responsive tweaks */ @media (min-width: 1024px) { .hero-content { max-width: 60%; } } /* Premium section styling */ .premium-section { background: linear-gradient(135deg, #f9f9f9 0%, #ffffff 100%); padding: 100px 0; position: relative; overflow: hidden; } .premium-section:before { content: ''; position: absolute; top: 0; left: 0; width: 100%; height: 100%; background: url('data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTAwJSIgaGVpZ2h0PSIxMDAlIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciPjxkZWZzPjxwYXR0ZXJuIGlkPSJwYXR0ZXJuIiB3aWR0aD0iNDAiIGhlaWdodD0iNDAiIHBhdHRlcm5Vbml0cz0idXNlclNwYWNlT25Vc2UiIHBhdHRlcm5UcmFuc2Zvcm09InJvdGF0ZSg0NSkiPjxjaXJjbGUgY3g9IjIwIiBjeT0iMjAiIHI9IjAuNSIgZmlsbD0iI0Q0QUYzNyIgZmlsbC1vcGFjaXR5PSIwLjEiLz48L3BhdHRlcm4+PC9kZWZzPjxyZWN0IHdpZHRoPSIxMDAlIiBoZWlnaHQ9IjEwMCUiIGZpbGw9InVybCgjcGF0dGVybikiLz48L3N2Zz4='); }