Spaces:
Running
Running
| /* 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='); | |
| } | |