/* ===================================
   Taxonomy Archive - Electric Motors
   =================================== */
   :root {
    --em-primary: #5ecc0f;
    --em-primary-dark: #00c866;
    --em-secondary: #1e293b;
    --em-text: #334155;
    --em-text-light: #64748b;
    --em-bg-light: #f8fafc;
    --em-border: #e2e8f0;
    --em-radius: 16px;
    --em-radius-large: 20px;
    --em-shadow: 0 4px 20px rgba(0, 0, 0, 0.08);
    --em-shadow-hover: 0 20px 40px rgba(0, 0, 0, 0.15);
    --em-transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}
   /* ================= GLOBAL ================= */
   .em-taxonomy-archive * {
       box-sizing: border-box;
       font-family: 'Open Sans', sans-serif;
       margin: 0px 0px;
       padding: 0;
   }
   .em-taxonomy-archive  {
width:100%;
}
   .em-taxonomy-content {

    margin: 20px 0px;
  
}
   
   h1, h2, h3, h4, h5 {
       font-family: 'Montserrat', sans-serif;
   
   }
   
   /* ================= HERO ================= */
   .em-taxonomy-hero {
    background: linear-gradient(135deg, var(--em-secondary) 0%, #0f172a 100%);
    padding: 100px 0 80px;
    position: relative;
    overflow: hidden;
   }
   
   .em-hero-bg {
       position: absolute;
       inset: 0;
       background-size: cover;
       background-position: center;
       opacity: 0.3;
       z-index: 0;
   }
   
   .hero-content {
       position: relative;
       z-index: 1;
       max-width: 1200px;
       margin: 0 auto;
       text-align: center;
       color:white;
   }
   .hero-content h1 {

    color:white;
}

   .em-breadcrumbs {
       font-size: 14px;
       margin-bottom: 25px;
       opacity: 0.9;
   }
   
   .em-breadcrumbs a {
       color: var(--em-primary);
       font-weight: 600;
       text-decoration: none;
   }
   
   .em-breadcrumbs span {
       margin: 0 8px;
   }
   
   .term-description {
       max-width: 700px;
       margin: 0 auto 30px auto;
       font-size: 18px;
       line-height: 1.7;
       font-weight: 400;
       opacity: 0.95;
   }
   
   .term-count-badge {
       display: inline-flex;
       align-items: center;
       justify-content: center;
       gap: 8px;
       padding: 12px 28px;
       border-radius: 50px;
       background: var(--em-primary);
       color: var(--em-secondary);
       font-weight: 700;
       font-size: 16px;
       box-shadow: 0 8px 24px rgba(0,230,118,0.3);
   }
   
   /* ================= FILTER BAR ================= */
   .em-filter-bar {
    background: #fff;
    box-shadow: 0 2px 8px rgba(0, 0, 0, .05);
    border-bottom: 3px solid var(--em-primary);
    padding: 20px;
    position: relative;
    top: 0;
}
   
   .filter-wrapper {
       display: flex;
       justify-content: space-between;
       align-items: center;
       gap: 20px;
       flex-wrap: wrap;
   }
   
   .category-filter select {
       width: 100%;
       padding: 14px 18px;
       border-radius: 10px;
       border: 2px solid var(--em-border);
       font-family: 'Montserrat', sans-serif;
       font-weight: 600;
       cursor: pointer;
       color: var(--em-secondary);
       transition: all 0.3s ease;
   }
   
   .category-filter select:focus {
       outline: none;
       border-color: var(--em-primary);
       box-shadow: 0 0 0 3px rgba(0,230,118,0.1);
   }
   
   .view-toggle {
       display: flex;
       gap: 8px;
   }
   
   .view-btn {
       padding: 14px 24px;
       border-radius: 10px;
       font-weight: 700;
       font-family: 'Montserrat', sans-serif;
       cursor: pointer;
       transition: all 0.3s ease;
       border: 2px solid var(--em-border);
       background: white;
       color: var(--em-text);
   }
   
   .view-btn:hover {
       border-color: var(--em-primary);
       color: var(--em-primary);
   }
   
   .view-btn.active {
       background: var(--em-primary);
       color: var(--em-secondary);
       border-color: var(--em-primary);
   }
   
   /* ================= VEHICLE GRID ================= */
   .vehicle-grid {
       display: grid;
       grid-template-columns: repeat(auto-fill, minmax(320px, 1fr));
       gap: 30px;
   }
   
   .vehicle-card {
       background: white;
       border-radius: 16px;
       overflow: hidden;
       box-shadow: 0 4px 20px rgba(0,0,0,0.08);
       position: relative;
       border: 2px solid transparent;
       transition: all 0.4s cubic-bezier(0.4,0,0.2,1);
       display: flex;
       flex-direction: column;
   }
   
   .vehicle-card:hover {
       transform: translateY(-8px);
       box-shadow: 0 20px 40px rgba(0,0,0,0.15);
       border-color: var(--em-primary);
   }
   
   .vehicle-card img {
       width: 100%;
       height: 240px;
       object-fit: cover;
       transition: transform 0.6s ease;
   }
   
   .vehicle-card:hover img {
       transform: scale(1.08);
   }
   
   .card-overlay {
       position: absolute;
       bottom: 0;
       left: 0;
       right: 0;
       height: 0;
       background: linear-gradient(to top, var(--em-primary) 0%, transparent 100%);
       opacity: 0;
       transition: all 0.4s ease;
   }
   
   .vehicle-card:hover .card-overlay {
       height: 100%;
       opacity: 0.15;
   }
   
   .vehicle-badges {
       position: absolute;
       top: 15px;
       right: 15px;
       display: flex;
       flex-direction: column;
       gap: 8px;
   }
   
   .badge {
       padding: 6px 14px;
       border-radius: 20px;
       font-size: 11px;
       font-weight: 700;
       font-family: 'Montserrat', sans-serif;
       text-transform: uppercase;
   }
   
   .badge-featured {
       background: var(--em-primary);
          color: var(   --em-bg-light);

       box-shadow: 0 4px 12px rgba(0,230,118,0.4);
   }
   
   .badge-available {
       background: var(--em-primary);
       color: white;
   }
   
   /* Content */
   .vehicle-content {
       padding: 24px;
       display: flex;
       flex-direction: column;
       gap: 12px;
   }
   
   .vehicle-content h2 a {
       color: var(--em-secondary);
       text-decoration: none;
       transition: color 0.3s;
   }
   
   .vehicle-content h2 a:hover {
       color: var(--em-primary);
   }
   
   .vehicle-excerpt {
       color: var(--em-text-light);
       font-size: 14px;
       line-height: 1.6;
       display: -webkit-box;
       -webkit-line-clamp: 2;
       -webkit-box-orient: vertical;
       overflow: hidden;
   }
   
   .vehicle-specs {
       display: flex;
       gap: 20px;
       padding: 15px 0;
       border-top: 2px solid var(--em-bg-light);
       border-bottom: 2px solid var(--em-bg-light);
       margin-bottom: 20px;
       font-size: 13px;
       font-weight: 600;
       color: var(--em-text);
   }
   
   .vehicle-footer {
       display: flex;
       justify-content: space-between;
       align-items: center;
       gap: 15px;
   }
   
   .vehicle-price {
       font-size: 28px;
       font-weight: 800;
       font-family: 'Montserrat', sans-serif;
       color: var(--em-primary);
   }
   
   .cta-button {
       padding: 12px 24px;
       background: var(--em-secondary);
       color: white;
       text-decoration: none;
       border-radius: 25px;
       font-weight: 700;
       font-family: 'Montserrat', sans-serif;
       transition: all 0.3s ease;
       white-space: nowrap;
   }
   
   .cta-button:hover {
       background: var(--em-primary);
       color: var(--em-secondary);
       transform: translateX(4px);
   }
   
   /* List View */
   .vehicle-grid.list-view {
       grid-template-columns: 1fr !important;
   }
   
   .list-view .vehicle-card {
       display: grid;
       grid-template-columns: 320px 1fr;
   }
   
   .list-view .vehicle-card > .vehicle-image {
       height: 100% !important;
   }
   
   /* Pagination */
   .pagination a,
   .pagination span {
       display: inline-block;
       padding: 12px 18px;
       margin: 0 5px;
       background: white;
       border: 2px solid var(--em-border);
       border-radius: 10px;
       color: var(--em-text);
       text-decoration: none;
       font-weight: 700;
       font-family: 'Montserrat', sans-serif;
       transition: all 0.3s ease;
   }
   
   .pagination a:hover,
   .pagination span.current {
       border-color: var(--em-primary);
       background: var(--em-primary);
       color: white;
   }
   
   /* No Results */
   .no-results {
       text-align: center;
       padding: 100px 20px;
       background: white;
       border-radius: 20px;
       box-shadow: 0 4px 20px rgba(0,0,0,0.05);
   }
   
   .no-results .icon {
       font-size: 80px;
       margin-bottom: 20px;
       opacity: 0.3;
   }
   
   .no-results h2 {
       font-size: 32px;
       color: var(--em-secondary);
       margin-bottom: 15px;
   }
   
   .no-results p {
       font-size: 16px;
       color: var(--em-text-light);
       margin-bottom: 30px;
   }
   
   .no-results .back-home {
       display: inline-block;
       padding: 16px 40px;
       background: var(--em-primary);
       color: var(--em-secondary);
       text-decoration: none;
       border-radius: 30px;
       font-weight: 700;
       font-family: 'Montserrat', sans-serif;
       box-shadow: 0 8px 24px rgba(0,230,118,0.3);
   }
   
   /* ================= RESPONSIVE ================= */
   @media (max-width: 768px) {
    .em-filter-bar {
display:none;
}
       .em-taxonomy-hero h1 {
           font-size: 36px;
       }
       
       .vehicle-grid {
           grid-template-columns: 1fr !important;
       }
       
       .list-view .vehicle-card {
           grid-template-columns: 1fr !important;
       }
   }
   