/* Страница отзывов: сводка, фильтр по услуге, карточки. */

.rvpage {padding-bottom: 80px;}

/* ── сводка ──────────────────────────────────────────────────────────── */

.rvsum {display: grid; grid-template-columns: 300px 1fr; gap: 30px; align-items: center; margin: 0 0 30px; padding: 30px 34px; border-radius: var(--kp-r-xl, 24px); background: linear-gradient(115deg, #37701f 0%, #2f7d3b 55%, #1f6f45 100%); color: #fff; overflow: hidden; position: relative;}
.rvsum::after {content: ""; position: absolute; right: -90px; top: -120px; width: 320px; height: 320px; border-radius: 50%; background: rgba(164, 208, 32, .15);}
.rvsum > * {position: relative;}
.rvsum__text h2 {margin: 0 0 12px; color: #fff; text-align: left;}
.rvsum__text p {max-width: 640px; margin: 0 0 10px; font-size: 16.5px; line-height: 1.6; color: rgba(255, 255, 255, .88);}
.rvsum__text p:last-child {margin-bottom: 0;}
.rvsum__text a {color: #cdea6c;}

.rvscore {padding: 20px 22px; border-radius: var(--kp-r-lg, 18px); background: rgba(255, 255, 255, .12); -webkit-backdrop-filter: blur(4px); backdrop-filter: blur(4px); text-align: center;}
.rvscore__num {font-size: 46px; line-height: 1; font-weight: 700; color: #cdea6c; font-variant-numeric: tabular-nums;}
.rvscore .rv-stars {justify-content: center; margin: 8px 0 4px;}
.rvscore__cnt {font-size: 13.5px; color: rgba(255, 255, 255, .8);}

.rvbars {margin-top: 14px; padding-top: 14px; border-top: 1px solid rgba(255, 255, 255, .18);}
.rvbar {display: flex; align-items: center; gap: 8px; margin-bottom: 5px; font-size: 12px; color: rgba(255, 255, 255, .82);}
.rvbar__n {width: 10px; text-align: right;}
.rvbar__track {flex: 1; height: 6px; border-radius: 6px; background: rgba(255, 255, 255, .18); overflow: hidden;}
.rvbar__fill {display: block; height: 100%; border-radius: 6px; background: #cdea6c;}
.rvbar__c {width: 22px; text-align: left; font-variant-numeric: tabular-nums;}

/* ── звёзды ──────────────────────────────────────────────────────────── */

.rv-stars {display: inline-flex; gap: 2px; flex: none;}
.rv-stars svg {width: 16px; height: 16px; fill: #d9dfd0;}
.rv-stars svg.is-on {fill: #f5b301;}
.rvscore .rv-stars svg {width: 19px; height: 19px; fill: rgba(255, 255, 255, .3);}
.rvscore .rv-stars svg.is-on {fill: #ffd34d;}

/* ── фильтр ──────────────────────────────────────────────────────────── */

.rvfilter {display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 22px;}
.rvchip {display: inline-flex; align-items: center; gap: 7px; padding: 9px 15px; border: 1.5px solid var(--kp-line, #e7ece0); border-radius: 999px; background: #fff; color: var(--kp-text, #3a4232); font-size: 14.5px; font-weight: 500; cursor: pointer; transition: border-color .16s, background .16s, color .16s;}
.rvchip span {padding: 1px 7px; border-radius: 20px; background: #f1f5e9; color: #7c8571; font-size: 12px; font-weight: 600;}
.rvchip:hover {border-color: var(--kp-lime, #a4d020);}
.rvchip.is-on {border-color: var(--kp-green, #4d9b42); background: var(--kp-green, #4d9b42); color: #fff;}
.rvchip.is-on span {background: rgba(255, 255, 255, .22); color: #fff;}

/* ── карточки ────────────────────────────────────────────────────────── */

.rvlist {display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px;}
.rvcard {padding: 22px 24px; border: 1px solid var(--kp-line, #e7ece0); border-radius: var(--kp-r-lg, 18px); background: #fff; transition: box-shadow .18s, transform .18s;}
.rvcard:hover {box-shadow: var(--kp-sh-md, 0 8px 26px rgba(28, 46, 12, .09)); transform: translateY(-2px);}
.rvcard.is-hidden {display: none;}

.rvcard__top {display: flex; align-items: center; gap: 12px; margin-bottom: 12px;}
.rvcard__ava {flex: none; width: 44px; height: 44px; display: flex; align-items: center; justify-content: center; border-radius: 14px; background: linear-gradient(135deg, #a6d120 0%, #4d9b42 100%); color: #fff; font-size: 19px; font-weight: 700;}
.rvcard__who {flex: 1; min-width: 0;}
.rvcard__name {font-size: 16.5px; font-weight: 700; color: var(--kp-ink, #1c2410); line-height: 1.2;}
.rvcard__meta {display: flex; flex-wrap: wrap; gap: 4px 10px; margin-top: 3px; font-size: 13px; color: var(--kp-muted, #7c8571);}
.rvcard__city {position: relative; padding-left: 15px;}
.rvcard__city::before {content: ""; position: absolute; left: 0; top: 3px; width: 9px; height: 9px; border-radius: 50% 50% 50% 0; transform: rotate(-45deg); background: var(--kp-lime, #a4d020);}

.rvcard__tag {display: inline-block; margin-bottom: 10px; padding: 4px 11px; border-radius: 8px; background: var(--kp-lime-soft, #eef6dc); color: #4f6d1c; font-size: 12.5px; font-weight: 600;}
.rvcard__text {margin: 0; font-size: 15.5px; line-height: 1.6; color: var(--kp-text, #3a4232);}

.rvempty {padding: 30px 0; font-size: 17px; color: var(--kp-muted, #7c8571);}

.rvmore-wrap {margin-top: 22px; text-align: center;}
.rvmore {padding: 14px 32px; border: 2px solid var(--kp-green, #4d9b42); border-radius: 999px; background: #fff; color: var(--kp-green, #4d9b42); font-size: 15.5px; font-weight: 600; cursor: pointer; transition: background .16s, color .16s;}
.rvmore:hover {background: var(--kp-green, #4d9b42); color: #fff;}

/* ── форма отзыва ─────────────────────────────────────────────────────────
 * Разметка своя (inc/reviews-rating.php), поэтому и стили пишутся с нуля:
 * ни одного правила, которое перебивает ядро или старую тему. Раньше форму
 * рисовал `comment_form()`, и строка согласия расползалась, а галочка
 * терялась — на неё наслаивались правила Bootstrap и старого шаблона.
 */

.rvform {margin-top: 44px; padding: 32px 34px; border-radius: var(--kp-r-xl, 24px); background: var(--kp-tint, #f7faf1); box-shadow: inset 0 0 0 1px var(--kp-line, #e7ece0);}
.rvform__title {margin: 0 0 8px; font-size: clamp(22px, 2.4vw, 28px); font-weight: 800; line-height: 1.2; color: var(--kp-ink, #1c2410);}
.rvform__lead {max-width: 64ch; margin: 0 0 22px; font-size: 15.5px; line-height: 1.6; color: var(--kp-text, #3a4232);}

.rvform__grid {display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; margin-bottom: 18px;}
.rvform__field {display: grid; gap: 7px; min-width: 0;}
.rvform__field--wide {grid-column: 1 / -1;}

.rvform label, .rvform__label {font-size: 14px; font-weight: 600; line-height: 1.3; color: var(--kp-ink, #1c2410);}
.rvform__req {color: #c0392b;}

.rvform input[type="text"], .rvform input[type="email"], .rvform textarea {width: 100%; padding: 13px 15px; border: 1.5px solid var(--kp-line, #e7ece0); border-radius: var(--kp-r-md, 12px); background: #fff; color: var(--kp-ink, #1c2410); font: inherit; font-size: 15.5px; line-height: 1.5;}
.rvform textarea {min-height: 128px; resize: vertical;}
.rvform input::placeholder, .rvform textarea::placeholder {color: #9aa48c;}
.rvform input:focus, .rvform textarea:focus {outline: none; border-color: var(--kp-lime, #a4d020); box-shadow: 0 0 0 3px rgba(164, 208, 32, .18);}

/* Звёзды. Разметка идёт от пятой к первой, поэтому подсвечиваем текущую
   и всех соседей справа через ~. Никаких шрифтов иконок. */
.rvform__stars {display: inline-flex; flex-direction: row-reverse; justify-content: flex-end; gap: 5px;}
.rvform__star-input {position: absolute; width: 1px; height: 1px; opacity: 0; pointer-events: none;}
.rvform__star {display: block; width: 36px; height: 36px; cursor: pointer; background: center / 32px 32px no-repeat; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%23d9dfd0'%3E%3Cpath d='m12 2 3.1 6.3 6.9 1-5 4.9 1.2 6.9L12 17.8 5.8 21l1.2-6.9-5-4.9 6.9-1z'/%3E%3C/svg%3E"); transition: transform .12s;}
.rvform__star:hover {transform: scale(1.12);}
.rvform__star-input:checked ~ .rvform__star,
.rvform__star:hover, .rvform__star:hover ~ .rvform__star {background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%23f5b301'%3E%3Cpath d='m12 2 3.1 6.3 6.9 1-5 4.9 1.2 6.9L12 17.8 5.8 21l1.2-6.9-5-4.9 6.9-1z'/%3E%3C/svg%3E");}
.rvform__star-input:focus-visible + .rvform__star {outline: 2px solid var(--kp-lime, #a4d020); outline-offset: 3px;}
.rvform__sr {position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap;}

/* Согласие: галочка и текст в одну строку по левому краю, текст переносится
   под собой, а не съезжает под чекбокс. */
.rvform__consent {display: flex; align-items: flex-start; gap: 10px; margin-bottom: 18px; font-size: 13.5px; font-weight: 400; line-height: 1.5; color: var(--kp-muted, #7c8571); cursor: pointer;}
.rvform__consent input {flex: none; width: 18px; height: 18px; margin: 1px 0 0; accent-color: var(--kp-green, #4d9b42); cursor: pointer;}
.rvform__consent span {flex: 1; min-width: 0;}
.rvform__consent a {color: var(--kp-green, #4d9b42); text-decoration: underline;}

.rvform__trap {position: absolute; left: -9999px; width: 1px; height: 1px; overflow: hidden;}

.rvform__btn {padding: 15px 34px; border: 0; border-radius: 999px; background: var(--kp-grad, linear-gradient(135deg, #a6d120, #2b8750)); color: #fff; font-size: 16px; font-weight: 700; line-height: 1; cursor: pointer; transition: transform .15s, filter .15s;}
.rvform__btn:hover:not(:disabled) {transform: translateY(-1px); filter: brightness(1.06);}
.rvform__btn:disabled {opacity: .65; cursor: default;}

.rvform__msg {display: none; margin-top: 16px; padding: 13px 16px; border-radius: var(--kp-r-md, 12px); font-size: 14.5px; line-height: 1.5;}
.rvform__msg.is-shown {display: block;}
.rvform__msg.is-ok {background: rgba(164, 208, 32, .18); color: #35601a;}
.rvform__msg.is-err {background: #fdeceb; color: #a33228;}

@media (max-width: 1023px) {
	.rvsum {grid-template-columns: 1fr;}
	.rvscore {max-width: 340px;}
}

@media (max-width: 767px) {
	.rvpage {padding-bottom: 60px;}
	.rvsum {gap: 20px; padding: 22px 18px; border-radius: 16px;}
	.rvsum__text p {font-size: 15.5px;}
	.rvscore {max-width: none; padding: 16px 18px;}
	.rvscore__num {font-size: 38px;}
	.rvlist {grid-template-columns: 1fr;}
	.rvcard {padding: 18px 17px;}
	.rvfilter {gap: 6px;}
	.rvchip {padding: 8px 12px; font-size: 13.5px;}

	.rvform {padding: 22px 18px; border-radius: 18px;}
	.rvform__grid {grid-template-columns: 1fr; gap: 14px;}
	.rvform__btn {width: 100%;}
	.rvform__star {width: 40px; height: 40px; background-size: 36px 36px;}
}