.pp-reviews{max-width:1200px;margin:40px auto;padding:0 16px;font-family:inherit;box-sizing:border-box}
.pp-reviews *{box-sizing:border-box}
.pp-testbar{background:#fff8e1;border:1px dashed #e0b400;color:#8a6d00;text-align:center;padding:6px 10px;border-radius:6px;font-size:13px;margin-bottom:16px}
.pp-reviews-head{text-align:center;margin-bottom:26px}
.pp-reviews-title{font-size:26px;margin:0 0 10px;color:#222}
.pp-overall{display:inline-flex;align-items:center;gap:8px;flex-wrap:wrap;justify-content:center}
.pp-overall-num{font-size:24px;font-weight:700;color:#222}
.pp-overall-stars{color:#fbbc05;font-size:20px;letter-spacing:2px}
.pp-overall-count{color:#777;font-size:14px}

.pp-reviews-viewport{overflow:hidden}
.pp-reviews-track{display:flex;transition:transform .5s ease}
.pp-card{flex:0 0 100%;padding:22px;background:#fff;border:1px solid #eee;border-radius:14px;box-shadow:0 4px 18px rgba(0,0,0,.05);margin:0 8px}
@media(min-width:700px){.pp-card{flex:0 0 calc(50% - 16px)}}
@media(min-width:1000px){.pp-card{flex:0 0 calc(33.333% - 16px)}}

.pp-card-top{display:flex;align-items:center;gap:12px;margin-bottom:10px}
.pp-avatar{width:48px;height:48px;border-radius:50%;flex-shrink:0;background-size:cover;background-position:center;background-repeat:no-repeat}
.pp-name{font-weight:600;color:#222}
.pp-date{font-size:12px;color:#999}
.pp-stars{color:#fbbc05;font-size:18px;letter-spacing:2px;margin-bottom:8px}
.pp-stars .empty{color:#dcdcdc}
.pp-text{color:#444;font-size:14px;line-height:1.6;margin:0}

.pp-reviews-nav{text-align:center;margin-top:18px}
.pp-nav{width:42px;height:42px;border-radius:50%;border:none;background:#fff;box-shadow:0 2px 10px rgba(0,0,0,.15);cursor:pointer;font-size:24px;line-height:1;color:#8e2f6b;margin:0 6px}
.pp-nav:hover{background:#8e2f6b;color:#fff}

.pp-card[data-gender="female"] .pp-avatar{
  background-color:#fbe4f0;
  background-image:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 64 64"><circle cx="32" cy="32" r="32" fill="%23fbe4f0"/><circle cx="32" cy="26" r="11" fill="%238e2f6b"/><path d="M12 56c0-11 9-18 20-18s20 7 20 18z" fill="%238e2f6b"/><path d="M21 22c0-8 5-13 11-13s11 5 11 13c0-3-3-4-5-5-2 3-9 4-14 2-1 1-3 1-3 3z" fill="%235c1e47"/></svg>');
}
.pp-card[data-gender="male"] .pp-avatar{
  background-color:#e4eefb;
  background-image:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 64 64"><circle cx="32" cy="32" r="32" fill="%23e4eefb"/><circle cx="32" cy="26" r="11" fill="%232f5c8e"/><path d="M12 56c0-11 9-18 20-18s20 7 20 18z" fill="%232f5c8e"/><path d="M21 21c1-7 6-11 11-11s10 4 11 11c0-1-1-3-2-4-4 2-15 2-18 1-1 1-2 2-2 3z" fill="%231e3d5c"/></svg>');
}