
  .bg-light-gradient {
    background: linear-gradient(180deg, #ffffff 0%, #f8faff 100%);
  }

  #unified-reviews {
    font-family: system-ui, -apple-system, "Segoe UI", Roboto, Arial, sans-serif;
    overflow: hidden;
  }

  .reviews-slider {
    background: transparent;
    padding: 8px 4px;
  }

  .slides {
    gap: 24px;
    align-items: stretch;
    padding: 6px 2px 14px;
  }

  .slide {
    flex: 0 0 100%;
    box-sizing: border-box;
    padding: 4px;
    display: flex;
    align-items: stretch;
  }

  @media (min-width: 992px) {
    .slide {
      flex: 0 0 calc((100% - 24px) / 2);
    }

    .slider-control.prev { left: -24px; }
    .slider-control.next { right: -24px; }
  }

  .review-card {
    background: #fff;
    border-radius: 18px;
    border: 1px solid rgba(0,0,0,0.05);
    box-shadow: 0 12px 32px rgba(9,30,66,0.05);
    padding: 22px;
    width: 100%;
    min-height: 255px;
    display: flex;
    flex-direction: column;
    position: relative;
    overflow: hidden;
    transition: transform 0.25s ease, box-shadow 0.25s ease, border-color 0.25s ease;
  }

  .review-card:hover {
    transform: translateY(-4px);
    box-shadow: 0 18px 38px rgba(9,30,66,0.08);
    border-color: rgba(11,59,130,0.14);
  }

  .review-card::before {
    content: "";
    position: absolute;
    inset: 0 0 auto 0;
    height: 4px;
    background: linear-gradient(90deg, #0b3b82, #4facfe);
    opacity: 0.9;
  }

  .review-meta {
    display: flex;
    align-items: center;
    gap: 12px;
    margin-bottom: 14px;
  }

  .avatar-circle {
    width: 48px;
    height: 48px;
    border-radius: 50%;
    display: grid;
    place-items: center;
    color: #fff;
    font-weight: 800;
    font-size: 1.1rem;
    flex-shrink: 0;
    box-shadow: 0 4px 12px rgba(0,0,0,0.10);
  }

  .review-author-wrap {
    min-width: 0;
    display: flex;
    flex-direction: column;
  }

  .review-author {
    font-weight: 800;
    font-size: 1rem;
    color: #0b3b82;
    line-height: 1.2;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    max-width: 240px;
  }

  .review-rating {
    margin-left: auto;
    color: #ffc107;
    font-size: 1rem;
    letter-spacing: 2px;
    white-space: nowrap;
  }

  .review-text {
    font-size: 0.96rem;
    color: #495057;
    line-height: 1.65;
    margin: 0;
    display: -webkit-box;
    -webkit-line-clamp: 6;
    -webkit-box-orient: vertical;
    overflow: hidden;
    min-height: 9.9em;
  }

  .review-actions {
    margin-top: auto;
    padding-top: 14px;
  }

  .review-toggle {
    appearance: none;
    border: 1px solid rgba(11,59,130,0.18);
    background: rgba(11,59,130,0.05);
    color: #0b3b82;
    font-weight: 700;
    font-size: 0.9rem;
    padding: 9px 14px;
    border-radius: 999px;
    cursor: pointer;
    transition: all 0.2s ease;
  }

  .review-toggle:hover {
    background: rgba(11,59,130,0.09);
    border-color: rgba(11,59,130,0.24);
    transform: translateY(-1px);
  }

  .slider-control {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    border: none;
    background: #fff;
    width: 48px;
    height: 48px;
    border-radius: 50%;
    box-shadow: 0 4px 15px rgba(0,0,0,0.10);
    color: #0b3b82;
    cursor: pointer;
    display: grid;
    place-items: center;
    transition: all 0.2s ease;
    z-index: 10;
  }

  .slider-control:hover {
    background: #0b3b82;
    color: #fff;
    transform: translateY(-50%) scale(1.06);
  }

  .slider-control.prev { left: 8px; }
  .slider-control.next { right: 8px; }

  @media (max-width: 991.98px) {
    .slider-control {
      width: 40px;
      height: 40px;
    }

    .review-card {
      padding: 18px;
      min-height: 260px;
    }

    .review-author {
      max-width: 200px;
    }
  }

  .slider-dots button {
    border: none;
    background: #e9ecef;
    width: 8px;
    height: 8px;
    margin: 0 5px;
    border-radius: 999px;
    cursor: pointer;
    transition: all 0.25s ease;
    padding: 0;
  }

  .slider-dots button.active {
    background: #0b3b82;
    width: 24px;
    height: 8px;
  }

  .transition {
    transition: transform 0.55s cubic-bezier(0.25, 1, 0.5, 1);
  }

  .fade-in-up {
    animation: fadeInUp 0.8s ease-out forwards;
    opacity: 0;
    transform: translateY(20px);
  }

  @keyframes fadeInUp {
    to { opacity: 1; transform: translateY(0); }
  }

  /* Modal */
  .review-modal {
    position: fixed;
    inset: 0;
    z-index: 9999;
    display: none;
  }

  .review-modal.is-open {
    display: block;
  }

  .review-modal-backdrop {
    position: absolute;
    inset: 0;
    background: rgba(10, 18, 40, 0.55);
    backdrop-filter: blur(3px);
  }

  .review-modal-dialog {
    position: relative;
    width: min(92vw, 760px);
    max-height: 86vh;
    overflow: auto;
    margin: 6vh auto 0;
    background: #fff;
    border-radius: 20px;
    padding: 24px 24px 20px;
    box-shadow: 0 30px 80px rgba(0,0,0,0.25);
  }

  .review-modal-close {
    position: absolute;
    right: 14px;
    top: 10px;
    border: none;
    background: transparent;
    font-size: 2rem;
    line-height: 1;
    color: #6c757d;
    cursor: pointer;
  }

  .review-modal-header {
    display: flex;
    align-items: center;
    gap: 14px;
    margin-bottom: 18px;
    padding-right: 30px;
  }

  .review-modal-avatar {
    width: 52px;
    height: 52px;
    border-radius: 50%;
    display: grid;
    place-items: center;
    color: #fff;
    font-weight: 800;
    font-size: 1.1rem;
    flex-shrink: 0;
  }

  .review-modal-title {
    color: #0b3b82;
    font-weight: 800;
    font-size: 1.2rem;
    margin: 0;
  }

  .review-modal-stars {
    color: #ffc107;
    letter-spacing: 2px;
    font-size: 1rem;
  }

  .review-modal-body {
    color: #374151;
    line-height: 1.8;
    font-size: 1rem;
    white-space: pre-line;
  }

  @media (prefers-reduced-motion: reduce) {
    .transition { transition: none !important; }
    .fade-in-up { animation: none !important; opacity: 1 !important; transform: none !important; }
  }

/* PAGESPEED-MOBILE-SAFE-V1:START */


/* ==========================================================
   OBJETIVOS TÁCTILES

   El punto que ves sigue siendo pequeño.
   El botón real pasa a medir 24 x 24.
========================================================== */

#unified-reviews
.slider-dots {

    display:
        flex;

    align-items:
        center;

    justify-content:
        center;

}


#unified-reviews
.slider-dots
button,

#unified-reviews
.slider-dots
button.active {

    position:
        relative;

    width:
        24px;

    min-width:
        24px;

    height:
        24px;

    min-height:
        24px;

    margin:
        0 1px;

    padding:
        0;

    background:
        transparent;

}


#unified-reviews
.slider-dots
button::before {

    content:
        "";

    position:
        absolute;

    left:
        50%;

    top:
        50%;

    width:
        8px;

    height:
        8px;

    border-radius:
        999px;

    background:
        #e1e6ec;

    transform:
        translate(
            -50%,
            -50%
        );

    transition:

        width
        .25s
        ease,

        background-color
        .25s
        ease;

}


#unified-reviews
.slider-dots
button.active::before {

    width:
        24px;

    background:
        #0b3b82;

}


/* ==========================================================
   CONTRASTE

   Mantiene la misma idea visual azul claro.
========================================================== */

#unified-reviews
.badge.text-primary {

    color:
        #0a356f
        !important;

    background-color:
        #eef4fb
        !important;

}


/* ==========================================================
   TELÉFONOS MUY ESTRECHOS
========================================================== */

@media
(max-width: 359.98px) {

    #unified-reviews
    .reviews-pagination {

        row-gap:
            .25rem
            !important;

    }


    #unified-reviews
    .slider-count {

        flex:
            0 0 100%;

        width:
            100%;

        text-align:
            center;

    }

}


/* PAGESPEED-MOBILE-SAFE-V1:END */
