/* === Taxi ECO MT - Common Styles === */
* { font-family: 'Be Vietnam Pro', sans-serif; }
html { scroll-behavior: smooth; }

/* Navbar */
.navbar { transition: all 0.3s ease; }
.navbar.scrolled { background: rgba(15,15,15,0.97) !important; box-shadow: 0 2px 20px rgba(0,0,0,0.3); }

/* Fade-in animation */
.fade-in { opacity: 0; transform: translateY(30px); transition: all 0.6s ease; }
.fade-in.visible { opacity: 1; transform: translateY(0); }

/* Mobile menu */
#mobile-menu { transition: all 0.3s ease; max-height: 0; overflow: hidden; }
#mobile-menu.open { max-height: 500px; }

/* Pulse animation */
@keyframes pulse-ring { 0% { transform: scale(0.95); box-shadow: 0 0 0 0 rgba(34,197,94,0.7); } 70% { transform: scale(1); box-shadow: 0 0 0 12px rgba(34,197,94,0); } 100% { transform: scale(0.95); } }
.pulse { animation: pulse-ring 2s infinite; }

/* Custom scrollbar */
::-webkit-scrollbar { width: 6px; }
::-webkit-scrollbar-thumb { background: #22c55e; border-radius: 3px; }

/* Skip to content */
.skip-link { position: absolute; top: -100%; left: 16px; z-index: 9999; background: #16a34a; color: #fff; padding: 12px 24px; border-radius: 0 0 8px 8px; font-weight: 600; font-size: 14px; text-decoration: none; transition: top 0.2s; }
.skip-link:focus { top: 0; }

/* Page header (shared by inner pages) */
.page-header { background: linear-gradient(135deg, #022c22 0%, #14532d 50%, #166534 100%); }

/* Hero slider (homepage) */
.hero-slider { position: relative; overflow: hidden; height: 100vh; min-height: 600px; }
.slide { position: absolute; inset: 0; opacity: 0; transition: opacity 1s ease; }
.slide.active { opacity: 1; }
.slide img { width: 100%; height: 100%; object-fit: cover; }
.slide-overlay { position: absolute; inset: 0; background: linear-gradient(135deg, rgba(0,0,0,0.65) 0%, rgba(34,197,94,0.4) 100%); }
.dot { width: 10px; height: 10px; border-radius: 50%; background: rgba(255,255,255,0.5); cursor: pointer; transition: all 0.3s; }
.dot.active { background: #22c55e; transform: scale(1.3); }

/* Card hover effects (shared) */
.service-card { transition: all 0.3s ease; }
.service-card:hover { transform: translateY(-8px); box-shadow: 0 20px 40px rgba(0,0,0,0.15); }
.price-card { transition: all 0.3s ease; }
.price-card:hover { transform: scale(1.03); }
.route-card { transition: all 0.3s ease; }
.route-card:hover { transform: translateY(-5px); box-shadow: 0 15px 35px rgba(0,0,0,0.12); }
.car-card { transition: all 0.3s ease; }
.car-card:hover { transform: translateY(-8px); box-shadow: 0 20px 40px rgba(0,0,0,0.15); }
.car-card:hover .car-img { transform: scale(1.05); }
.car-img { transition: transform 0.5s ease; }
.post-card { transition: all 0.3s ease; }
.post-card:hover { transform: translateY(-5px); box-shadow: 0 15px 35px rgba(0,0,0,0.12); }
.post-card:hover .post-img { transform: scale(1.05); }
.post-img { transition: transform 0.5s ease; }
.contact-card { transition: all 0.3s ease; }
.contact-card:hover { transform: translateY(-5px); box-shadow: 0 15px 35px rgba(0,0,0,0.12); }

/* Route badge & testimonial (homepage) */
.route-badge { background: linear-gradient(135deg, #dcfce7, #bbf7d0); border-left: 4px solid #22c55e; }
.testimonial-card { background: linear-gradient(135deg, #fff, #f0fdf4); }

/* Map wrapper */
.map-wrapper { border-radius: 20px; overflow: hidden; box-shadow: 0 15px 40px rgba(0,0,0,0.15); }

/* Float buttons (homepage) */
.float-btn { position: fixed; bottom: 24px; right: 24px; z-index: 999; }
.phone-btn { position: fixed; bottom: 90px; right: 24px; z-index: 999; }

/* EV badge (car rental) */
.ev-badge { background: linear-gradient(135deg, #10b981, #059669); }

/* Timeline (about page) */
.timeline-item { position: relative; border-left: 3px solid #22c55e; padding-left: 30px; }
.timeline-item::before { content: ''; position: absolute; left: -10px; top: 0; width: 20px; height: 20px; background: #22c55e; border-radius: 50%; border: 3px solid white; box-shadow: 0 0 0 3px #22c55e; }

/* Price row hover (pricing page) */
.price-row:hover { background: #f0fdf4; }

/* Float animation (contact page) */
@keyframes float { 0%, 100% { transform: translateY(0); } 50% { transform: translateY(-8px); } }
.float-anim { animation: float 3s ease-in-out infinite; }

/* Form input (contact page) */
.form-input { transition: all 0.3s ease; }
.form-input:focus { border-color: #22c55e; box-shadow: 0 0 0 3px rgba(34,197,94,0.1); outline: none; }

/* Success message (contact page) */
.success-msg { animation: fadeIn 0.5s ease; }
@keyframes fadeIn { from { opacity: 0; transform: scale(0.9); } to { opacity: 1; transform: scale(1); } }

/* Article content typography (blog pages) */
.article-content h2 { font-size: 1.5rem; font-weight: 700; color: #111827; margin-top: 2rem; margin-bottom: 1rem; }
.article-content h3 { font-size: 1.25rem; font-weight: 600; color: #1f2937; margin-top: 1.5rem; margin-bottom: 0.75rem; }
.article-content p { color: #4b5563; line-height: 1.8; margin-bottom: 1.25rem; }
.article-content ul { list-style: disc; padding-left: 1.5rem; margin-bottom: 1.25rem; }
.article-content li { color: #4b5563; line-height: 1.8; margin-bottom: 0.5rem; }
.article-content blockquote { border-left: 4px solid #22c55e; padding-left: 1rem; margin: 1.5rem 0; font-style: italic; color: #6b7280; }