#opiniones-de-clientes {
    --opiniones-fondo: #FFFEFC;
    --opiniones-texto: #222121;
    --opiniones-suave: #F8F6F6;
    --opiniones-lavanda: #9299C8;
    --opiniones-lavanda-card: #C4C7E0;
    --opiniones-amarillo: #F1EBAB;
    --opiniones-coral: #FEB471;
    --opiniones-borde: rgba(34, 33, 33, 0.09);
    --opiniones-sombra: 0 18px 42px rgba(34, 33, 33, 0.08);

    width: min(1120px, 90%);
    color: var( --opiniones-texto );
    padding-top: 18px;
    padding-bottom: 80px;
}

#opiniones-de-clientes > .hero-opiniones {
    display: grid;
    gap: 22px;
    margin: 18px 0 34px;
    padding: 24px 0 0;
    border-top: 1px solid var( --opiniones-borde );
}
#opiniones-de-clientes > .hero-opiniones > .copy {
    display: flex;
    flex-direction: column;
    gap: 12px;
}
#opiniones-de-clientes > .hero-opiniones > .copy > span,
#opiniones-de-clientes > .muro-opiniones > header > span {
    width: fit-content;
    padding: 6px 10px;
    color: var( --opiniones-texto );
    background-color: var( --opiniones-amarillo );
    border-radius: 100px;
    font-size: .76em;
    font-weight: var( --bold );
    text-transform: uppercase;
}
#opiniones-de-clientes > .hero-opiniones > .copy > .titulo {
    max-width: 760px;
    margin: 0;
    color: var( --opiniones-texto );
    font-size: 2.45em;
    line-height: .98;
}
#opiniones-de-clientes > .hero-opiniones > .copy > p {
    max-width: 620px;
    color: rgba(34, 33, 33, 0.68);
    font-size: 1em;
    line-height: 1.55;
}

#opiniones-de-clientes > .hero-opiniones > .resumen {
    display: grid;
    gap: 18px;
    min-width: 0;
    padding: 20px;
    background-color: var( --opiniones-suave );
    border: 1px solid var( --opiniones-borde );
    border-left: 5px solid var( --opiniones-lavanda );
    border-radius: 8px;
    box-shadow: var( --opiniones-sombra );
}
#opiniones-de-clientes .resumen > .rating-principal {
    display: grid;
    gap: 12px;
}
#opiniones-de-clientes .resumen > .rating-principal > .total {
    display: flex;
    align-items: baseline;
    gap: 10px;
}
#opiniones-de-clientes .resumen > .rating-principal > .total > p {
    color: var( --opiniones-texto );
    font-size: 5.4em;
    font-weight: var( --bold );
    line-height: .82;
}
#opiniones-de-clientes .resumen > .rating-principal > .total > span {
    color: rgba(34, 33, 33, 0.62);
    font-size: 1em;
    font-weight: var( --bold );
}
#opiniones-de-clientes .resumen > .rating-principal > .datos {
    display: grid;
    gap: 8px;
}
#opiniones-de-clientes .resumen > .rating-principal > .datos > .estrellas {
    display: flex;
    gap: 5px;
}
#opiniones-de-clientes .resumen > .rating-principal > .datos > .estrellas > svg {
    width: 23px;
}
#opiniones-de-clientes .resumen svg path,
#opiniones-de-clientes > .muro-opiniones .estrella_valoracion > svg path {
    fill: var( --opiniones-lavanda );
}
#opiniones-de-clientes .resumen > .rating-principal > .datos > p {
    color: rgba(34, 33, 33, 0.7);
    font-size: .93em;
    line-height: 1.4;
}
#opiniones-de-clientes .resumen > .metricas {
    display: grid;
    grid-template-columns: 1fr;
    gap: 8px;
}
#opiniones-de-clientes .resumen > .metricas > div {
    display: flex;
    justify-content: space-between;
    gap: 14px;
    padding: 12px 0;
    border-top: 1px solid var( --opiniones-borde );
}
#opiniones-de-clientes .resumen > .metricas strong {
    color: var( --opiniones-texto );
    font-size: 1.15em;
    line-height: 1;
}
#opiniones-de-clientes .resumen > .metricas span {
    color: rgba(34, 33, 33, 0.62);
    font-size: .78em;
    text-align: right;
    text-transform: uppercase;
}

#opiniones-de-clientes > .bloque-confianza {
    display: grid;
    gap: 20px;
    margin: 0 0 48px;
}
#opiniones-de-clientes > .bloque-confianza > #clientes_reales,
#opiniones-de-clientes > .bloque-confianza > #sabemos_de_depilacion {
    margin: 0;
}
#opiniones-de-clientes > .bloque-confianza > #clientes_reales {
    background-color: var( --opiniones-suave );
    overflow: hidden;
}
#opiniones-de-clientes > .bloque-confianza > #sabemos_de_depilacion {
    border-radius: 8px;
    overflow: hidden;
}
#opiniones-de-clientes > .bloque-confianza > #clientes_reales #carrusel {
    max-width: 340px;
    margin: 0 auto;
}
#opiniones-de-clientes > .bloque-confianza > #clientes_reales #carrusel img {
    width: 82%;
    margin: 0 auto;
}

#opiniones-de-clientes > .muro-opiniones {
    display: grid;
    gap: 22px;
}
#opiniones-de-clientes > .muro-opiniones > header {
    display: grid;
    gap: 10px;
    padding-top: 24px;
    border-top: 1px solid var( --opiniones-borde );
}
#opiniones-de-clientes > .muro-opiniones > header > h3 {
    max-width: 720px;
    margin: 0;
    color: var( --opiniones-texto );
    font-family: var( --font-playfair ) !important;
    font-size: 2em;
    line-height: 1.05;
}
#opiniones-de-clientes > .muro-opiniones > header > p {
    max-width: 650px;
    color: rgba(34, 33, 33, 0.66);
    font-size: .96em;
    line-height: 1.55;
}

#opiniones-de-clientes > .muro-opiniones > .testimonios {
    display: grid;
    grid-template-columns: 1fr;
    gap: 14px;
}
#opiniones-de-clientes > .muro-opiniones > .testimonios > .testimonio {
    display: flex;
    flex-direction: column;
    gap: 18px;
    min-width: 0;
    padding: 18px;
    background-color: white;
    border: 1px solid var( --opiniones-borde );
    border-radius: 8px;
}
#opiniones-de-clientes > .muro-opiniones > .testimonios > .testimonio.destacado {
    background-color: var( --opiniones-fondo );
    border-color: rgba(146, 153, 200, 0.34);
    box-shadow: var( --opiniones-sombra );
}
#opiniones-de-clientes > .muro-opiniones > .testimonios > .testimonio > header {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    gap: 12px;
}
#opiniones-de-clientes > .muro-opiniones > .testimonios > .testimonio > header > .izq {
    display: flex;
    align-items: center;
    min-width: 0;
    gap: 11px;
}
#opiniones-de-clientes > .muro-opiniones > .testimonios > .testimonio > header > .izq > .avatar {
    flex: 0 0 auto;
}
#opiniones-de-clientes > .muro-opiniones > .testimonios > .testimonio > header > .izq > .avatar > svg {
    width: 38px;
    display: block;
}
#opiniones-de-clientes > .muro-opiniones > .testimonios > .testimonio > header > .izq > .datos {
    min-width: 0;
}
#opiniones-de-clientes > .muro-opiniones > .testimonios > .testimonio > header > .izq > .datos > p {
    color: var( --opiniones-texto );
    font-size: 1.02em;
    font-weight: var( --bold );
    line-height: 1.15;
    text-transform: capitalize;
}
#opiniones-de-clientes > .muro-opiniones > .testimonios > .testimonio > header > .izq > .datos > .verificada {
    display: flex;
    align-items: center;
    gap: 5px;
    margin-top: 5px;
}
#opiniones-de-clientes > .muro-opiniones > .testimonios > .testimonio > header > .izq > .datos > .verificada > svg {
    width: 13px;
    flex: 0 0 auto;
}
#opiniones-de-clientes > .muro-opiniones > .testimonios > .testimonio > header > .izq > .datos > .verificada > p {
    color: rgba(34, 33, 33, 0.56);
    font-size: .76em;
    line-height: 1.2;
}
#opiniones-de-clientes > .muro-opiniones > .testimonios > .testimonio > header > .der {
    flex: 0 0 auto;
}
#opiniones-de-clientes > .muro-opiniones > .testimonios > .testimonio > header > .der > .estrella_valoracion {
    display: flex;
    align-items: center;
    gap: 5px;
    padding: 5px 8px;
    background-color: var( --opiniones-suave );
    border: 1px solid rgba(146, 153, 200, 0.25);
    border-radius: 100px;
}
#opiniones-de-clientes > .muro-opiniones > .testimonios > .testimonio > header > .der > .estrella_valoracion > p {
    color: var( --opiniones-texto );
    font-size: .88em;
    font-weight: var( --bold );
    line-height: 1;
}
#opiniones-de-clientes > .muro-opiniones > .testimonios > .testimonio > header > .der > .estrella_valoracion > svg {
    width: 14px;
}
#opiniones-de-clientes > .muro-opiniones > .testimonios > .testimonio > .opinion {
    display: grid;
    grid-template-columns: auto 1fr;
    gap: 10px;
}
#opiniones-de-clientes > .muro-opiniones > .testimonios > .testimonio > .opinion > span {
    color: var( --opiniones-coral );
    font-family: var( --font-playfair ) !important;
    font-size: 3.1em;
    line-height: .9;
}
#opiniones-de-clientes > .muro-opiniones > .testimonios > .testimonio > .opinion > p {
    color: var( --opiniones-texto );
    font-size: .96em;
    line-height: 1.55;
}

@media ( width >= 800px ) {
    #opiniones-de-clientes {
        padding-bottom: 96px;
    }
    #opiniones-de-clientes > .hero-opiniones {
        grid-template-columns: minmax(0, 1.3fr) minmax(320px, .7fr);
        align-items: end;
        gap: 44px;
        margin-top: 28px;
        margin-bottom: 54px;
        padding-top: 34px;
    }
    #opiniones-de-clientes > .hero-opiniones > .copy > .titulo {
        font-size: 4.1em;
    }
    #opiniones-de-clientes > .hero-opiniones > .copy > p {
        font-size: 1.08em;
    }
    #opiniones-de-clientes > .bloque-confianza {
        grid-template-columns: minmax( 0, 1fr ) minmax( 0, 1fr );
        gap: 40px;
        align-items: stretch;
        margin-bottom: 62px;
    }
    #opiniones-de-clientes > .bloque-confianza > #clientes_reales #carrusel {
        max-width: 320px;
    }
    #opiniones-de-clientes > .bloque-confianza > #clientes_reales #carrusel img {
        width: 78%;
    }
    #opiniones-de-clientes > .muro-opiniones {
        gap: 30px;
    }
    #opiniones-de-clientes > .muro-opiniones > header {
        grid-template-columns: minmax(0, .9fr) minmax(0, 1.1fr);
        align-items: end;
        column-gap: 38px;
    }
    #opiniones-de-clientes > .muro-opiniones > header > span {
        grid-column: 1 / -1;
    }
    #opiniones-de-clientes > .muro-opiniones > header > h3 {
        font-size: 2.6em;
    }
    #opiniones-de-clientes > .muro-opiniones > .testimonios {
        grid-template-columns: repeat(6, minmax(0, 1fr));
        gap: 18px;
    }
    #opiniones-de-clientes > .muro-opiniones > .testimonios > .testimonio {
        grid-column: span 3;
        padding: 20px;
    }
    #opiniones-de-clientes > .muro-opiniones > .testimonios > .testimonio.destacado {
        grid-column: span 6;
        display: grid;
        grid-template-columns: minmax(220px, .42fr) minmax(0, 1fr);
        align-items: start;
        gap: 24px;
        padding: 24px;
    }
    #opiniones-de-clientes > .muro-opiniones > .testimonios > .testimonio.destacado > .opinion > p {
        font-size: 1.12em;
    }
}

@media ( width >= 1100px ) {
    #opiniones-de-clientes > .muro-opiniones > .testimonios > .testimonio {
        grid-column: span 2;
    }
    #opiniones-de-clientes > .muro-opiniones > .testimonios > .testimonio.destacado {
        grid-column: span 4;
    }
}
