* { scroll-behavior: smooth; }
body { font-family: 'Nunito', sans-serif; background: #ffffff; color: #525252; }
.top-bar { background: #2e1065; color: rgba(255,255,255,0.85); padding: 10px 0; font-size: 0.85rem; }
.top-bar a { color: rgba(255,255,255,0.75); text-decoration: none; margin-right: 24px; transition: color 0.3s; font-size: 0.82rem; }
.top-bar a:hover { color: #6d28d9; }
.top-bar .social-links a { margin-right: 6px; font-size: 1rem; }
.navbar { background: #ffffff !important; box-shadow: 0 1px 0 rgba(0,0,0,0.06); padding: 0; }
.navbar .container { display: flex; align-items: center; }
.navbar-brand { font-weight: 800; font-size: 1.4rem; color: #2e1065 !important; padding: 16px 0; }
.navbar-brand i { color: #6d28d9; }
.nav-link { font-weight: 700; color: #525252 !important; padding: 20px 18px !important; font-size: 0.88rem; text-transform: uppercase; letter-spacing: 0.5px; }
.nav-link:hover, .nav-link.active { color: #6d28d9 !important; }
.navbar .btn-appointment { background: #6d28d9; color: #ffffff; font-weight: 700; padding: 10px 24px; border: none; font-size: 0.85rem; text-transform: uppercase; letter-spacing: 0.5px; }
.navbar .btn-appointment:hover { background: #8b5cf6; color: #ffffff; }
.hero { background: linear-gradient(135deg, #2e1065 0%, #4c1d95 100%); color: #ffffff; padding: 120px 0; position: relative; overflow: hidden; }
.hero h1 { font-weight: 800; font-size: 2.8rem; line-height: 1.15; margin-bottom: 1.2rem; }
.hero h2 { font-weight: 400; font-size: 1.1rem; opacity: 0.85; line-height: 1.7; max-width: 560px; margin-bottom: 2rem; }
.btn-hero { background: #6d28d9; color: #ffffff; font-weight: 700; padding: 14px 36px; border: none; text-transform: uppercase; letter-spacing: 0.5px; }
.btn-hero:hover { background: #8b5cf6; color: #ffffff; }
.btn-outline-hero { background: rgba(255,255,255,0.1); color: #ffffff; font-weight: 700; padding: 14px 36px; border: 2px solid rgba(255,255,255,0.4); text-transform: uppercase; letter-spacing: 0.5px; }
.btn-outline-hero:hover { background: #ffffff; color: #2e1065; }
.section-title { font-weight: 800; color: #2e1065; margin-bottom: 8px; font-size: 1.8rem; }
.section-subtitle { color: #a3a3a3; margin-bottom: 50px; font-size: 1rem; }
.service-item { text-align: center; padding: 48px 24px; background: #ffffff; border: 1px solid #f5f5f5; height: 100%; }
.service-item:hover { border-color: #6d28d9; }
.service-icon { width: 72px; height: 72px; background: #f5f3ff; display: flex; align-items: center; justify-content: center; margin: 0 auto 24px; }
.service-item:hover .service-icon { background: #6d28d9; }
.service-icon i { font-size: 28px; color: #6d28d9; }
.service-item:hover .service-icon i { color: #ffffff; }
.service-item h4 { font-weight: 700; color: #2e1065; margin-bottom: 12px; font-size: 1.1rem; }
.service-item p { color: #a3a3a3; font-size: 0.9rem; }
.about-section { background: #fafafa; padding: 80px 0; }
.about-content h2 { font-weight: 800; color: #2e1065; margin-bottom: 20px; font-size: 1.8rem; }
.about-content p { color: #737373; line-height: 1.9; font-size: 0.95rem; }
.about-image { overflow: hidden; }
.about-image img { width: 100%; height: 100%; object-fit: cover; }
.why-item { text-align: center; padding: 40px 20px; border: 1px solid #f5f5f5; background: #ffffff; }
.why-item:hover { border-color: #6d28d9; }
.why-icon { width: 72px; height: 72px; background: #f5f3ff; display: flex; align-items: center; justify-content: center; margin: 0 auto 20px; }
.why-item:hover .why-icon { background: #6d28d9; }
.why-icon i { font-size: 28px; color: #6d28d9; }
.why-item:hover .why-icon i { color: #ffffff; }
.why-item h4 { font-weight: 700; color: #2e1065; margin-bottom: 8px; font-size: 1rem; }
.why-item p { color: #a3a3a3; font-size: 0.88rem; line-height: 1.6; margin: 0; }
.vet-card { text-align: center; padding: 36px 20px; background: #ffffff; border: 1px solid #f5f5f5; }
.vet-card:hover { border-color: #6d28d9; }
.vet-avatar { width: 80px; height: 80px; background: #f5f5f5; display: flex; align-items: center; justify-content: center; margin: 0 auto 20px; }
.vet-card:hover .vet-avatar { background: #f5f3ff; }
.vet-avatar i { font-size: 32px; color: #a3a3a3; }
.vet-card:hover .vet-avatar i { color: #6d28d9; }
.vet-card h5 { font-weight: 700; color: #2e1065; font-size: 1rem; }
.vet-card p { color: #a3a3a3; font-size: 0.85rem; margin: 0; }
.hours-section { background: #2e1065; color: #ffffff; padding: 60px 0; }
.hours-section h2 { font-weight: 800; margin-bottom: 30px; }
.hours-item { display: flex; justify-content: space-between; padding: 14px 0; border-bottom: 1px solid rgba(255,255,255,0.08); font-size: 0.95rem; }
.hours-item:last-child { border-bottom: none; }
.hours-item span:first-child { font-weight: 600; }
.hours-item span:last-child { font-weight: 300; }
.location-section { padding: 80px 0; background: #ffffff; }
.location-card { padding: 0; height: 100%; }
.contact-item { display: flex; align-items: flex-start; margin-bottom: 24px; }
.contact-item i { width: 40px; height: 40px; background: #f5f3ff; display: flex; align-items: center; justify-content: center; color: #6d28d9; font-size: 16px; margin-right: 16px; }
.contact-item div strong { display: block; font-size: 0.82rem; color: #a3a3a3; font-weight: 700; text-transform: uppercase; letter-spacing: 0.5px; margin-bottom: 2px; }
.contact-item div p { margin: 0; color: #525252; font-weight: 600; font-size: 0.95rem; }
.map-container { min-height: 400px; height: 100%; }
.map-container iframe { width: 100%; height: 100%; min-height: 400px; }
.testimonial-section { background: #fafafa; padding: 80px 0; }
.testimonial-card { background: #ffffff; border: 1px solid #f5f5f5; padding: 32px; margin-bottom: 20px; }
.testimonial-card:hover { border-color: #6d28d9; }
.testimonial-card p { font-style: italic; color: #737373; line-height: 1.7; font-size: 0.95rem; }
.stars { color: #6d28d9; margin-bottom: 12px; font-size: 1rem; }
.cta-section { background: #2e1065; padding: 80px 0; color: #ffffff; }
.cta-section h2 { font-weight: 800; font-size: 1.8rem; }
.cta-section p { font-size: 1.05rem; opacity: 0.85; }
.cta-section .btn-hero { background: #6d28d9; }
.cta-section .btn-hero:hover { background: #8b5cf6; }
.footer { background: #1e1035; color: rgba(255,255,255,0.7); padding: 60px 0 30px; }
.footer h5 { color: #ffffff; font-weight: 700; margin-bottom: 20px; font-size: 1rem; text-transform: uppercase; letter-spacing: 0.5px; }
.footer a { color: rgba(255,255,255,0.5); text-decoration: none; display: block; margin-bottom: 8px; font-size: 0.88rem; }
.footer a:hover { color: #6d28d9; }
.footer hr { border-color: rgba(255,255,255,0.08); }
.footer p { font-size: 0.85rem; }
.social-links a { display: inline-flex; width: 40px; height: 40px; background: rgba(255,255,255,0.06); align-items: center; justify-content: center; margin-right: 6px; color: rgba(255,255,255,0.5); text-decoration: none; }
.social-links a:hover { background: #6d28d9; color: #ffffff; }
.whatsapp-float { position: fixed; bottom: 24px; right: 24px; background: #25D366; color: #ffffff; width: 56px; height: 56px; display: flex; align-items: center; justify-content: center; font-size: 28px; z-index: 1000; text-decoration: none; box-shadow: 0 4px 16px rgba(37,211,102,0.4); }
.whatsapp-float:hover { color: #ffffff; box-shadow: 0 8px 30px rgba(37,211,102,0.5); }
.blog-card { background: #ffffff; border: 1px solid #f5f5f5; height: 100%; }
.blog-card:hover { border-color: #6d28d9; }
.blog-card-img { width: 100%; height: 200px; object-fit: cover; }
.blog-card-body { padding: 24px; }
.blog-date { font-size: 0.8rem; color: #a3a3a3; margin-bottom: 8px; text-transform: uppercase; letter-spacing: 0.5px; }
.blog-card-body h4 { font-weight: 700; margin-bottom: 10px; color: #2e1065; font-size: 1.1rem; line-height: 1.4; }
.blog-card-body p { color: #a3a3a3; font-size: 0.88rem; }
.blog-tag { display: inline-block; background: #f5f3ff; color: #6d28d9; padding: 3px 12px; font-size: 0.75rem; font-weight: 700; margin-right: 4px; text-transform: uppercase; letter-spacing: 0.5px; }
.page-header { background: #2e1065; color: #ffffff; padding: 80px 0 60px; text-align: center; }
.page-header h1 { font-weight: 800; font-size: 2rem; }
.page-header p { opacity: 0.8; font-size: 1rem; }
.article-header { color: #ffffff; padding: 80px 0; }
.article-header h1 { font-weight: 800; font-size: 2rem; line-height: 1.3; }
.article-content { background: #ffffff; padding: 44px; border: 1px solid #f5f5f5; margin-top: -60px; position: relative; z-index: 2; }
.article-content h2, .article-content h3, .article-content h5 { color: #2e1065; font-weight: 700; margin-top: 24px; }
.article-content p { line-height: 1.9; color: #737373; font-size: 0.95rem; }
.article-content ul, .article-content ol { color: #737373; line-height: 1.9; }
.recent-card { background: #ffffff; border: 1px solid #f5f5f5; height: 100%; }
.recent-card:hover { border-color: #6d28d9; }
.recent-card img { width: 100%; height: 150px; object-fit: cover; }
.recent-card-body { padding: 18px; }
.recent-card-body h6 { font-weight: 700; color: #2e1065; }
.recent-card-body p { color: #a3a3a3; font-size: 0.82rem; }
a { transition: all 0.3s; }
.blog-btn { border-color: #6d28d9 !important; color: #6d28d9 !important; font-weight: 700 !important; }
.blog-btn:hover { background: #6d28d9 !important; color: white !important; }