.mw-testi{
  --mw-accent:#8B1D3D;
  position: relative;
  width: 100%;
  box-sizing: border-box;
  padding: 10px 64px;
}

/* Evitar que algún tema rompa Swiper en frontend */
.mw-testi .swiper-wrapper{ display:flex !important; }
.mw-testi .swiper-slide{ height:auto; }

.mw-testi__swiper{ overflow:hidden; }

/* Slide item */
.mw-testi__item{
  position: relative;
  display: grid;

  /* ✅ Más parecido a tu diseño: columna izq más compacta */
  grid-template-columns: 110px 1fr;

  /* ✅ Menos separación entre foto y texto */
  gap: 14px;

  align-items: start;
  box-sizing: border-box;

  padding: 18px 15px;
  min-height: 180px;
}

/* IZQUIERDA: icono arriba + foto abajo */
.mw-testi__left{
  display: flex;
  flex-direction: column;
  align-items: baseline;

  /* ✅ Icono más arriba */
  justify-content: flex-start;

  min-height: 180px;
  box-sizing: border-box;
  padding-top: 0;  /* sube icono */
  padding-bottom: 0;
}

.mw-testi__icon{
  color: var(--mw-accent);
  text-decoration: none;
  display: inline-flex;
  align-items: center;
  justify-content: center;

  font-size: 22px;
  line-height: 1;

  /* ✅ Ajuste fino: icono bien arriba */
  margin-top: 10px;
  margin-bottom: 22px; /* deja hueco y empuja foto hacia abajo */
}

.mw-testi__icon svg{
  width: 22px;
  height: 22px;
  fill: currentColor;
}

/* Foto redonda */
.mw-testi__photo{
  width: 92px;
  height: 92px;
  border-radius: 999px;
  overflow: hidden;
  background: var(--mw-accent);
  display: flex;
  align-items: center;
  justify-content: center;

  /* ✅ Empujar foto hacia abajo como en tu diseño */
  margin-top: auto;
  margin-bottom: 30px;
}

.mw-testi__photo img{
  width:100%;
  height:100%;
  object-fit: cover;
  display:block;
}

.mw-testi__photo-placeholder{
  color:#fff;
  font-weight:700;
  letter-spacing:.12em;
}

/* DERECHA: nombre + estrellas + texto */
.mw-testi__right{
  /* ✅ menos distancia con respecto a la foto (ya la reduce el gap) */

  /* ✅ MÁS espacio antes de la raya (esto es lo que te falta ahora) */
  padding-right: 0px;

  box-sizing: border-box;
}

/* Tipos */
.mw-testi__name{
  color: var(--mw-accent);
  font-weight: 600;
  font-size: 18px;
  line-height: 1.1;

  /* ✅ Ajuste a tu diseño: arriba del todo sin aire */
  margin: 7px 0 4px 0;
}

.mw-testi__stars{
  color: var(--mw-accent);
  font-size: 12px;
  line-height: 1;

  /* ✅ más pegado al nombre */
  margin: 0 0 22px 0;
}

.mw-testi__stars .is-off{ opacity:.25; }

.mw-testi__text{
  color: var(--mw-accent);
  font-size: 14px;
  line-height: 1.55;
  margin: 0;
  max-width: 560px;
}

/* Raya separadora */
.mw-testi__divider{
  position: absolute;
  top: 16px;
  right: 0;
  width: 1px;
  height: calc(100% - 32px);
  background: color-mix(in srgb, var(--mw-accent) 45%, transparent);
}

/* Quitar raya del último visible */
.mw-testi .mw-last-visible .mw-testi__divider{ display:none; }

/* Flechas */
.mw-testi__nav{
  position:absolute;
  top:50%;
  transform:translateY(-50%);
  width:46px;
  height:46px;
  border:0;
  padding:0;
  background:transparent;
  cursor:pointer;
  display:flex;
  align-items:center;
  justify-content:center;
}

.mw-testi__nav--prev{ left: 6px; }
.mw-testi__nav--next{ right: 6px; }

.mw-testi__arrow{
  width:28px;
  height:2px;
  background: var(--mw-accent);
  position:relative;
  display:block;
}

/* Punta izquierda */
.mw-testi__nav--prev .mw-testi__arrow::before,
.mw-testi__nav--prev .mw-testi__arrow::after{
  content:"";
  position:absolute;
  left:0;
  width:10px;
  height:2px;
  background: var(--mw-accent);
  transform-origin:left center;
}
.mw-testi__nav--prev .mw-testi__arrow::before{ transform: rotate(35deg); }
.mw-testi__nav--prev .mw-testi__arrow::after{ transform: rotate(-35deg); }

/* Punta derecha */
.mw-testi__nav--next .mw-testi__arrow::before,
.mw-testi__nav--next .mw-testi__arrow::after{
  content:"";
  position:absolute;
  right:0;
  width:10px;
  height:2px;
  background: var(--mw-accent);
  transform-origin:right center;
}
.mw-testi__nav--next .mw-testi__arrow::before{ transform: rotate(-35deg); }
.mw-testi__nav--next .mw-testi__arrow::after{ transform: rotate(35deg); }

/* Responsive */
@media (max-width: 1024px){
  .mw-testi{ padding: 10px 58px; }
}

@media (max-width: 767px){
  .mw-testi{ padding: 10px 54px; }

  .mw-testi__item{
    grid-template-columns: 105px 1fr;
    gap: 12px;
    padding: 16px 18px;
    min-height: 160px;
  }

  .mw-testi__left{ min-height: 160px; }

  .mw-testi__right{
    padding-right: 34px; /* un poco menos en móvil */
  }

  .mw-testi__text{ max-width: 100%; }
}


