:root {
--kbrv2-bg: #fbf1eb;
--kbrv2-card: #ffffff;
--kbrv2-text: #2a211d;
--kbrv2-muted: #766b65;
--kbrv2-line: #eadfd8;
--kbrv2-accent: #bd703f;
--kbrv2-accent-dark: #96532d;
--kbrv2-star: #df8448;
}
.kuba-rv,
.kuba-rv * {
box-sizing: border-box;
}
.kuba-rv {
color: var(--kbrv2-text);
font-family: inherit;
}
.kuba-rv-wrap {
max-width: 1100px;
margin: 24px auto;
padding: 36px 28px;
background: var(--kbrv2-bg);
border-radius: 18px;
}
.kuba-rv-inner {
max-width: 1050px;
margin: 0 auto;
}
.kuba-rv-eyebrow {
display: inline-block;
color: var(--kbrv2-accent);
font-size: 12px;
font-weight: 800;
letter-spacing: 1.6px;
}
.kuba-rv h2 {
margin: 8px 0 12px;
font-size: clamp(28px, 4vw, 42px);
line-height: 1.08;
}
.kuba-rv-header {
display: flex;
align-items: flex-start;
justify-content: space-between;
gap: 24px;
margin-bottom: 24px;
}
.kuba-rv-cta,
.kuba-rv-submit,
.kbrv2-load-more {
display: inline-flex;
align-items: center;
justify-content: center;
min-height: 48px;
padding: 13px 20px;
color: #fff !important;
font: inherit;
font-weight: 800;
line-height: 1.25;
text-align: center;
text-decoration: none !important;
background: var(--kbrv2-accent);
border: 0;
border-radius: 11px;
cursor: pointer;
transition: background .18s ease, transform .18s ease, opacity .18s ease;
}
.kuba-rv-cta:hover,
.kuba-rv-submit:hover,
.kbrv2-load-more:hover {
color: #fff !important;
background: var(--kbrv2-accent-dark);
transform: translateY(-1px);
}
.kuba-rv-submit:disabled,
.kbrv2-load-more[aria-busy="true"] {
opacity: .65;
cursor: wait;
transform: none;
}
.kuba-rv-cards {
display: grid;
grid-template-columns: repeat(3, minmax(0, 1fr));
gap: 14px;
}
.kuba-rv-card {
position: relative;
display: flex;
flex-direction: column;
min-width: 0;
padding: 25px;
background: var(--kbrv2-card);
border: 1px solid var(--kbrv2-line);
border-radius: 16px;
box-shadow: 0 8px 28px rgba(42, 27, 18, .04);
}
.kuba-rv-starsout {
margin-bottom: 17px;
color: var(--kbrv2-star);
font-size: 18px;
letter-spacing: 2px;
}
.kbrv2-review-text {
position: relative;
color: #46413e;
font-size: 14px;
line-height: 1.7;
}
.kbrv2-review-text p {
margin: 0 0 .85em;
}
.kbrv2-review-text p:last-child {
margin-bottom: 0;
}
.kbrv2-js .kbrv2-review-text.is-collapsible:not(.is-expanded) {
display: -webkit-box;
overflow: hidden;
-webkit-box-orient: vertical;
-webkit-line-clamp: 8;
}
.kbrv2-review-toggle {
align-self: flex-start;
margin: 12px 0 0;
padding: 0;
color: var(--kbrv2-accent-dark);
font: inherit;
font-size: 13px;
font-weight: 800;
background: transparent;
border: 0;
border-bottom: 1px solid currentColor;
cursor: pointer;
}
.kuba-rv-author {
margin-top: auto;
padding-top: 18px;
border-top: 1px solid var(--kbrv2-line);
}
.kuba-rv-author strong {
font-size: 13px;
}
.kuba-rv-author small {
color: #8c817b;
font-size: 11px;
}
.kbrv2-empty {
grid-column: 1 / -1;
margin: 0;
padding: 24px;
color: var(--kbrv2-muted);
text-align: center;
background: rgba(255, 255, 255, .55);
border: 1px dashed rgba(61, 42, 31, .18);
border-radius: 14px;
}
.kbrv2-pagination-wrap {
display: flex;
flex-wrap: wrap;
align-items: center;
justify-content: center;
gap: 14px 20px;
margin-top: 24px;
}
.kbrv2-progress {
flex: 1 1 100%;
margin: 0;
color: var(--kbrv2-muted);
font-size: 12px;
font-weight: 700;
text-align: center;
}
.kbrv2-load-more {
min-width: 220px;
}
.kbrv2-pages {
display: flex;
align-items: center;
justify-content: center;
gap: 6px;
width: 100%;
}
.kbrv2-page,
.kbrv2-ellipsis {
display: inline-flex;
align-items: center;
justify-content: center;
min-width: 38px;
height: 38px;
padding: 0 8px;
color: var(--kbrv2-text) !important;
font-size: 13px;
font-weight: 800;
text-decoration: none !important;
background: #fff;
border: 1px solid var(--kbrv2-line);
border-radius: 9px;
}
.kbrv2-page.is-current {
color: #fff !important;
background: var(--kbrv2-accent);
border-color: var(--kbrv2-accent);
}
.kbrv2-ellipsis {
color: var(--kbrv2-muted) !important;
background: transparent;
border-color: transparent;
}
.kbrv2-form-wrap:not(.kbrv2-form-always-visible) {
display: none;
}
.kbrv2-form-wrap:target,
.kbrv2-form-wrap.kbrv2-form-always-visible,
body:not(.home) .kbrv2-form-wrap {
display: block;
}
.kbrv2-form-wrap:target {
animation: kbrv2-reveal .25s ease;
}
@keyframes kbrv2-reveal {
from { opacity: 0; transform: translateY(-8px); }
to { opacity: 1; transform: none; }
}
.kuba-rv-form {
margin-top: 26px;
padding: 28px;
background: #fff;
border: 1px solid var(--kbrv2-line);
border-radius: 17px;
box-shadow: 0 10px 35px rgba(42, 27, 18, .04);
}
.kuba-rv-grid {
display: grid;
grid-template-columns: repeat(2, minmax(0, 1fr));
gap: 18px;
}
.kuba-rv-field {
margin-bottom: 18px;
}
.kuba-rv-field label,
.kuba-rv-rating legend {
display: block;
margin-bottom: 7px;
font-weight: 800;
}
.kuba-rv-field input,
.kuba-rv-field textarea {
width: 100%;
padding: 13px 14px;
color: var(--kbrv2-text);
font: inherit;
background: #fff;
border: 1px solid #dcd2cc;
border-radius: 9px;
}
.kuba-rv-field input:focus,
.kuba-rv-field textarea:focus {
outline: 3px solid rgba(189, 112, 63, .18);
border-color: var(--kbrv2-accent);
}
.kuba-rv-field small {
display: block;
margin-top: 5px;
color: var(--kbrv2-muted);
font-size: 11px;
}
.kuba-rv-rating {
margin: 0 0 20px;
padding: 0;
border: 0;
}
.kuba-rv-stars {
display: inline-flex;
flex-direction: row-reverse;
}
.kuba-rv-stars input {
position: absolute;
opacity: 0;
}
.kuba-rv-stars label {
color: #ddd3cc;
font-size: 36px;
line-height: 1;
cursor: pointer;
}
.kuba-rv-stars input:checked ~ label,
.kuba-rv-stars label:hover,
.kuba-rv-stars label:hover ~ label,
.kuba-rv-stars input:focus-visible + label {
color: var(--kbrv2-star);
}
.kuba-rv-consent {
display: flex;
align-items: flex-start;
gap: 9px;
margin: 0 0 18px;
font-size: 13px;
line-height: 1.5;
}
.kuba-rv-consent input {
flex: 0 0 auto;
margin-top: 3px;
}
.kuba-rv-msg,
.kbrv2-form-error {
margin: 16px 0;
padding: 12px 14px;
border-radius: 9px;
}
.kuba-rv-ok {
color: #285c2b;
background: #edf7ed;
}
.kuba-rv-err,
.kbrv2-form-error {
color: #8b3029;
background: #fff0ef;
}
.kuba-rv-hp {
position: absolute !important;
left: -99999px !important;
width: 1px !important;
height: 1px !important;
overflow: hidden !important;
}
.kbrv2-moderation-note {
margin: 12px 0 0;
color: var(--kbrv2-muted);
font-size: 12px;
}
@media (max-width: 800px) {
.kuba-rv-cards {
grid-template-columns: repeat(2, minmax(0, 1fr));
}
}
@media (max-width: 700px) {
.kuba-rv-wrap {
margin: 16px auto;
padding: 28px 18px;
border-radius: 14px;
}
.kuba-rv-header {
flex-direction: column;
}
.kuba-rv-cta,
.kuba-rv-submit,
.kbrv2-load-more {
width: 100%;
}
.kuba-rv-cards,
.kuba-rv-grid {
grid-template-columns: 1fr;
}
.kuba-rv-card {
padding: 21px;
}
.kuba-rv-form {
padding: 21px 16px;
}
.kbrv2-pages {
gap: 4px;
}
.kbrv2-page,
.kbrv2-ellipsis {
min-width: 34px;
height: 34px;
}
}
@media (prefers-reduced-motion: reduce) {
.kuba-rv-cta,
.kuba-rv-submit,
.kbrv2-load-more,
.kbrv2-form-wrap:target {
animation: none;
transition: none;
}
}