:root {
    /* Premium Financial Palette - Light Mode */
    --bg-body: #fdfdfd;
    --bg-card: #ffffff;
    --bg-section: #f4f6f9;
    --text-main: #1a202c;
    --text-muted: #4a5568;
    
    --primary: #0a1f44; /* Deep Navy Blue */
    --primary-hover: #132e5c;
    --accent: #d4af37; /* Metallic Gold */
    --accent-hover: #b5952f;
    --accent-light: rgba(212, 175, 55, 0.15);
    --accent-dark: #b8860b;
    
    --border: #e2e8f0;
    --shadow: 0 10px 25px rgba(10, 31, 68, 0.08);
    --shadow-hover: 0 15px 35px rgba(10, 31, 68, 0.12);
    --radius: 12px;
}

[data-theme="dark"] {
    /* Premium Financial Palette - Dark Mode */
    --bg-body: #050b14;
    --bg-card: #0a1324;
    --bg-section: #080f1c;
    --text-main: #f8fafc;
    --text-muted: #a0aec0;
    
    --primary: #cbd5e1;
    --primary-hover: #f1f5f9;
    --accent: #d4af37;
    --accent-dark: #d4af37;
    --accent-hover: #fcd34d;
    --accent-light: rgba(212, 175, 55, 0.1);
    
    --border: #1e293b;
    --shadow: 0 10px 25px rgba(0, 0, 0, 0.5);
    --shadow-hover: 0 15px 35px rgba(212, 175, 55, 0.15);
}

/* Base Styles */
* { box-sizing: border-box; margin: 0; padding: 0; }
body { 
    font-family: 'Inter', sans-serif; 
    background: var(--bg-body); 
    color: var(--text-main); 
    line-height: 1.6; 
    transition: background 0.4s ease, color 0.4s ease; 
}
a { text-decoration: none; color: inherit; transition: all 0.3s ease; }
ul { list-style: none; }
h1, h2, h3, h4 { color: var(--text-main); font-family: 'Playfair Display', serif; font-weight: 700; }
p { color: var(--text-muted); }
.container { max-width: 1280px; margin: 0 auto; padding: 0 1.5rem; }
.section { padding: 5rem 0; }
.text-center { text-align: center; }
.section-header { text-align: center; margin-bottom: 3.5rem; position: relative; }
.section-header h2 { font-size: 2.5rem; margin-bottom: 0.5rem; }
.section-header .subtitle { color: var(--accent-dark); font-weight: 600; text-transform: uppercase; letter-spacing: 1.5px; font-size: 0.9rem; font-family: 'Inter', sans-serif;}

/* Header & Nav */
.top-bar { background: var(--primary); color: white; padding: 0.5rem 0; font-size: 0.85rem; font-weight: 500;}
[data-theme="dark"] .top-bar { background: #000; color: #a0aec0; }
.top-bar-content { display: flex; justify-content: space-between; align-items: center; }
.contact-info a, .social-links a { margin-right: 1.5rem; color: #fff; transition: color 0.3s; }
[data-theme="dark"] .contact-info a, [data-theme="dark"] .social-links a { color: #a0aec0; }
.contact-info a:hover, .social-links a:hover { color: var(--accent); }

.main-header { background: var(--bg-card); padding: 1rem 0; position: sticky; top: 0; z-index: 1000; box-shadow: var(--shadow); transition: background 0.4s; }
.navbar { display: flex; justify-content: space-between; align-items: center; }
.logo { font-size: 1.8rem; font-weight: 700; color: var(--primary); font-family: 'Playfair Display', serif; display: flex; align-items: center; gap: 0.5rem;}
[data-theme="dark"] .logo { color: #fff; }
.logo-accent { color: var(--accent); }

.nav-menu { display: flex; gap: 2rem; align-items: center; }
.nav-menu a { font-weight: 500; position: relative; }
.nav-menu a::after { content: ''; position: absolute; width: 0; height: 2px; bottom: -4px; left: 0; background-color: var(--accent); transition: width 0.3s; }
.nav-menu a:hover::after { width: 100%; }
.nav-menu a.btn::after { display: none; }
.mobile-toggle { display: none; background: none; border: none; color: var(--text-main); font-size: 1.8rem; cursor: pointer; }

/* Buttons */
.btn { display: inline-block; padding: 0.8rem 1.8rem; border-radius: 50px; font-weight: 600; cursor: pointer; border: 2px solid transparent; text-transform: uppercase; font-size: 0.85rem; letter-spacing: 0.5px; transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1); text-align: center; }
.btn-primary { background: linear-gradient(135deg, var(--accent), var(--accent-hover)); color: #000; box-shadow: 0 4px 15px rgba(212, 175, 55, 0.3); border: none; }
.btn-primary:hover { transform: translateY(-3px); box-shadow: 0 8px 25px rgba(212, 175, 55, 0.4); color: #000; }
.btn-outline { background: transparent; border: 2px solid var(--accent); color: var(--text-main); }
.btn-outline:hover { background: var(--accent); color: #000; box-shadow: 0 4px 15px rgba(212, 175, 55, 0.3); }

/* Hero Slider */
.hero-slider { position: relative; width: 100%; height: 80vh; min-height: 600px; display: flex; align-items: center; justify-content: center; overflow: hidden; }
.slide { position: absolute; inset: 0; background-size: cover; background-position: center; opacity: 0; transition: opacity 1s cubic-bezier(0.4, 0, 0.2, 1); display: flex; align-items: center; z-index: 1;}
.slide.active { opacity: 1; z-index: 2;}
.slide-content { max-width: 800px; color: white; padding-top: 4rem; transform: translateY(30px); transition: transform 1s, opacity 1s; opacity: 0; }
.slide.active .slide-content { transform: translateY(0); opacity: 1; transition-delay: 0.3s; }
.slide-badge { background: var(--accent); color: #000; padding: 0.4rem 1rem; border-radius: 50px; font-weight: 700; font-size: 0.85rem; text-transform: uppercase; letter-spacing: 1px; display: inline-block; margin-bottom: 1.5rem; }
.slide h2 { font-size: 4rem; line-height: 1.1; margin-bottom: 1.5rem; color: #fff;}
.slide p { font-size: 1.25rem; margin-bottom: 2.5rem; max-width: 600px; color: rgba(255,255,255,0.9); }
.hero-cta { display: flex; gap: 1.5rem; }
.slider-btn { position: absolute; top: 50%; transform: translateY(-50%); background: rgba(255,255,255,0.1); border: 1px solid rgba(255,255,255,0.2); color: white; width: 50px; height: 50px; border-radius: 50%; display: flex; align-items: center; justify-content: center; font-size: 1.5rem; cursor: pointer; z-index: 10; transition: all 0.3s; backdrop-filter: blur(5px);}
.slider-btn:hover { background: var(--accent); color: #000; border-color: var(--accent); }
.prev-btn { left: 2%; }
.next-btn { right: 2%; }
.slider-dots { position: absolute; bottom: 2rem; left: 50%; transform: translateX(-50%); display: flex; gap: 0.8rem; z-index: 10; }
.dot { width: 12px; height: 12px; border-radius: 50%; background: rgba(255,255,255,0.3); cursor: pointer; transition: 0.3s; }
.dot.active { background: var(--accent); transform: scale(1.2); }

/* Color Banding Helpers */
.bg-primary { background: var(--primary); }
.bg-primary .testimonial-card { background: #132e5c; border-color: #1e3a8a; }
.bg-primary .testimonial-card p { color: #f8fafc; }
.bg-primary .testimonial-card .author { color: var(--accent); }

/* Services Page & Core Pillars */
.service-category { margin-bottom: 2rem; border-radius: var(--radius); }
.bg-light { background: var(--bg-section); }
.category-header { display: flex; align-items: center; gap: 1.5rem; margin-bottom: 2.5rem; }
.category-icon { width: 60px; height: 60px; background: linear-gradient(135deg, var(--primary), #1a365d); display: flex; align-items: center; justify-content: center; font-size: 1.8rem; color: var(--accent); border-radius: 15px; box-shadow: var(--shadow); }
[data-theme="dark"] .category-icon { background: #1e293b; color: var(--accent); }
.category-header h2 { margin: 0; font-size: 2rem; }

.services-list { display: grid; grid-template-columns: repeat(auto-fit, minmax(300px, 1fr)); gap: 1.5rem; }
.service-item { background: var(--bg-card); padding: 2rem; border-radius: var(--radius); border: 1px solid var(--border); box-shadow: var(--shadow); transition: all 0.3s; }
.service-item:hover { transform: translateY(-5px); border-color: var(--accent); box-shadow: var(--shadow-hover); }
.service-item h4 { display: flex; align-items: center; gap: 0.8rem; margin-bottom: 1rem; font-size: 1.2rem; }
.service-item h4 i { color: var(--accent); }

/* Common Grid Systems */
.services-grid, .loans-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)); gap: 2rem; }
.service-card, .loan-card { background: var(--bg-card); padding: 2.5rem; border-radius: var(--radius); text-align: center; box-shadow: var(--shadow); transition: all 0.3s; position: relative; overflow: hidden; border: 1px solid var(--border); }
.service-card::after, .loan-card::after { content:''; position: absolute; top:0; left:0; width:100%; height:4px; background: var(--accent); transform: scaleX(0); transition: transform 0.3s; transform-origin: left; }
.service-card:hover::after, .loan-card:hover::after { transform: scaleX(1); }
.service-card:hover, .loan-card:hover { transform: translateY(-8px); box-shadow: var(--shadow-hover); }
.service-card i, .loan-card i { font-size: 2.5rem; color: var(--accent); margin-bottom: 1.5rem; display: inline-block; background: var(--accent-light); width: 80px; height: 80px; line-height: 80px; border-radius: 50%; transition: all 0.3s;}
.service-card:hover i, .loan-card:hover i { background: var(--accent); color: #fff; }

.insurance-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(300px, 1fr)); gap: 2rem; }
.insurance-column { background: var(--bg-card); padding: 2.5rem; border-radius: var(--radius); box-shadow: var(--shadow); border: 1px solid var(--border); }
.insurance-column h4 { font-size: 1.4rem; margin-bottom: 1.5rem; padding-bottom: 1rem; border-bottom: 1px solid var(--border); display: flex; align-items: center; gap: 0.75rem; color: var(--primary); }
[data-theme="dark"] .insurance-column h4 { color: #fff; }
.insurance-column h4 i { color: var(--accent); }
.insurance-column ul { display: flex; flex-direction: column; gap: 0.8rem; }
.insurance-column ul li { list-style: none; display: flex; align-items: center; gap: 0.75rem; font-size: 1.05rem; }
.insurance-column ul li::before { content: '\f00c'; font-family: 'Font Awesome 6 Free'; font-weight: 900; color: var(--accent); font-size: 0.9rem; }

/* Marquee / Testimonials */
.testimonials-section { overflow: hidden; padding-bottom: 6rem; }
.marquee-container { width: 100%; overflow: hidden; padding: 1rem 0 3rem; margin-top: 1rem;}
.marquee-content { display: flex; gap: 2rem; width: max-content; animation: scroll 60s linear infinite; }
.marquee-content:hover { animation-play-state: paused; }
.testimonial-card { background: var(--bg-card); padding: 2rem; border-radius: var(--radius); min-width: 380px; width: 380px; box-shadow: var(--shadow); border-top: 4px solid var(--accent); border-left: 1px solid var(--border); border-right: 1px solid var(--border); border-bottom: 1px solid var(--border); }
.stars { color: #fbbf24; margin-bottom: 1rem; font-size: 1.2rem; }
.testimonial-card p { font-size: 1.1rem; font-style: italic; margin-bottom: 1.5rem; line-height: 1.7; }
.author { font-weight: 700; color: var(--primary); font-size: 1rem; display: flex; align-items: center; gap: 0.5rem; }
[data-theme="dark"] .author { color: var(--accent); }
.author::before { content: ''; width: 20px; height: 2px; background: var(--accent); }
@keyframes scroll { 0% { transform: translateX(0); } 100% { transform: translateX(-50%); } }

/* FAQ */
.faq-section { background: var(--bg-section); }
.faq-grid { max-width: 800px; margin: 0 auto; display: flex; flex-direction: column; gap: 1rem; }
.faq-item { background: var(--bg-card); border-radius: 10px; box-shadow: 0 4px 6px rgba(0,0,0,0.02); overflow: hidden; border: 1px solid var(--border); }
.faq-question { width: 100%; padding: 1.5rem 2rem; text-align: left; background: none; border: none; cursor: pointer; font-size: 1.1rem; font-weight: 600; color: var(--text-main); display: flex; justify-content: space-between; align-items: center; transition: all 0.3s; }
.faq-question:hover { color: var(--accent); }
.faq-question i { color: var(--accent); transition: transform 0.3s cubic-bezier(0.4, 0, 0.2, 1); }
.faq-item.active .faq-question { border-bottom: 1px solid var(--border); color: var(--accent); }
.faq-item.active .faq-question i { transform: rotate(135deg); }
.faq-answer { max-height: 0; overflow: hidden; transition: max-height 0.4s ease; padding: 0 2rem; background: var(--bg-card); }
.faq-item.active .faq-answer { max-height: 400px; padding: 1.5rem 2rem; }

/* Contact Section & Form Elements */
.contact-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 4rem; }
.contact-info-list { display: flex; flex-direction: column; gap: 2rem; }
.contact-method { display: flex; align-items: flex-start; gap: 1.5rem; }
.contact-icon { width: 50px; height: 50px; background: var(--accent-light); color: var(--accent); border-radius: 50%; display: flex; align-items: center; justify-content: center; font-size: 1.5rem; flex-shrink: 0; }
.contact-form { background: var(--bg-card); padding: 3rem; border-radius: var(--radius); box-shadow: var(--shadow); border: 1px solid var(--border); }
.form-group { margin-bottom: 1.5rem; }
.form-group label { display: block; margin-bottom: 0.5rem; font-weight: 600; font-size: 0.95rem; }
.form-group input, .form-group select, .form-group textarea { width: 100%; padding: 1rem 1.2rem; border: 1px solid var(--border); border-radius: 8px; background: var(--bg-body); color: var(--text-main); font-family: 'Inter', sans-serif; font-size: 1rem; transition: border-color 0.3s; }
.form-group input:focus, .form-group select:focus, .form-group textarea:focus { outline: none; border-color: var(--accent); }
[data-theme="dark"] .form-group input, [data-theme="dark"] .form-group select, [data-theme="dark"] .form-group textarea { background: #0f172a; border-color: #1e293b; }

/* CTA */
.cta-section { background: var(--primary); color: white; padding: 6rem 0; position: relative; overflow: hidden; }
[data-theme="dark"] .cta-section { background: #07101f; }
.cta-section::after { content: '\f51e'; font-family: 'Font Awesome 6 Free'; font-weight: 900; position: absolute; right: 5%; top: 50%; transform: translateY(-50%) rotate(-15deg); font-size: 15rem; color: rgba(255,255,255,0.03); z-index: 0; pointer-events: none; }
.cta-content { position: relative; z-index: 1; }
.cta-section h2 { color: white; margin-bottom: 1rem; font-size: 2.8rem; }
.cta-section p { color: rgba(255,255,255,0.8); font-size: 1.2rem; margin-bottom: 2rem; }

/* Footer */
.main-footer { background: #030811; color: #cbd5e1; padding: 5rem 0 1rem; }
.main-footer h3, .main-footer h4 { color: #fff; margin-bottom: 1.5rem; }
.footer-grid { display: grid; grid-template-columns: 2fr 1fr 1fr; gap: 4rem; margin-bottom: 4rem; }
.footer-contact p { display: flex; align-items: center; gap: 1rem; margin-bottom: 1rem; }
.footer-contact i { color: var(--accent); }
.footer-links ul { display: flex; flex-direction: column; gap: 0.8rem; }
.footer-links a { color: #cbd5e1; transition: 0.3s; }
.footer-links a:hover { color: var(--accent); padding-left: 5px; }
.footer-bottom { border-top: 1px solid rgba(255,255,255,0.1); padding-top: 2rem; display: flex; justify-content: space-between; align-items: center; font-size: 0.9rem; }
.disclaimer { font-size: 0.85rem; opacity: 0.6; line-height: 1.5; margin-top: 1.5rem; }

/* Popup Overlay & Forms */
.popup-overlay { position: fixed; inset: 0; background: rgba(0,0,0,0.7); backdrop-filter: blur(5px); display: flex; align-items: center; justify-content: center; z-index: 2000; opacity: 0; visibility: hidden; transition: all 0.4s ease; }
.popup-overlay.show { opacity: 1; visibility: visible; }
.popup-content { background: var(--bg-card); padding: 3rem; border-radius: var(--radius); max-width: 450px; width: 90%; position: relative; box-shadow: 0 25px 50px -12px rgba(0, 0, 0, 0.25); border-top: 5px solid var(--accent); transform: scale(0.95) translateY(20px); transition: all 0.4s ease; opacity: 0;}
.popup-overlay.show .popup-content { transform: scale(1) translateY(0); opacity: 1;}
.popup-close { position: absolute; top: 1.5rem; right: 1.5rem; background: none; border: none; font-size: 1.8rem; cursor: pointer; color: var(--text-muted); transition: 0.3s; line-height: 1;}
.popup-close:hover { color: var(--accent); transform: rotate(90deg); }
.popup-content h3 { margin-bottom: 1.5rem; font-size: 1.5rem; text-align: center; }
.popup-content input { width: 100%; padding: 1rem; margin-bottom: 1rem; border: 1px solid var(--border); border-radius: 8px; background: var(--bg-body); color: var(--text-main); font-size: 1rem; }
.popup-content input:focus { outline: none; border-color: var(--accent); }
.popup-content .btn { width: 100%; margin-top: 0.5rem; padding: 1rem; font-size: 1rem; }

/* Flash & Admin Messages */
.flash { padding: 1rem 1.5rem; border-radius: 8px; margin-bottom: 1.5rem; display: flex; align-items: center; gap: 1rem; font-weight: 500;}
.flash.success { background: rgba(22, 101, 52, 0.1); border-left: 4px solid #166534; color: #166534; }
[data-theme="dark"] .flash.success { color: #4ade80; background: rgba(74, 222, 128, 0.1); border-color: #4ade80;}
.flash.error { background: rgba(153, 27, 27, 0.1); border-left: 4px solid #991b1b; color: #991b1b; }
[data-theme="dark"] .flash.error { color: #f87171; background: rgba(248, 113, 113, 0.1); border-color: #f87171;}

/* Admin Tables */
.leads-table { width: 100%; border-collapse: collapse; background: var(--bg-card); border-radius: 12px; overflow: hidden; box-shadow: var(--shadow); border: 1px solid var(--border); }
.leads-table th { background: var(--primary); color: white; padding: 1.2rem 1rem; text-align: left; font-weight: 600; letter-spacing: 0.5px; text-transform: uppercase; font-size: 0.85rem;}
[data-theme="dark"] .leads-table th { background: #000; }
.leads-table td { padding: 1rem; border-bottom: 1px solid var(--border); color: var(--text-main); vertical-align: middle; }
.leads-table tr:hover { background: var(--bg-section); }

/* Theme Toggle */
.theme-toggle { background: var(--bg-section); border: 1px solid var(--border); color: var(--accent); width: 40px; height: 40px; border-radius: 50%; display: flex; align-items: center; justify-content: center; font-size: 1.1rem; cursor: pointer; transition: all 0.3s; }
.theme-toggle:hover { background: var(--primary); color: white; border-color: var(--primary); }

/* PolicyBazaar Style Corporate Insurance Grid */
.pb-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(180px, 1fr)); gap: 1.5rem; margin-top: 2rem; }
.pb-card { background: var(--bg-card); border-radius: 12px; padding: 2.5rem 1rem 1.5rem; text-align: center; box-shadow: 0 4px 15px rgba(0,0,0,0.05); position: relative; cursor: pointer; transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1); border: 1px solid var(--border); display: flex; flex-direction: column; align-items: center; justify-content: center; min-height: 170px;}
.pb-card:hover { transform: translateY(-8px); box-shadow: 0 12px 25px rgba(0,0,0,0.1); border-color: var(--accent); }
[data-theme="dark"] .pb-card { box-shadow: 0 4px 15px rgba(0,0,0,0.3); }
[data-theme="dark"] .pb-card:hover { box-shadow: 0 12px 25px rgba(0,0,0,0.5); border-color: var(--accent); }
.pb-card i { font-size: 3rem; color: var(--primary); margin-bottom: 1rem; transition: transform 0.3s; }
.pb-card:hover i { transform: scale(1.1); color: var(--accent); }
.pb-card h4 { font-size: 0.95rem; line-height: 1.4; color: var(--text-main); font-weight: 600; margin: 0; font-family: 'Inter', sans-serif;}
.pb-banner { position: absolute; top: -1px; left: -1px; right: -1px; background: #10b981; color: white; font-size: 0.8rem; font-weight: 600; padding: 0.35rem 0; border-top-left-radius: 12px; border-top-right-radius: 12px; letter-spacing: 0.5px;}
.pb-banner.purple { background: #6366f1; }

/* Utility */
.mb-1 { margin-bottom: 0.5rem; }
.mb-2 { margin-bottom: 1rem; }
.mb-3 { margin-bottom: 1.5rem; }
.mb-4 { margin-bottom: 2rem; }

/* Responsive */
@media (max-width: 900px) {
    .contact-grid, .footer-grid { grid-template-columns: 1fr; gap: 3rem; }
    .hero h1 { font-size: 3rem; }
    .footer-bottom { flex-direction: column; gap: 1rem; text-align: center; }
}

@media (max-width: 768px) {
    .nav-menu { position: fixed; top: 0; right: -100%; width: 80%; height: 100vh; background: var(--bg-card); flex-direction: column; padding: 6rem 2rem; transition: 0.4s cubic-bezier(0.4, 0, 0.2, 1); box-shadow: -10px 0 30px rgba(0,0,0,0.1); justify-content: flex-start; z-index: 999; }
    .nav-menu.active { right: 0; }
    .mobile-toggle { display: block; z-index: 1001; position: relative; }
    .hero h1 { font-size: 2.2rem; }
    .hero-subtitle { font-size: 1.1rem; }
    .hero-cta { flex-direction: column; }
    .section { padding: 3.5rem 0; }
    .section-header h2 { font-size: 2rem; }
    .category-header { flex-direction: column; text-align: center; }
}
