/* ===== Filtros (mobile-first) ===== */
.dfc-filter-block{margin-bottom:1.5rem}
.dfc-filter-block h3{
  font-family:'Montserrat',sans-serif;font-size:.95rem;font-weight:600;margin:0 0 .5rem;color:#222
}
.dfc-filter-block label,
.dfc-filter-block select,
.dfc-filter-block input,
#dfc-price-value{
  font-family:'Montserrat',sans-serif;font-size:.9rem;font-weight:400;color:#333;line-height:1.4
}

/* Selects dobles (Año/Km) */
.dfc-range-select{display:flex;gap:.5rem}
.dfc-range-select select{
  flex:1;padding:8px 12px;border:1px solid #ddd;border-radius:6px;background:#fff;cursor:pointer;
  transition:border .2s, box-shadow .2s
}
.dfc-range-select select:hover{border-color:#5170ff;box-shadow:0 0 4px rgba(81,112,255,.3)}
.dfc-range-select select:focus{border-color:#5170ff;outline:0;box-shadow:0 0 6px rgba(81,112,255,.4)}

/* Combustible: grid en móvil, fila en escritorio */
.dfc-filter-block.fuel-options{display:grid;grid-template-columns:1fr 1fr;gap:6px}
.dfc-filter-block.fuel-options label{display:flex;align-items:center;gap:4px}
@media (min-width:768px){
  .dfc-filter-block.fuel-options{display:flex;flex-wrap:wrap}
  .dfc-filter-block.fuel-options label{margin-right:15px}
}

/* Etiqueta ECO (pegatinas pequeñas) */
.dfc-eco-options{display:flex;flex-wrap:wrap;gap:6px;align-items:center}
.dfc-eco-options input[type="checkbox"]{display:none}
.dfc-eco-options img{
  width:22px;height:22px;object-fit:contain;border-radius:50%;
  transition:transform .2s, box-shadow .2s
}
@media (min-width:768px){ .dfc-eco-options img{width:28px;height:28px} }
.dfc-eco-options input[type="checkbox"]:checked + img{transform:scale(1.1);box-shadow:0 0 6px rgba(81,112,255,.5)}

/* ===== Loader en el listado ===== */
#dfc-inventory{position:relative}
#dfc-loader{position:absolute;inset:0;background:rgba(255,255,255,.7);display:none;align-items:center;justify-content:center;z-index:10}
#dfc-loader .dfc-spinner{
  width:40px;height:40px;border:4px solid #f3f3f3;border-top:4px solid #5170ff;border-radius:50%;animation:dfcspin 1s linear infinite
}
@keyframes dfcspin{to{transform:rotate(360deg)}}

/* ===== Grid de tarjetas ===== */
.dfc-inventory-grid{display:grid;grid-template-columns:1fr;gap:1rem}
@media (min-width:640px){.dfc-inventory-grid{grid-template-columns:repeat(2,1fr)}}
@media (min-width:1024px){.dfc-inventory-grid{grid-template-columns:repeat(3,1fr)}}

/* Tarjeta */
.dfc-car-card{
  position:relative;background:#fff;border:1px solid #eee;border-radius:10px;overflow:hidden;
  display:flex;flex-direction:column;box-shadow:0 2px 6px rgba(0,0,0,.05);transition:transform .2s, box-shadow .2s
}
.dfc-car-card:hover{transform:translateY(-3px);box-shadow:0 4px 12px rgba(0,0,0,.1)}
.dfc-car-thumb img{width:100%;height:180px;object-fit:cover}
.dfc-car-info{padding:12px;display:flex;flex-direction:column;flex:1}
.dfc-car-title{font-family:'Montserrat',sans-serif;font-size:1rem;font-weight:600;margin:0 0 6px}
.dfc-car-title a{text-decoration:none;color:#222}
.dfc-car-title a:hover{color:#5170ff}
.dfc-car-meta{font-size:.85rem;color:#666;margin-bottom:8px;display:flex;gap:12px;flex-wrap:wrap}
.dfc-car-price{font-size:1.1rem;font-weight:600;color:#5170ff;margin-bottom:10px}
.dfc-car-actions{margin-top:auto}
.dfc-btn{display:inline-block;padding:8px 14px;background:#5170ff;color:#fff;border-radius:6px;font-size:.9rem;text-decoration:none;transition:background .2s}
.dfc-btn:hover{background:#3a54d6}

/* ECO en tarjeta */
.dfc-car-eco{position:absolute;top:10px;left:10px;background:#fff;border-radius:50%;padding:3px;box-shadow:0 2px 6px rgba(0,0,0,.25)}
.dfc-car-eco img{width:28px;height:28px}
/* ===== Acordeón filtros ===== */
.dfc-accordion {
  border: 1px solid #eee;
  border-radius: 10px;
  background: #fafafa;
  margin-bottom: 0.8rem;
  overflow: hidden;
}

.dfc-accordion-header {
  font-family: 'Montserrat', sans-serif;
  font-size: 0.95rem;
  font-weight: 600;
  margin: 0;
  padding: 0.8rem 1rem;
  cursor: pointer;
  background: #f5f5f5;
  border-bottom: 1px solid #eee;
  display: flex;
  justify-content: space-between;
  align-items: center;
}

.dfc-accordion-header::after {
  content: "▾";
  font-size: 0.8rem;
  transition: transform 0.2s ease;
}

.dfc-accordion.active .dfc-accordion-header::after {
  transform: rotate(180deg);
}

.dfc-accordion-body {
  max-height: 0;
  overflow: hidden;
  transition: max-height 0.3s ease, padding 0.3s ease;
  padding: 0 1rem;
}

.dfc-accordion.active .dfc-accordion-body {
  max-height: 500px; /* suficiente para cualquier filtro */
  padding: 1rem;
}

/* En escritorio: acordeones abiertos por defecto */
@media (min-width: 768px) {
  .dfc-accordion .dfc-accordion-body {
    max-height: 500px;
    padding: 1rem;
  }
  .dfc-accordion .dfc-accordion-header::after {
    display: none;
  }
}
/* ===== Layout Inventario + Filtros ===== */
.df-wrap {
  display: flex;
  flex-direction: column;
  gap: 1.5rem;
}

/* En escritorio: sidebar izquierda */
@media (min-width: 1024px) {
  .df-wrap {
    flex-direction: row;
    align-items: flex-start;
  }

  .df-filters {
    flex: 0 0 25%;   /* ancho sidebar */
    max-width: 280px;
    position: sticky; /* se queda fija al hacer scroll */
    top: 20px;
    height: fit-content;
  }

  #dfc-inventory {
    flex: 1;
  }
}
/* === Carrocería con iconos === */
.dfc-carroceria-grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 0.8rem;
}

.dfc-carroceria-btn {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 6px;
  padding: 10px;
  border: 1px solid #ddd;
  border-radius: 8px;
  background: #fff;
  cursor: pointer;
  transition: all 0.2s ease;
  font-family: 'Montserrat', sans-serif;
  font-size: 0.85rem;
  color: #333;
}

.dfc-carroceria-btn img {
  width: 40px;
  height: 40px;
  object-fit: contain;
}

.dfc-carroceria-btn:hover {
  border-color: #5170ff;
  color: #5170ff;
}

.dfc-carroceria-btn:hover {
  border: 2px solid #FFFFFF;
  background: #f4f6ff;
  color: #FFFFFF;
  font-weight: 600;
}
/* === Carrocería con iconos === */
.dfc-carroceria-grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 0.8rem;
}

.dfc-carroceria-btn {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 6px;
  padding: 10px;
  border: 1px solid #ddd;
  border-radius: 8px;
  background: #fff;
  cursor: pointer;
  transition: all 0.2s ease;
  font-family: 'Montserrat', sans-serif;
  font-size: 0.85rem;
  color: #333;
}

.dfc-carroceria-btn img {
  width: 70px;
  height: 70px;
  object-fit: contain;
}

.dfc-carroceria-btn:hover {
  border-color: #FFFFFF;
  color: #FFFFFF;
}

.dfc-carroceria-btn:hover {
  border: 2px solid #FFFFFF;
  background: #fff;   /* mantener blanco en hover */
  color: #FFFFFF;
  font-weight: 600;
}
/* Fondo blanco SIEMPRE en los botones */
.dfc-carroceria-btn,
.dfc-carroceria-btn:hover,
.dfc-carroceria-btn:focus,
.dfc-carroceria-btn.active {
  background: #fff !important;
  color: #333 !important;
}

/* Cuando está activo, solo cambia el borde y el texto */
.dfc-carroceria-btn.active {
  border: 2px solid #5170ff ;
  color: #5170ff;
  font-weight: 600;
}
/* Botones de carrocería */
.dfc-carroceria-btn {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: flex-start; /* alineamos arriba */
  gap: 8px;
  padding: 12px;
  border: 1px solid #ddd;
  border-radius: 8px;
  background: #fff;
  cursor: pointer;
  transition: all 0.2s ease;
  font-family: 'Montserrat', sans-serif;
  font-size: 0.85rem;
  color: #333;
  height: 120px;     /* altura fija para que no crezca */
  width: 100px;      /* ancho fijo */
}

.dfc-carroceria-btn img {
  width: 70px;       /* agranda SOLO la imagen */
  height: 70px;
  object-fit: contain;
  flex-shrink: 0;    /* evita que se deforme */
}

.dfc-carroceria-btn span {
  font-size: 0.85rem;
  margin-top: auto; /* baja el texto al fondo */
}

/* Hover / Activo */
.dfc-carroceria-btn:hover {
  border-color: #5170ff;
  background: #fff;
  color: #5170ff;
}

.dfc-carroceria-btn.active {
  border: 2px solid #5170ff;
  background: #fff;
  color: #5170ff;
  font-weight: 600;
}
.dfc-carroceria-btn {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 6px;
  padding: 12px;
  border: 1px solid #5170ff;
  border-radius: 8px;
  background: #fff;
  cursor: pointer;
  transition: all 0.2s ease;
  font-family: 'Montserrat', sans-serif;
  font-size: 0.9rem;
  color: #333;
  width: 120px;     /* ancho fijo uniforme */
  height: 130px;    /* altura fija uniforme */
}

.dfc-carroceria-btn img {
  width: 70px;
  height: 70px;
  object-fit: contain;
}

.dfc-carroceria-btn span {
  margin-top: auto;
  text-align: center;
}
/* Grid flexible para que quepan las 8 */
.dfc-carroceria-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(80px, 1fr)); /* ajusta automáticamente */
  gap: 8px;
}

/* Botones más compactos */
.dfc-carroceria-btn {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  padding: 6px;
  border: 1px solid #5170ff;
  border-radius: 6px;
  background: #fff;
  cursor: pointer;
  transition: all 0.2s ease;
  font-family: 'Montserrat', sans-serif;
  font-size: 0.75rem; /* texto más pequeño */
  color: #333;
  min-height: 90px;   /* más bajo */
}

/* Iconos grandes pero dentro de tarjetas pequeñas */
.dfc-carroceria-btn img {
  width: 50px;
  height: 50px;
  object-fit: contain;
  margin-bottom: 4px;
}

/* Activo y hover */
.dfc-carroceria-btn.active {
  border: 2px solid #5170ff;
  color: #5170ff;
  font-weight: 600;
}
/* 1) El acordeón no debe cortar nada */
.dfc-accordion .dfc-accordion-body {
  max-height: none;
  overflow: visible;
  padding: 1rem;
}

/* 2) Grid compacto pero ajustado a todos iguales */
.dfc-carroceria-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(95px, 1fr));
  gap: 12px;
}

/* 3) Botones un poquito más grandes */
.dfc-carroceria-btn {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  padding: 8px;
  border: 1px solid #5170ff;
  border-radius: 6px;
  background: #fff;
  cursor: pointer;
  transition: all 0.2s ease;
  font-family: 'Montserrat', sans-serif;
  font-size: 0.8rem;
  color: #333;
  min-height: 115px;   /* más altos que antes */
}

/* 4) Iconos grandes, todos proporcionales */
.dfc-carroceria-btn img {
  width: 45px;
  height: 45px;
  object-fit: contain;   /* evita que coupé quede raro */
  display: block; 
}

/* 5) Texto uniforme */
.dfc-carroceria-btn span {
  text-align: center;
  line-height: 1.2;
  margin-top: 4px;
}

/* Hover/Activo */
.dfc-carroceria-btn.active {
  border: 2px solid #5170ff;
  color: #5170ff;
  font-weight: 600;
}
/* --- Estilos por defecto (desktop) --- */
.dfc-carroceria-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(95px, 1fr));
  gap: 12px;
}

/* --- Versión móvil con scroll horizontal --- */
@media (max-width: 768px) {
  .dfc-carroceria-grid {
    display: flex;
    overflow-x: auto;
    gap: 10px;
    padding-bottom: 8px;
    scroll-snap-type: x mandatory;  /* efecto "snap" al deslizar */
  }

  .dfc-carroceria-btn {
    flex: 0 0 auto;              /* tamaño fijo para el scroll */
    width: 95px;                 /* ancho fijo en móvil */
    height: 115px;
    scroll-snap-align: start;    /* se alinean al inicio al soltar */
  }

  /* ocultar scroll bar fea */
  .dfc-carroceria-grid::-webkit-scrollbar {
    display: none;
  }
}
/* Tarjetas ajustadas */
.dfc-carroceria-btn {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;   /* centra icono + texto */
  padding: 10px;
  border: 1px solid #5170ff;
  border-radius: 6px;
  background: #fff;
  cursor: pointer;
  transition: all 0.2s ease;
  font-family: 'Montserrat', sans-serif;
  font-size: 0.85rem;
  color: #333;
  min-height: 110px;   /* bajamos un poco la altura */
}

/* Iconos grandes */
.dfc-carroceria-btn img {
  width: 65px;
  height: 65px;
  object-fit: contain;
  margin-bottom: 6px;   /* espacio justo encima del texto */
}

/* Texto alineado debajo del icono */
.dfc-carroceria-btn span {
  text-align: center;
  line-height: 1.2;
  margin: 0;  /* eliminamos márgenes extra */
}
/* Sobrescribe el span para que no se pegue abajo */
.dfc-carroceria-btn span {
  margin-top: 0 !important;   /* forzamos a 0 */
  text-align: center;
  line-height: 1.2;
}
/* Botón de carrocería */
.dfc-carroceria-btn {
  display: flex;
  flex-direction: column;   /* icono arriba, texto debajo */
  align-items: center;
  justify-content: flex-start; /* todo empieza arriba */
  padding: 10px;
  border: 1px solid #5170ff;
  border-radius: 6px;
  background: #fff;
  cursor: pointer;
  transition: all 0.2s ease;
  font-family: 'Montserrat', sans-serif;
  font-size: 0.85rem;
  color: #333;
  min-height: 120px;   /* altura uniforme */
}

/* Icono */
.dfc-carroceria-btn img {
  width: 65px;
  height: 65px;
  object-fit: contain;
  margin: 0 0 6px 0; /* espacio solo debajo del icono */
}

/* Texto */
.dfc-carroceria-btn span {
  margin: 0;        /* borramos margen raro heredado */
  padding: 0;
  text-align: center;
  line-height: 1.2;
  flex-shrink: 0;              /* evita que se estire */
}
/* Botones de Carrocería */
.dfc-carroceria-btn {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 8px;
  width: 120px;   /* más ancho */
  height: 130px;  /* más alto */
  border: 1.5px solid #ddd;
  border-radius: 10px;
  background: #fff;
  transition: all 0.2s ease;
  font-size: 15px;
  font-weight: 500;
  cursor: pointer;
  overflow: visible; /* evita que se corten los iconos */
}

/* Iconos más grandes */
.dfc-carroceria-btn img {
  width: 60px;   /* más grande */
  height: auto;  /* mantiene proporción */
  max-height: 60px;
  object-fit: contain;
}
/* ===== Ajuste visual Carrocería (solo CSS, sin cambiar imágenes) ===== */
.dfc-carroceria-btn {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 8px;
  width: 110px;   /* más ancho */
  height: 120px;  /* más alto */
  padding: 10px;  /* espacio interno */
  border: 1.5px solid #ddd;
  border-radius: 10px;
  background: #fff;
  transition: all 0.2s ease;
  font-size: 14px;
  font-weight: 500;
  cursor: pointer;
}

.dfc-carroceria-btn img {
  max-width: 45px;   /* icono limitado */
  max-height: 45px;  /* evita que se corte */
  object-fit: contain;
  margin: 0 auto;    /* centrado */
}

.dfc-carroceria-btn.active {
  border: 2px solid #5170ff;
  color: #5170ff;
  background: #fff;
  font-weight: 600;
}

.dfc-carroceria-btn:hover {
  border-color: #5170ff;
  color: #5170ff;
}
/* Iconos Carrocería – un poco más grandes */
.dfc-carroceria-btn img {
  width: 80px;       /* más ancho */
  height: auto;      /* mantiene proporción */
  max-height: 70px;  /* evita que sobresalga */
  object-fit: contain;
  display: block;
  margin: 0 auto;
}
.dfc-filter-block summary {
  font-weight: 600;
  cursor: pointer;
  padding: 8px;
  list-style: none;
}

.dfc-filter-block summary::-webkit-details-marker {
  display: none;
}

.dfc-filter-block[open] summary {
  color: #5170ff;
}
/* Carrocería: 2 columnas en móvil */
@media (max-width: 768px) {
  .dfc-carroceria-grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr); /* 2 columnas */
    gap: 10px;
  }

  .dfc-carroceria-btn {
    width: 100%;   /* que ocupen toda la columna */
    height: 110px; /* mismo alto */
  }

  .dfc-carroceria-btn img {
    max-width: 50px;
    max-height: 50px;
  }
}
.dfc-card {
  background: #fff;
  border-radius: 12px;
  box-shadow: 0 2px 8px rgba(0,0,0,0.08);
  overflow: hidden;
  transition: transform .2s;
}
.dfc-card:hover {
  transform: translateY(-4px);
}

.dfc-card-img img {
  width: 100%;
  height: 180px;
  object-fit: cover;
  display: block;
}

.dfc-card-body {
  padding: 12px 15px;
}

.dfc-card-title {
  font-size: 16px;
  margin-bottom: 6px;
}

.dfc-card-price {
  font-size: 18px;
  font-weight: bold;
  color: #5170ff;
  margin-bottom: 10px;
}

.dfc-card-meta {
  list-style: none;
  margin: 0 0 10px 0;
  padding: 0;
  font-size: 14px;
  display: flex;
  flex-wrap: wrap;
  gap: 8px 16px;
}

.dfc-card-meta li {
  display: flex;
  align-items: center;
  gap: 4px;
}

.dfc-card-meta img.dfc-etiqueta {
  width: 26px;
  height: auto;
}

.dfc-card-btn {
  text-align: center;
}
.dfc-card-btn .dfc-btn {
  display: inline-block;
  background: #5170ff;
  color: #fff;
  padding: 8px 14px;
  border-radius: 6px;
  font-size: 14px;
  text-decoration: none;
  transition: background .2s;
}
.dfc-card-btn .dfc-btn:hover {
  background: #3c55d6;
}
.dfc-car-meta {
  display: flex;
  flex-wrap: wrap;
  gap: 10px 16px; /* separación entre items */
  font-size: 14px;
  color: #333;
  margin: 8px 0;
}

.dfc-car-meta span {
  display: flex;
  align-items: center;
  white-space: nowrap; /* evita que se corten en dos líneas */
}
.dfc-car-eco {
  position: absolute;
  top: 10px;
  left: 10px;
  background: transparent; /* 👈 elimina el fondo blanco */
  padding: 0;              /* 👈 quita padding extra */
  border-radius: 0;        /* 👈 evita recorte circular */
  box-shadow: none;        /* 👈 por si había sombra */
}

.dfc-car-eco img {
  width: 35px;   /* ajusta el tamaño como quieras */
  height: auto;
  display: block;
}
/* Ocultar el loop nativo de WooCommerce SOLO cuando está nuestro inventario */
body:has(.df-wrap.df-inventory) .woocommerce-result-count,
body:has(.df-wrap.df-inventory) .woocommerce-ordering,
body:has(.df-wrap.df-inventory) .woocommerce-notices-wrapper,
body:has(.df-wrap.df-inventory) ul.products,
body:has(.df-wrap.df-inventory) .woocommerce-loop-category__title,
body:has(.df-wrap.df-inventory) .woocommerce-pagination {
  display: none !important;
}

/* Opcional: eliminar huecos extra del contenedor de Woo */
body:has(.df-wrap.df-inventory) .woocommerce {
  margin: 0 !important;
  padding: 0 !important;
}
/* Etiqueta ECO - mobile first */
.dfc-car-eco {
  position: absolute;
  top: 8px;
  left: 8px;
  background: none !important;
  padding: 0;
  border: none;
  box-shadow: none;
  z-index: 5;
}

.dfc-car-eco img {
  width: 32px;   /* tamaño base en móvil */
  height: auto;
  display: block;
}

/* Escalar un poco en pantallas grandes */
@media (min-width: 768px) {
  .dfc-car-eco img {
    width: 40px;  /* más grande pero sin pasarse */
  }
}
.dfc-car-actions {
  display: flex;
  justify-content: space-between;
  gap: 10px;
  margin-top: 10px;
}

.dfc-btn {
  flex: 1;
  text-align: center;
  padding: 10px 14px;
  border-radius: 8px;
  font-size: 14px;
  font-weight: 600;
  cursor: pointer;
  text-decoration: none;
  transition: background 0.2s ease;
}

/* Call to Action - doble botón */
.dfc-car-actions {
  display: flex;
  gap: 10px;
  margin-top: 12px;
}

.dfc-btn {
  flex: 1;
  text-align: center;
  font-family: 'Montserrat', sans-serif;
  font-weight: 600;
  font-size: 14px;
  padding: 10px 14px;
  border-radius: 8px;
  cursor: pointer;
  text-decoration: none;
  transition: all 0.2s ease;
}
.dfc-car-actions {
  display: flex;
  gap: 10px;
  margin-top: 12px;
}

.dfc-btn {
  flex: 1;
  text-align: center;
  font-family: 'Montserrat', sans-serif;
  font-weight: 600;
  font-size: 14px;
  padding: 10px 0;          /* mismo alto en todos */
  border-radius: 8px;
  cursor: pointer;
  text-decoration: none;
  transition: all 0.2s ease;
  line-height: 1.2;         /* evita que el texto "salte" */
}

/* Botón principal */
.dfc-btn-primary {
  background: #5170ff;
  color: #fff;
  border: 2px solid #5170ff;
}

/* Botón secundario */
.dfc-btn-secondary {
  background: #fff;
  color: #5170ff;
  border: 2px solid #5170ff;
}

/* Hovers */
.dfc-btn-primary:hover {
  background: #3a56d4;
  border-color: #3a56d4;
}

.dfc-btn-secondary:hover {
  background: #f5f7ff;
}

/* === Ficha individual (Drivefinity Cars) === */
.dfc-single {
  max-width: 1100px;
  margin: 0 auto;
  padding: 20px;
  font-family: 'Montserrat', sans-serif;
}

.dfc-single-top {
  display: flex;
  flex-wrap: wrap;
  gap: 30px;
}

.dfc-single-image img {
  width: 100%;
  max-width: 520px;
  border-radius: 12px;
  object-fit: cover;
  box-shadow: 0 2px 12px rgba(0,0,0,0.1);
}

.dfc-single-info {
  flex: 1;
  min-width: 280px;
}

.dfc-single-title {
  font-size: 28px;
  font-weight: 700;
  margin-bottom: 10px;
}

.dfc-single-price {
  font-size: 24px;
  color: #5170ff;
  font-weight: 600;
  margin-bottom: 20px;
}

.dfc-single-attrs {
  width: 100%;
  border-collapse: collapse;
  margin-bottom: 20px;
}

.dfc-single-attrs th {
  text-align: left;
  padding: 8px 0;
  color: #444;
  font-weight: 500;
  width: 40%;
}

.dfc-single-attrs td {
  padding: 8px 0;
  color: #111;
}

.dfc-single-buttons {
  display: flex;
  gap: 10px;
  flex-wrap: wrap;
}

.dfc-btn {
  flex: 1;
  text-align: center;
  padding: 12px;
  border-radius: 8px;
  font-weight: 600;
  text-decoration: none;
  transition: 0.2s;
}

.dfc-btn-primary {
  background: #5170ff;
  color: #fff;
}

.dfc-btn-primary:hover {
  background: #3a56d4;
}

.dfc-btn-secondary {
  border: 2px solid #5170ff;
  color: #5170ff;
  background: #fff;
}

.dfc-btn-secondary:hover {
  background: #f4f7ff;
}

.dfc-single-description {
  margin-top: 40px;
}

.dfc-single-description h2 {
  font-size: 22px;
  font-weight: 600;
  border-bottom: 2px solid #5170ff;
  display: inline-block;
  margin-bottom: 10px;
}

/* Responsive */
@media (max-width: 768px) {
  .dfc-single-top {
    flex-direction: column;
  }

  .dfc-btn {
    flex: 1 1 100%;
  }
}

.dfc-single {
  max-width: 1100px;
  margin: 2rem auto;
  font-family: 'Montserrat', sans-serif;
}

.dfc-single-top {
  display: flex;
  flex-wrap: wrap;
  gap: 2rem;
}

.dfc-single-gallery img {
  width: 100%;
  max-width: 500px;
  border-radius: 10px;
}

.dfc-single-info {
  flex: 1;
  min-width: 300px;
}

.dfc-title {
  font-size: 1.8rem;
  margin-bottom: .5rem;
}

.dfc-price {
  font-size: 1.6rem;
  font-weight: 600;
  color: #5170ff;
  margin-bottom: 1rem;
}

.dfc-table {
  width: 100%;
  border-collapse: collapse;
  margin-bottom: 1rem;
}

.dfc-table th {
  text-align: left;
  color: #666;
  padding: .4rem 0;
  width: 40%;
}

.dfc-table td {
  color: #111;
  padding: .4rem 0;
}

.dfc-contact {
  display: flex;
  gap: .5rem;
  margin-top: 1rem;
}

.dfc-btn {
  flex: 1;
  padding: .8rem;
  text-align: center;
  border-radius: 8px;
  text-decoration: none;
  font-weight: 600;
  transition: 0.2s;
}

.dfc-call {
  background: #5170ff;
  color: white;
}

.dfc-whatsapp {
  border: 2px solid #5170ff;
  color: #5170ff;
  background: white;
}

.dfc-call:hover {
  background: #3b57e0;
}

.dfc-whatsapp:hover {
  background: #f5f6ff;
}

.dfc-desc {
  margin-top: 2rem;
}

.dfc-desc h2 {
  font-size: 1.3rem;
  color: #333;
  margin-bottom: .5rem;
}

.dfc-single-wrapper {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 40px;
  max-width: 1200px;
  margin: 40px auto;
  font-family: 'Montserrat', sans-serif;
}

.dfc-single-gallery img {
  width: 100%;
  border-radius: 12px;
  box-shadow: 0 4px 12px rgba(0,0,0,0.1);
}

.dfc-single-info h1 {
  font-size: 2rem;
  margin-bottom: 10px;
}

.dfc-single-price {
  font-size: 1.5rem;
  color: #5170ff;
  margin-bottom: 20px;
}

.dfc-single-specs {
  width: 100%;
  border-collapse: collapse;
  margin-bottom: 25px;
}

.dfc-single-specs th {
  text-align: left;
  color: #666;
  padding: 6px 10px;
}

.dfc-single-specs td {
  padding: 6px 10px;
  font-weight: 500;
}

.dfc-btn {
  display: inline-block;
  padding: 10px 18px;
  border-radius: 8px;
  font-weight: 600;
  text-align: center;
  margin-right: 10px;
  text-decoration: none;
}

.dfc-btn.primary {
  background: #5170ff;
  color: white;
}

.dfc-btn.outline {
  border: 2px solid #5170ff;
  color: #5170ff;
}

@media (max-width: 768px) {
  .dfc-single-wrapper {
    grid-template-columns: 1fr;
    padding: 0 20px;
  }
}
/* === GALERÍA DE IMÁGENES === */
.dfc-gallery-main img {
  width: 100%;
  height: auto;
  border-radius: 12px;
  box-shadow: 0 3px 10px rgba(0,0,0,0.1);
}

.dfc-gallery-thumbs {
  display: flex;
  justify-content: center;
  gap: 10px;
  margin-top: 12px;
  flex-wrap: wrap;
}

.dfc-gallery-thumbs img {
  width: 80px;
  height: 60px;
  object-fit: cover;
  border-radius: 6px;
  cursor: pointer;
  opacity: 0.6;
  transition: opacity 0.2s, transform 0.2s;
}

.dfc-gallery-thumbs img.active {
  opacity: 1;
  transform: scale(1.05);
  border: 2px solid #5170ff;
}

.dfc-gallery-thumbs img:hover {
  opacity: 1;
}

/* === Responsive === */
@media (max-width: 768px) {
  .dfc-gallery-thumbs img {
    width: 60px;
    height: 45px;
  }
}
/* === EFECTO ZOOM EN IMAGEN PRINCIPAL (INTENSO) === */
.dfc-gallery-main {
  overflow: hidden;
  border-radius: 12px;
  position: relative;
}

.dfc-gallery-main img {
  transition: transform 0.4s ease-in-out, filter 0.3s ease;
  cursor: zoom-in;
}

.dfc-gallery-main img:hover {
  transform: scale(1.25);
  filter: brightness(1.1) contrast(1.05);
}

/* En móviles, reducimos el zoom para evitar que se corte */
@media (max-width: 768px) {
  .dfc-gallery-main img:hover {
    transform: scale(1.08);
  }
}
/* === Diseño estilo #1 limpio / profesional === */

.dfc-single-wrapper {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 2.5rem;
  align-items: start;
  padding: 3rem 5%;
  background: #f8f9fb;
  font-family: 'Montserrat', sans-serif;
}

.dfc-single-gallery {
  background: #fff;
  border-radius: 12px;
  box-shadow: 0 4px 12px rgba(0,0,0,0.05);
  padding: 1rem;
  text-align: center;
}

.dfc-gallery-main img {
  width: 100%;
  height: auto;
  border-radius: 8px;
  object-fit: cover;
  transition: transform 0.3s ease;
}

.dfc-gallery-thumbs {
  display: flex;
  gap: 10px;
  justify-content: center;
  margin-top: 1rem;
  flex-wrap: wrap;
}

.dfc-thumb {
  width: 70px;
  height: 55px;
  border-radius: 6px;
  cursor: pointer;
  opacity: 0.7;
  transition: opacity 0.3s, border 0.3s;
}

.dfc-thumb:hover,
.dfc-thumb.active {
  opacity: 1;
  border: 2px solid #5170ff;
}

.dfc-single-info {
  background: #fff;
  border-radius: 12px;
  box-shadow: 0 4px 12px rgba(0,0,0,0.05);
  padding: 2rem;
}

.dfc-single-info h1 {
  font-size: 1.8rem;
  font-weight: 700;
  margin-bottom: 0.5rem;
}

.dfc-single-price {
  font-size: 1.6rem;
  font-weight: 700;
  color: #5170ff;
  margin-bottom: 1.5rem;
}

.dfc-single-specs {
  width: 100%;
  border-collapse: collapse;
  margin-bottom: 1.5rem;
}

.dfc-single-specs th,
.dfc-single-specs td {
  text-align: left;
  padding: 0.6rem 0;
  border-bottom: 1px solid #e5e7eb;
}

.dfc-single-specs th {
  color: #555;
  font-weight: 600;
  width: 35%;
}

.dfc-single-buttons {
  display: flex;
  gap: 1rem;
  margin-bottom: 2rem;
}

.dfc-btn {
  padding: 0.9rem 1.8rem;
  border-radius: 10px;
  font-weight: 600;
  text-decoration: none;
  transition: all 0.3s ease;
  text-align: center;
}

.dfc-btn.primary {
  background: #5170ff;
  color: white;
}

.dfc-btn.outline {
  border: 2px solid #5170ff;
  color: #5170ff;
  background: transparent;
}

.dfc-btn:hover {
  transform: translateY(-2px);
}

.dfc-single-desc h2 {
  font-size: 1.3rem;
  font-weight: 700;
  margin-bottom: 0.8rem;
}

.dfc-single-desc p {
  line-height: 1.6;
  color: #333;
}

/* === Responsive === */
@media (max-width: 900px) {
  .dfc-single-wrapper {
    grid-template-columns: 1fr;
    padding: 2rem 2%;
  }
  .dfc-single-info {
    margin-top: 2rem;
  }
  .dfc-thumb {
    width: 60px;
    height: 45px;
  }
}
/* === Tabla de especificaciones en single.php === */
.dfc-single-specs {
  width: 100%;
  border-collapse: separate;
  border-spacing: 0 8px; /* Espaciado vertical entre filas */
  font-family: 'Montserrat', sans-serif;
}

.dfc-single-specs th,
.dfc-single-specs td {
  padding: 12px 16px;
  border-bottom: 1px solid #e0e0e0;
  font-size: 15px;
  line-height: 1.6;
}

.dfc-single-specs th {
  font-weight: 700;
  color: #222;
  width: 40%;
}

.dfc-single-specs td {
  font-weight: 400;
  color: #444;
}

/* Mejor separación entre las celdas y el borde */
.dfc-single-specs tr:last-child th,
.dfc-single-specs tr:last-child td {
  border-bottom: none;
}

/* Sutil sombreado al pasar el ratón */
.dfc-single-specs tr:hover {
  background-color: #f9f9f9;
  transition: background-color 0.2s ease;
}

/* Responsive */
@media (max-width: 768px) {
  .dfc-single-specs th,
  .dfc-single-specs td {
    display: block;
    width: 100%;
    text-align: left;
    padding: 10px 0;
  }
  .dfc-single-specs th {
    font-size: 14px;
  }
  .dfc-single-specs td {
    margin-bottom: 6px;
    color: #555;
  }
}
/* === Precio destacado === */
.dfc-single-price {
  font-family: 'Montserrat', sans-serif;
  font-size: 2rem;
  font-weight: 700;
  color: #5170ff;
  margin: 10px 0 20px;
}

/* Subtítulo debajo del precio (opcional si añades algo) */
.dfc-single-subprice {
  font-size: 0.9rem;
  color: #888;
}
/* === Tarjeta de especificaciones tipo coches.net === */
.dfc-car-specs-card {
  background: #fff;
  border-radius: 12px;
  box-shadow: 0 4px 12px rgba(0,0,0,0.05);
  padding: 25px 30px;
  margin-top: 40px;
  font-family: 'Montserrat', sans-serif;
}

.dfc-car-icons {
  display: flex;
  justify-content: space-around;
  text-align: center;
  margin-bottom: 20px;
  color: #222;
}

.dfc-car-icons div {
  display: flex;
  flex-direction: column;
  align-items: center;
  font-size: 14px;
}

.dfc-car-icons i {
  font-size: 20px;
  margin-bottom: 5px;
  color: #5170ff;
}

.dfc-car-specs-table {
  width: 100%;
  border-collapse: collapse;
  font-size: 15px;
  color: #333;
}

.dfc-car-specs-table td {
  padding: 10px 15px;
  border-bottom: 1px solid #e5e5e5;
  vertical-align: middle;
}

.dfc-car-specs-table tr td + td {
  border-left: 1px solid #e5e5e5;
}

.dfc-car-specs-table strong {
  font-weight: 700;
  color: #000;
}
/* === FICHA ESTILO COCHES.NET === */
.dfc-car-specs-card {
  background: #fff;
  border-radius: 16px;
  box-shadow: 0 3px 12px rgba(0,0,0,0.05);
  padding: 1.8rem;
  margin-top: 1.8rem;
  font-family: 'Montserrat', sans-serif;
}

.dfc-car-icons {
  display: flex;
  justify-content: space-around;
  text-align: center;
  margin-bottom: 1.2rem;
}
.dfc-car-icons div {
  display: flex;
  flex-direction: column;
  align-items: center;
  font-size: 0.85rem;
  color: #333;
}
.dfc-car-icons i {
  font-size: 1.2rem;
  color: #5170ff;
  margin-bottom: 4px;
}

.dfc-car-specs-table {
  width: 100%;
  border-collapse: collapse;
  text-align: left;
  color: #333;
  font-size: 0.95rem;
}
.dfc-car-specs-table td {
  padding: 0.8rem;
  border-top: 1px solid #eee;
  width: 25%;
  vertical-align: top;
}
.dfc-car-specs-table .label {
  color: #777;
  font-size: 0.8rem;
  text-transform: uppercase;
}
.dfc-car-specs-table strong {
  color: #000;
  font-weight: 600;
}
.dfc-car-specs-table .centered {
  text-align: center;
}

/* === RESPONSIVE === */
@media (max-width: 768px) {
  .dfc-car-specs-table td {
    width: 50%;
    display: inline-block;
    box-sizing: border-box;
  }
}
/* === TARJETA DE ESPECIFICACIONES (versión final mejorada y aireada) === */
.dfc-car-specs-card {
  width: 100%;
  max-width: 100%;
  box-sizing: border-box;
  background: #fff;
  border-radius: 16px;
  padding: 2rem;
  box-shadow: 0 3px 10px rgba(0, 0, 0, 0.05);
  margin-top: 2rem;
}

/* Iconos superiores */
.dfc-car-icons {
  display: flex;
  justify-content: space-evenly;
  text-align: center;
  margin-bottom: 1.5rem;
  flex-wrap: wrap;
  gap: 1rem;
}

.dfc-car-icons div {
  display: flex;
  flex-direction: column;
  align-items: center;
  color: #5170ff;
  font-size: 14px;
}

.dfc-car-icons i {
  font-size: 22px;
  margin-bottom: 6px;
}

/* Tabla moderna estilo coches.net */
.dfc-car-specs-table {
  width: 100%;
  border-collapse: separate;
  border-spacing: 0;
  font-family: 'Montserrat', sans-serif;
  font-size: 14px;
  text-align: center;
  table-layout: fixed;
}

.dfc-car-specs-table td {
  width: 25%;
  padding: 14px 8px;
  border: 1px solid #eee;
  vertical-align: middle;
  word-wrap: break-word;
  line-height: 1.4;
}

.dfc-car-specs-table td strong {
  display: block;
  font-size: 15px;
  color: #000;
  font-weight: 600;
}

.dfc-car-specs-table td::before {
  content: attr(data-label);
  display: block;
  font-size: 12px;
  color: #999;
  text-transform: uppercase;
  margin-bottom: 3px;
  letter-spacing: 0.5px;
}

.dfc-car-specs-table tr:last-child td {
  text-align: center;
  border-bottom: none;
  font-weight: 600;
  padding-top: 18px;
}

/* Responsivo */
@media (max-width: 768px) {
  .dfc-car-specs-table td {
    width: 50%;
    padding: 12px 6px;
  }

  .dfc-car-specs-card {
    padding: 1.2rem;
  }
}
/* === Layout general === */
.dfc-single-wrapper {
  display: flex;
  flex-direction: column;
  gap: 40px;
  padding: 40px 5%;
  background: #fff;
}

/* === Sección superior === */
.dfc-top-section {
  display: flex;
  gap: 50px;
  align-items: flex-start;
}

/* === Galería === */
.dfc-single-gallery {
  flex: 2;
}
.dfc-gallery-main img {
  width: 100%;
  border-radius: 12px;
}
.dfc-gallery-thumbs {
  display: flex;
  gap: 10px;
  margin-top: 12px;
}
.dfc-gallery-thumbs img {
  width: 90px;
  border-radius: 8px;
  cursor: pointer;
  transition: 0.3s;
}
.dfc-gallery-thumbs img.active,
.dfc-gallery-thumbs img:hover {
  border: 2px solid #5170ff;
}

/* === Info principal === */
.dfc-single-info {
  flex: 1;
  background: #fff;
  padding: 30px;
  border-radius: 16px;
  box-shadow: 0 4px 15px rgba(0, 0, 0, 0.06);
}
.dfc-title {
  font-weight: 700;
  font-size: 26px;
  margin-bottom: 10px;
}
.dfc-single-price {
  color: #5170ff;
  font-weight: 700;
  font-size: 22px;
  margin-bottom: 20px;
}
.dfc-single-specs th {
  text-align: left;
  color: #666;
  padding-right: 10px;
  font-weight: 600;
}
.dfc-single-specs td {
  padding: 5px 0;
  color: #333;
}

/* === Botones === */
.dfc-single-buttons {
  display: flex;
  gap: 10px;
  margin-top: 15px;
}
.dfc-btn {
  display: inline-block;
  text-align: center;
  padding: 10px 18px;
  border-radius: 8px;
  font-weight: 600;
  cursor: pointer;
  text-decoration: none;
}
.dfc-btn.primary {
  background: #5170ff;
  color: #fff;
}
.dfc-btn.outline {
  border: 2px solid #5170ff;
  color: #5170ff;
  background: transparent;
}

/* === Ficha técnica === */
.dfc-car-specs-card {
  background: #fff;
  border-radius: 16px;
  padding: 24px;
  box-shadow: 0 4px 15px rgba(0, 0, 0, 0.06);
}
.dfc-car-icons {
  display: flex;
  justify-content: space-around;
  margin-bottom: 15px;
  color: #5170ff;
}
.dfc-car-icons div {
  display: flex;
  flex-direction: column;
  align-items: center;
  font-size: 14px;
  gap: 5px;
}
.dfc-car-specs-table {
  width: 100%;
  border-collapse: collapse;
}
.dfc-car-specs-table td {
  padding: 10px 12px;
  border-bottom: 1px solid #eee;
}

/* === Descripción === */
.dfc-single-desc {
  background: #fff;
  border-radius: 16px;
  padding: 30px;
  box-shadow: 0 4px 15px rgba(0, 0, 0, 0.06);
}
.dfc-single-desc h2 {
  margin-bottom: 15px;
  font-weight: 700;
}

/* === Responsive === */
@media (max-width: 900px) {
  .dfc-top-section {
    flex-direction: column;
  }
}
/* --- Ajustar tamaño del precio --- */
.dfc-single-price {
  font-size: 34px;        /* más grande y destacado */
  font-weight: 700;
  color: #5170ff;         /* mantiene el azul Drivefinity */
  margin-bottom: 25px;    /* espacio extra bajo el precio */
}

/* --- Corregir márgenes de la tabla --- */
.dfc-single-specs {
  width: 100%;
  border-collapse: collapse;
  margin-top: 20px;
}

.dfc-single-specs th,
.dfc-single-specs td {
  padding: 14px 20px;     /* más aire entre texto y bordes */
  border-bottom: 1px solid #e5e5e5;
  font-family: 'Montserrat', sans-serif;
}

.dfc-single-specs th {
  font-weight: 600;
  color: #222;
  width: 35%;
}

.dfc-single-specs td {
  color: #444;
}

/* --- Ajustar margen general del bloque derecho --- */
.dfc-single-info {
  padding: 35px;          /* equilibra espacio interior */
  background: #fff;
  border-radius: 16px;
  box-shadow: 0 6px 16px rgba(0,0,0,0.05);
}
/* ==== NUEVO ESTILO VEHÍCULO ==== */
.dfc-single-info {
  background: #fff;
  padding: 30px;
  border-radius: 20px;
  box-shadow: 0 5px 20px rgba(0,0,0,0.05);
  margin-top: 20px;
}

.dfc-title-wrapper {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  gap: 10px;
}

.dfc-car-title {
  font-size: 32px;
  font-weight: 700;
  margin: 0;
}

.dfc-car-subtitle {
  font-size: 18px;
  color: #555;
  margin-top: 5px;
}

.dfc-eco-badge img {
  width: 50px;
  height: auto;
}

.dfc-price-section {
  margin-top: 15px;
  border-radius: 10px;
}

.dfc-price-main {
  font-size: 40px;
  font-weight: 800;
  color: #5170ff;
}

.dfc-car-quickdata {
  display: flex;
  justify-content: flex-start;
  gap: 30px;
  flex-wrap: wrap;
  margin-top: 15px;
  padding: 15px;
  border-radius: 10px;
  background: #f9f9f9;
  font-size: 16px;
  color: #333;
}

.dfc-car-quickdata span {
  font-weight: 600;
}

.dfc-single-buttons {
  margin-top: 25px;
  display: flex;
  gap: 15px;
}
.dfc-eco-label {
  position: absolute;
  top: 15px;
  right: 15px;
  width: 55px;
  height: auto;
}
/* === Ajuste visual de las características bajo el precio === */
.dfc-car-quickdata {
  display: flex;
  justify-content: space-between;
  align-items: center;
  background-color: #f8f8f8;
  padding: 12px 20px;
  border-radius: 10px;
  font-family: 'Montserrat', sans-serif;
  font-size: 15px;
  color: #666;
  margin-top: 15px;
  gap: 15px;
}

.dfc-car-quickdata span {
  flex: 1;
  text-align: center;
  font-weight: 500;
  color: #555;
}

.dfc-car-quickdata span:first-child {
  text-align: left;
}

.dfc-car-quickdata span:last-child {
  text-align: right;
}

/* Ajustes para pantallas pequeñas */
@media (max-width: 600px) {
  .dfc-car-quickdata {
    font-size: 14px;
    flex-wrap: wrap;
    justify-content: center;
    gap: 10px;
  }

  .dfc-car-quickdata span {
    flex: 0 1 45%;
    text-align: center;
  }
}
/* === ACORDEÓN DE EQUIPAMIENTO (REVISADO Y RESPONSIVE) === */
.dfc-equipamiento {
  background: #fff;
  border-radius: 15px;
  padding: 30px;
  box-shadow: 0 2px 10px rgba(0, 0, 0, 0.05);
  margin-top: 40px;
}

.dfc-equipamiento h2 {
  font-size: 22px;
  font-weight: 700;
  margin-bottom: 15px;
  color: #222;
}

.accordion-item {
  border-bottom: 1px solid #eee;
}

/* Botón del acordeón */
.accordion-header {
  background: transparent;
  border: 2px solid transparent;
  width: 100%;
  text-align: left;
  padding: 15px 12px;
  font-size: 17px;
  font-weight: 600;
  color: #222;
  cursor: pointer;
  display: flex;
  justify-content: space-between;
  align-items: center;
  transition: border-color 0.3s ease, color 0.3s ease;
  border-radius: 8px;
}

/* Icono desplegable */
.accordion-header::after {
  content: "▼";
  font-size: 14px;
  color: #777;
  transition: transform 0.3s;
}

/* Estado activo: solo borde azul */
.accordion-header.active {
  border-color: #5170ff;
  background: transparent; /* Elimina el color azul de fondo */
  color: #222; /* Mantiene el texto visible */
}

.accordion-header.active::after {
  transform: rotate(180deg);
}

/* Contenido del acordeón */
.accordion-content {
  max-height: 0;
  overflow: hidden;
  transition: max-height 0.4s ease;
  padding-left: 10px;
}

.accordion-content ul {
  list-style: none;
  padding: 0;
  margin: 0 0 15px;
}

.accordion-content li {
  color: #555;
  font-size: 15px;
  padding: 6px 0;
  border-bottom: 1px dashed #eee;
}

/* === MODO RESPONSIVE === */
@media (max-width: 768px) {
  .dfc-equipamiento {
    padding: 20px;
  }

  .accordion-header {
    font-size: 16px;
    padding: 12px;
  }

  .accordion-content {
    padding-left: 5px;
  }
}
/* === BLOQUE CONTACTO + RESEÑAS === */
.dfc-side-widgets {
  display: flex;
  flex-direction: column;
  gap: 25px;
  margin-top: 30px;
}

/* Bloque de contacto */
.dfc-contact-box {
  background: #fff;
  border-radius: 15px;
  box-shadow: 0 2px 10px rgba(0,0,0,0.05);
  padding: 30px;
  text-align: center;
}

.dfc-contact-box h2 {
  font-size: 22px;
  font-weight: 700;
  color: #222;
  margin-bottom: 10px;
}

.dfc-contact-box p {
  color: #444;
  font-size: 16px;
  margin: 5px 0;
}

.dfc-phone-number {
  display: block;
  font-size: 38px;
  font-weight: 700;
  color: #5170ff;
  text-decoration: none;
  margin: 10px 0;
}

.dfc-hours {
  font-size: 15px;
  color: #777;
}

.dfc-call-btn a {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  color: #5170ff;
  border: 2px solid #5170ff;
  border-radius: 8px;
  padding: 10px 20px;
  font-weight: 600;
  font-size: 16px;
  transition: all 0.3s ease;
  text-decoration: none;
}

.dfc-call-btn a:hover {
  background: #5170ff;
  color: #fff;
}

.dfc-call-btn i {
  font-size: 16px;
}

/* Bloque de valoraciones */
.dfc-reviews-box {
  background: #fff;
  border-radius: 15px;
  box-shadow: 0 2px 10px rgba(0,0,0,0.05);
  padding: 30px;
  text-align: center;
}

.dfc-reviews-box h2 {
  font-size: 20px;
  font-weight: 700;
  color: #222;
  margin-bottom: 15px;
}

/* Responsive */
@media (max-width: 768px) {
  .dfc-side-widgets {
    margin-top: 20px;
  }

  .dfc-phone-number {
    font-size: 30px;
  }
}
/* ========= OPCIÓN A (preferida): con contenedor .dfc-bottom-section ========= */
@media (min-width: 992px) {
  .dfc-bottom-section {
    display: grid;
    grid-template-columns: 1.35fr 1fr; /* izquierda / derecha */
    gap: 40px;
    align-items: start;
  }
}

/* ========= OPCIÓN B (fallback): SIN contenedor, usando floats ========= */
/* Se usa cuando .dfc-equipamiento y .dfc-side-widgets son hermanos (uno debajo del otro) */
@media (min-width: 992px) {
  .dfc-equipamiento {
    float: left;
    width: 64%;
    margin-right: 32px;
  }
  .dfc-side-widgets {
    float: right;
    width: calc(36% - 32px);
  }
  /* Evita que lo que venga después se meta entre los floats */
  .dfc-single-desc,
  .dfc-reviews-box + * {
    clear: both;
  }
}

/* Estética básica de la columna derecha (opcional, no cambia estructura) */
.dfc-side-widgets {
  display: flex;
  flex-direction: column;
  gap: 24px;
}
.dfc-contact-box,
.dfc-reviews-box {
  background: #fff;
  border-radius: 12px;
  box-shadow: 0 2px 10px rgba(0,0,0,0.06);
  padding: 24px;
}

/* En móvil todo en una columna */
@media (max-width: 991.98px) {
  .dfc-equipamiento,
  .dfc-side-widgets {
    float: none;
    width: auto;
    margin: 0 0 24px 0;
  }
}
<div class="dfc-bottom-section">
  <div class="dfc-equipamiento">
    <!-- Acordeón de equipamiento aquí -->
  </div>

  <div class="dfc-right-column">
    <div class="dfc-contact-box">
      <h3>¿Quieres comprar un coche?</h3>
      <p>Si tienes cualquier duda, <strong>llámanos</strong></p>
      <div class="dfc-contact-number">633 029 270</div>
      <div class="dfc-contact-hours">L-V: de 9:00 a 20:00h</div>
      <a href="https://drivefinity.es/contacto" class="dfc-contact-btn">
        <i class="fas fa-phone"></i> Te llamamos gratis
      </a>
    </div>

    <div class="dfc-reviews-box">
      <h3>Opiniones de nuestros clientes</h3>
      <?php echo do_shortcode('[site_reviews_slider slides="3" autoplay="true" interval="5000"]'); ?>
    </div>
  </div>
</div>
/* === AJUSTE GENERAL DE BLOQUES DE CONTACTO Y RESEÑAS === */
.dfc-contact-box,
.dfc-reviews-box {
  margin: 30px auto;
  width: 90%;
  max-width: 800px;
  text-align: center;
}

/* Ajustar el contenido interno para mantener proporción */
.dfc-contact-box h3,
.dfc-contact-box p,
.dfc-contact-number,
.dfc-contact-hours,
.dfc-reviews-box h3 {
  margin: 0 auto 10px;
  max-width: 90%;
}

/* === BOTÓN CTA AZUL === */
.dfc-contact-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  background: #5170ff;
  color: #fff;
  padding: 12px 25px;
  border-radius: 8px;
  font-weight: 600;
  font-size: 16px;
  text-decoration: none;
  border: 2px solid #5170ff;
  transition: all 0.3s ease;
  margin-top: 15px;
}

.dfc-contact-btn:hover {
  background: #fff;
  color: #5170ff;
}

/* === RESPONSIVE === */
@media (max-width: 768px) {
  .dfc-contact-box,
  .dfc-reviews-box {
    width: 95%;
    padding: 25px 15px;
  }
}
/* === CENTRAR Y ESTIRAR BLOQUES INFERIORES (CONTACTO Y RESEÑAS) === */
.dfc-bottom-section {
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  justify-content: center !important;
  width: 100% !important;
  max-width: 1200px !important;
  margin: 0 auto 60px !important;
  padding: 0 20px !important;
  box-sizing: border-box !important;
}

.dfc-contact-box,
.dfc-reviews-box {
  width: 100% !important;
  max-width: 1000px !important;
  text-align: center !important;
  background: #fff !important;
  border-radius: 15px !important;
  padding: 30px 40px !important;
  margin: 15px 0 !important;
  box-shadow: 0 4px 12px rgba(0,0,0,0.05) !important;
  box-sizing: border-box !important;
}

/* Texto */
.dfc-contact-box h3 {
  font-size: 22px !important;
  font-weight: 700 !important;
  color: #222 !important;
  margin-bottom: 10px !important;
}

.dfc-contact-number {
  font-size: 42px !important;
  font-weight: 800 !important;
  color: #5170ff !important;
  margin: 15px 0 !important;
}

.dfc-contact-hours {
  font-size: 15px !important;
  color: #777 !important;
  margin-bottom: 20px !important;
}

/* Botón CTA */
.dfc-contact-btn,
.dfc-contact-box a.dfc-contact-btn,
.dfc-contact-box a.button {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  background: #5170ff !important;
  color: #fff !important;
  border: 2px solid #5170ff !important;
  border-radius: 8px !important;
  font-size: 16px !important;
  font-weight: 700 !important;
  padding: 12px 28px !important;
  text-decoration: none !important;
  transition: all 0.3s ease !important;
}

.dfc-contact-btn:hover,
.dfc-contact-box a.dfc-contact-btn:hover,
.dfc-contact-box a.button:hover {
  background: #fff !important;
  color: #5170ff !important;
}

/* Slider centrado */
.dfc-reviews-box .glsr-slider,
.dfc-reviews-box .site-reviews,
.dfc-reviews-box .site-reviews-slider {
  margin: 0 auto !important;
  width: 100% !important;
  max-width: 950px !important;
}

/* Responsive */
@media (max-width: 768px) {
  .dfc-contact-box, .dfc-reviews-box {
    padding: 25px 15px !important;
    max-width: 95% !important;
  }
  .dfc-contact-number {
    font-size: 32px !important;
  }
}
/* === Centrar bloque de contacto y valoraciones === */
.dfc-side-widgets {
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  justify-content: center !important;
  text-align: center !important;
  width: 100% !important;
  max-width: 900px !important; /* puedes ajustar este valor si quieres más ancho */
  margin: 0 auto !important;
}

/* Ajustes de cada bloque interno */
.dfc-contact-box,
.dfc-reviews-box {
  width: 100% !important;
  max-width: 500px !important;
  margin: 20px 0 !important;
  background: #fff !important;
  border-radius: 15px !important;
  box-shadow: 0 2px 10px rgba(0,0,0,0.05) !important;
  padding: 30px !important;
}

/* Botón CTA azul */
.dfc-call-btn a {
  display: inline-block !important;
  background: #5170ff !important;
  color: #fff !important;
  text-decoration: none !important;
  border: 2px solid #5170ff !important;
  border-radius: 8px !important;
  padding: 10px 20px !important;
  font-weight: 600 !important;
  transition: all 0.3s ease !important;
}

.dfc-call-btn a:hover {
  background: #3f5be6 !important;
}

/* Teléfono grande */
.dfc-phone-number {
  display: block !important;
  font-size: 36px !important;
  font-weight: 700 !important;
  color: #222 !important;
  margin: 10px 0 !important;
}

/* Texto y horario */
.dfc-contact-box p {
  margin: 5px 0 !important;
  font-size: 16px !important;
  color: #555 !important;
}
.dfc-reviews-box {
  background: #fff;
  border-radius: 15px;
  padding: 30px;
  box-shadow: 0 2px 10px rgba(0,0,0,0.05);
  margin-top: 40px;
  text-align: center;
  width: 100%;
  max-width: 100%;
  box-sizing: border-box;
}

.dfc-reviews-box h2 {
  font-size: 22px;
  font-weight: 700;
  color: #222;
  margin-bottom: 20px;
}

.dfc-reviews-box p {
  font-size: 16px;
  color: #555;
}
.dfc-car-quickdata {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 30px; /* Espaciado entre elementos */
  background: #f9f9f9;
  border-radius: 12px;
  padding: 12px 20px;
  font-size: 16px;
  font-weight: 500;
  color: #333;
  white-space: nowrap; /* ✅ Evita que se parta “113.000 km” */
}

.dfc-car-quickdata span {
  display: inline-block;
  text-align: center;
}

@media (max-width: 768px) {
  .dfc-car-quickdata {
    flex-wrap: wrap;
    gap: 15px;
    font-size: 15px;
  }
}
/* === BOTÓN COMPARTIR === */
.dfc-share-btn {
  background: none;
  border: 2px solid #5170ff;
  color: #5170ff;
  font-family: 'Montserrat', sans-serif;
  font-weight: 600;
  font-size: 16px;
  border-radius: 50px;
  padding: 12px 24px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  cursor: pointer;
  transition: all 0.3s ease;
  text-transform: uppercase;
  margin: 0 auto;
}

/* Icono */
.dfc-share-btn i {
  font-size: 20px;
  transition: transform 0.3s ease;
}

/* Hover */
.dfc-share-btn:hover {
  background: #5170ff;
  color: #fff;
  transform: scale(1.05);
}

.dfc-share-btn:hover i {
  transform: rotate(20deg);
}

/* Efecto de clic */
.dfc-share-btn:active {
  transform: scale(0.97);
}

/* Centrado */
.dfc-car-icons {
  text-align: center;
  padding: 20px 0;
}

/* Responsivo */
@media (max-width: 768px) {
  .dfc-share-btn {
    width: 100%;
    font-size: 15px;
    padding: 10px 20px;
  }
}
/* --- Botones dentro de las tarjetas del inventario --- */
.dfc-car-actions {
  display: flex;
  justify-content: space-between;
  align-items: stretch;
  gap: 10px;
  margin-top: 12px;
  padding: 0 12px 12px; /* margen interior igualado */
  box-sizing: border-box;
}

/* Asegura que la tarjeta no corte bordes de los botones */
.dfc-car-card {
  overflow: visible !important;
}

/* Estilos comunes para los botones */
.dfc-car-actions .dfc-btn {
  flex: 1 1 0;
  min-width: 0;
  height: 48px;
  border-radius: 10px;
  display: flex;
  align-items: center;
  justify-content: center;
  text-align: center;
  font-weight: 600;
  text-decoration: none;
  box-sizing: border-box;
}

/* Botón principal: Ver detalles */
.dfc-btn-primary {
  background-color: #5170ff;
  color: #fff;
  border: 2px solid #5170ff;
}

/* Botón secundario: Contactar */
.dfc-btn-secondary {
  background-color: #fff;
  color: #5170ff;
  border: 2px solid #5170ff;
}

/* Hover effects opcionales */
.dfc-btn-primary:hover {
  background-color: #3658f6;
}

.dfc-btn-secondary:hover {
  background-color: #f5f7ff;
}
/* Mantener texto blanco al hacer hover en el botón primario */
.dfc-btn-primary:hover {
  background-color: #3658f6; /* tono un poco más oscuro opcional */
  color: #fff !important;    /* fuerza el color blanco siempre */
}
/* === ELIMINAR TARJETA DEL BLOQUE SUPERIOR (precio + datos rápidos) === */
.dfc-single-info {
  background: transparent !important;
  box-shadow: none !important;
  border: none !important;
  padding: 0 !important;
  margin: 0 !important;
}

/* Asegura que no haya pseudo-elementos decorativos */
.dfc-single-info::before,
.dfc-single-info::after {
  content: none !important;
  display: none !important;
}

/* === DATOS RÁPIDOS EN UNA SOLA FILA === */
.dfc-car-quickdata {
  display: flex;
  justify-content: flex-start;
  align-items: center;
  gap: 20px;
  margin-top: 10px;
  font-size: 16px;
  color: #333;
}

/* Separadores tipo “·” entre valores */
.dfc-car-quickdata span + span::before {
  content: "·";
  margin-right: 10px;
  opacity: 0.6;
}
/* === QUITAR TARJETA Y DEJAR LA FILA PLANA === */
.dfc-car-quickdata {
  background: transparent !important;
  border: none !important;
  box-shadow: none !important;
  padding: 0 !important;
  margin: 10px 0 0 !important;
  display: flex !important;
  justify-content: flex-start;
  align-items: center;
  gap: 18px;
  font-size: 16px;
  color: #333;
}

/* Ocultar cualquier pseudo-elemento que cree sombra o fondo */
.dfc-car-quickdata::before,
.dfc-car-quickdata::after {
  content: none !important;
  display: none !important;
}

/* Quitar separadores de línea o formato de bloque */
.dfc-car-quickdata span {
  display: inline-block !important;
  background: transparent !important;
  border: none !important;
  padding: 0 !important;
  margin: 0 !important;
}

/* Separadores tipo “·” entre valores */
.dfc-car-quickdata span + span::before {
  content: "·";
  margin-right: 10px;
  opacity: 0.6;
  color: #333;
}
/* === BLOQUE DE BENEFICIOS DRIVEFINITY CON SELLO === */
.dfc-benefits-box {
  background: #f8f9ff;
  border-radius: 14px;
  padding: 20px;
  margin-top: 18px;
  display: flex;
  align-items: center;
  gap: 20px;
  box-shadow: 0 2px 6px rgba(0,0,0,0.05);
  font-family: 'Montserrat', sans-serif;
}

/* Imagen del sello */
.dfc-benefits-left img {
  width: 85px;
  height: auto;
  flex-shrink: 0;
}

/* Lista de beneficios */
.dfc-benefits-right {
  display: flex;
  flex-direction: column;
  gap: 8px;
}

.dfc-benefit {
  display: flex;
  align-items: center;
  gap: 8px;
  color: #333;
  font-size: 15px;
  line-height: 1.4;
}

.dfc-benefit i {
  color: #5170ff;
  font-size: 16px;
}

/* Responsive: apilar imagen arriba en móviles */
@media (max-width: 600px) {
  .dfc-benefits-box {
    flex-direction: column;
    text-align: left;
    align-items: flex-start;
  }

  .dfc-benefits-left img {
    width: 70px;
    margin-bottom: 10px;
  }
}
/* === BLOQUE DE BENEFICIOS DRIVEFINITY CON SELLO CERTIFICADO === */
.dfc-benefits-box {
  background: #f8f9ff;
  border-radius: 14px;
  padding: 20px;
  margin-top: 18px;
  display: flex;
  align-items: center;
  gap: 20px;
  box-shadow: 0 2px 6px rgba(0,0,0,0.05);
  font-family: 'Montserrat', sans-serif;
}

/* Imagen del sello */
.dfc-benefits-left img {
  width: 90px;
  height: auto;
  background: #fff;
  border-radius: 50%;
  padding: 6px;
  box-shadow: 0 2px 5px rgba(0,0,0,0.1);
}

/* Lista de beneficios */
.dfc-benefits-right {
  display: flex;
  flex-direction: column;
  gap: 8px;
}

.dfc-benefit {
  display: flex;
  align-items: center;
  gap: 8px;
  color: #333;
  font-size: 15px;
  line-height: 1.4;
}

.dfc-benefit i {
  color: #5170ff;
  font-size: 16px;
}

/* Responsive */
@media (max-width: 600px) {
  .dfc-benefits-box {
    flex-direction: column;
    align-items: flex-start;
    text-align: left;
  }

  .dfc-benefits-left img {
    width: 75px;
    margin-bottom: 10px;
  }
}
/* === Ajuste: eliminar fondo redondo del sello certificado === */
.dfc-benefits-left img {
  background: none !important;
  border-radius: 0 !important;
  padding: 0 !important;
  box-shadow: none !important;
}
/* === Ajuste: cambiar los tics de los beneficios a negro === */
.dfc-benefit i {
  color: #000 !important;
}
/* === BLOQUE DE BENEFICIOS DRIVEFINITY (mobile first, sello siempre a la izquierda) === */
.dfc-benefits-box {
  display: flex;
  flex-direction: row; /* sello y textos en una sola fila */
  align-items: flex-start;
  background: #f8f9ff;
  border-radius: 14px;
  padding: 18px 20px;
  margin-top: 18px;
  gap: 12px;
  font-family: 'Montserrat', sans-serif;
  box-shadow: 0 2px 6px rgba(0,0,0,0.05);
}

/* Columna izquierda: sello certificado */
.dfc-benefits-left {
  flex-shrink: 0;
  display: flex;
  align-items: center;
  justify-content: center;
}

.dfc-benefits-left img {
  width: 65px;
  height: auto;
  background: none;
  border-radius: 0;
  padding: 0;
  box-shadow: none;
}

/* Columna derecha: beneficios */
.dfc-benefits-right {
  display: flex;
  flex-direction: column;
  justify-content: center;
  gap: 8px;
}

.dfc-benefit {
  display: flex;
  align-items: center;
  gap: 8px;
  color: #333;
  font-size: 15px;
  line-height: 1.4;
}

.dfc-benefit i {
  color: #000;
  font-size: 16px;
}

/* === Ajustes para pantallas grandes === */
@media (min-width: 768px) {
  .dfc-benefits-box {
    align-items: center;
    gap: 20px;
    padding: 20px 24px;
  }

  .dfc-benefits-left img {
    width: 80px;
  }

  .dfc-benefits-right {
    gap: 10px;
  }
}
/* === BLOQUE DE FINANCIACIÓN DRIVEFINITY (mobile first) === */
.dfc-finance-box {
  display: flex;
  flex-direction: row;
  align-items: flex-start;
  background: #f0f2ff;
  border-radius: 14px;
  padding: 18px 20px;
  margin-top: 22px;
  gap: 15px;
  font-family: 'Montserrat', sans-serif;
  box-shadow: 0 2px 6px rgba(0,0,0,0.05);
}

/* Icono */
.dfc-finance-left {
  flex-shrink: 0;
  display: flex;
  align-items: center;
  justify-content: center;
}

.dfc-finance-left i {
  font-size: 28px;
  color: #5170ff;
}

/* Contenido */
.dfc-finance-right h3 {
  font-size: 17px;
  color: #000;
  margin: 0 0 4px;
  font-weight: 600;
}

.dfc-finance-right p {
  margin: 2px 0;
  color: #333;
  font-size: 15px;
  line-height: 1.4;
}

.dfc-finance-cta {
  color: #5170ff;
  font-weight: 500;
}

.dfc-finance-right .dfc-btn.small {
  margin-top: 10px;
  padding: 8px 14px;
  font-size: 14px;
}

/* Desktop */
@media (min-width: 768px) {
  .dfc-finance-box {
    align-items: center;
    gap: 25px;
    padding: 22px 26px;
  }

  .dfc-finance-left i {
    font-size: 32px;
  }

  .dfc-finance-right h3 {
    font-size: 18px;
  }
}
/* === SIMULADOR DE FINANCIACIÓN (mobile first) === */
.dfc-finance-calc-box {
  background: #f8f9ff;
  border-radius: 14px;
  padding: 20px;
  margin-top: 20px;
  font-family: 'Montserrat', sans-serif;
  box-shadow: 0 2px 6px rgba(0,0,0,0.05);
}

.dfc-finance-calc-box h3 {
  color: #000;
  font-size: 17px;
  margin-bottom: 6px;
  font-weight: 600;
}

.dfc-finance-calc-box p {
  color: #333;
  font-size: 15px;
  margin-bottom: 10px;
}

.dfc-finance-calc-controls {
  display: flex;
  align-items: center;
  gap: 10px;
  margin-bottom: 12px;
}

.dfc-finance-calc-controls input {
  width: 100%;
  max-width: 120px;
  padding: 8px 10px;
  border: 1px solid #d1d5ff;
  border-radius: 8px;
  font-size: 15px;
  text-align: center;
}

.dfc-finance-result {
  display: flex;
  flex-direction: column;
  gap: 4px;
  font-size: 15px;
}

#dfc-cuota {
  color: #5170ff;
  font-size: 20px;
  font-weight: 600;
}

/* Desktop */
@media (min-width: 768px) {
  .dfc-finance-calc-box {
    padding: 24px 28px;
  }
  .dfc-finance-calc-box h3 {
    font-size: 18px;
  }
}
/* === UNIÓN VISUAL ENTRE BLOQUES DE FINANCIACIÓN === */

/* Ajuste del margen superior e inferior */
.dfc-finance-box {
  margin-bottom: 6px; /* se acercan sin pegarse demasiado */
}

/* Bloques con mismo fondo y sin separación visual */
.dfc-finance-box,
.dfc-finance-calc-box {
  background: #f0f2ff;
  box-shadow: 0 2px 6px rgba(0,0,0,0.05);
}

/* Bordes coordinados: suaves y limpios */
.dfc-finance-box {
  border-radius: 14px 14px 0 0; /* arriba redondeado */
}

.dfc-finance-calc-box {
  border-radius: 0 0 14px 14px; /* abajo redondeado */
  border-top: 1px solid rgba(0, 0, 0, 0.05); /* sutil línea divisoria */
  margin-top: 0; /* elimina el salto entre ambos */
}

/* Alineación general */
@media (min-width: 768px) {
  .dfc-finance-box,
  .dfc-finance-calc-box {
    max-width: 500px;
  }
}
/* === OTROS COCHES PARECIDOS === */
.dfc-similar-cars {
  margin-top: 2.5rem;
  background: #fff;
  border-radius: 20px;
  padding: 1.5rem;
  box-shadow: 0 3px 10px rgba(0, 0, 0, 0.05);
}

.dfc-similar-cars h2 {
  text-align: center;
  font-size: 1.4rem;
  font-weight: 700;
  margin-bottom: 1.8rem;
  color: #222;
}

.dfc-similar-grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: 1.5rem;
}

.dfc-similar-card {
  background: #fff;
  border-radius: 16px;
  overflow: hidden;
  transition: all 0.3s ease;
  box-shadow: 0 2px 6px rgba(0, 0, 0, 0.05);
}

.dfc-similar-card:hover {
  transform: translateY(-4px);
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
}

.dfc-similar-link {
  text-decoration: none;
  color: inherit;
  display: block;
}

.dfc-similar-img {
  position: relative;
}

.dfc-similar-img img {
  width: 100%;
  height: auto;
  display: block;
}

.dfc-similar-tag {
  position: absolute;
  top: 10px;
  right: 10px;
  background: #e8ebff;
  color: #5170ff;
  font-size: 0.8rem;
  font-weight: 600;
  padding: 5px 8px;
  border-radius: 8px;
}

.dfc-similar-info {
  padding: 0.8rem 1rem;
}

.dfc-similar-info h3 {
  font-size: 1rem;
  font-weight: 700;
  color: #000;
  margin-bottom: 0.3rem;
}

.dfc-similar-subtitle {
  font-size: 0.9rem;
  color: #555;
  margin-bottom: 0.4rem;
}

.dfc-similar-details {
  font-size: 0.85rem;
  color: #666;
  margin-bottom: 0.5rem;
}

.dfc-similar-price {
  font-size: 1rem;
  font-weight: 700;
  color: #5170ff;
}

/* === Responsive === */
@media (min-width: 768px) {
  .dfc-similar-grid {
    grid-template-columns: repeat(3, 1fr);
  }
}
/* === Tooltip informativo para calculadora === */
.dfc-tooltip {
  position: relative;
  display: inline-block;
  color: #5170ff;
  cursor: pointer;
  margin-left: 6px;
  font-size: 14px;
}

.dfc-tooltip .dfc-tooltiptext {
  visibility: hidden;
  width: 250px;
  background-color: #222;
  color: #fff;
  text-align: left;
  border-radius: 6px;
  padding: 8px 10px;
  position: absolute;
  z-index: 10;
  bottom: 125%;
  left: 50%;
  transform: translateX(-50%);
  opacity: 0;
  transition: opacity 0.3s ease;
  font-size: 12px;
  line-height: 1.4;
}

.dfc-tooltip:hover .dfc-tooltiptext {
  visibility: visible;
  opacity: 1;
}
/* === EQUIPAMIENTO (VERSIÓN BORDE AZUL ELEGANTE) === */
.dfc-equipamiento {
  background: #fff;
  border-radius: 16px;
  padding: 28px;
  margin-top: 40px;
  box-shadow: 0 3px 15px rgba(0, 0, 0, 0.05);
}

.dfc-equipamiento h2 {
  font-size: 1.5rem;
  font-weight: 700;
  color: #111;
  margin-bottom: 18px;
}

/* --- Botones de acordeón --- */
.accordion-item {
  margin-bottom: 12px;
  border: 1px solid #e1e4ff;
  border-radius: 12px;
  overflow: hidden;
  background: #fff;
  transition: all 0.25s ease;
}

.accordion-item:hover {
  box-shadow: 0 3px 8px rgba(0, 0, 0, 0.04);
  transform: translateY(-1px);
}

.accordion-header {
  width: 100%;
  background: #fff;
  border: none;
  outline: none;
  text-align: left;
  padding: 14px 18px;
  font-weight: 700;
  font-size: 1rem;
  text-transform: uppercase;
  color: #222;
  letter-spacing: 0.5px;
  display: flex;
  justify-content: space-between;
  align-items: center;
  cursor: pointer;
  border-radius: 12px;
  transition: all 0.25s ease;
  border: 2px solid transparent;
}

/* --- Estado activo: borde azul sin fondo --- */
.accordion-header.active {
  border: 2px solid #5170ff;
  color: #5170ff;
  background: #fff;
  box-shadow: 0 0 0 3px rgba(81, 112, 255, 0.15);
}

.accordion-header::after {
  content: "▼";
  font-size: 0.9rem;
  color: #999;
  transition: transform 0.3s ease, color 0.3s ease;
}

.accordion-header.active::after {
  transform: rotate(-180deg);
  color: #5170ff;
}

/* --- Contenido desplegado --- */
.accordion-content {
  max-height: 0;
  overflow: hidden;
  transition: max-height 0.35s ease;
  background: #fff;
  border-top: 1px solid #e5e7ff;
}

.accordion-content ul {
  margin: 0;
  padding: 14px 20px 18px;
  list-style: none;
}

.accordion-content li {
  padding: 6px 0;
  border-bottom: 1px solid #f0f2ff;
  color: #333;
  font-size: 0.95rem;
  display: flex;
  align-items: center;
  gap: 8px;
}

.accordion-content li::before {
  content: "✔";
  color: #5170ff;
  font-weight: 700;
  font-size: 0.9rem;
}

/* --- Responsive --- */
@media (max-width: 768px) {
  .dfc-equipamiento {
    padding: 20px;
    border-radius: 12px;
  }

  .accordion-header {
    font-size: 0.95rem;
  }

  .accordion-content li {
    font-size: 0.9rem;
  }
}