#dovlo .dovlo-reviews {
display: grid;
grid-template-columns: minmax(0, 1fr);
gap: 18px;
}
#dovlo .dovlo-reviews .dovlo-review {
position: relative;
display: flex;
min-width: 0;
min-height: 100%;
flex-direction: column;
padding: 28px 24px 24px;
overflow: hidden;
border: 1px solid transparent;
border-radius: var(--dovlo-radius-md);
background: var(--dovlo-surface);
box-shadow: var(--dovlo-shadow-sm);
}
#dovlo .dovlo-reviews .dovlo-review::before {
content: "";
position: absolute;
inset: 0 0 auto;
height: 4px;
background: linear-gradient(
90deg,
var(--dovlo-brand-dark),
var(--dovlo-brand)
);
}
#dovlo .dovlo-reviews .dovlo-review__image {
margin-bottom: 30px;
border-radius: var(--dovlo-radius-sm);
}
#dovlo .dovlo-reviews .dovlo-review__quote-mark {
display: grid;
width: 46px;
height: 46px;
margin-bottom: 20px;
place-items: center;
border-radius: var(--dovlo-radius-sm);
color: var(--dovlo-brand-dark);
background: var(--dovlo-brand-soft);
font-family: Georgia, "Times New Roman", serif;
font-size: 2.6rem;
font-weight: 800;
line-height: 1.6;
}
#dovlo .dovlo-reviews .dovlo-review__content {
flex: 1;
}
#dovlo .dovlo-reviews .dovlo-review__content p {
color: var(--dovlo-muted) !important;
font-size: 1rem !important;
font-style: italic;
line-height: 1.75 !important;
}
#dovlo .dovlo-reviews .dovlo-review__footer {
margin-top: 26px;
padding-top: 20px;
border-top: 1px solid var(--dovlo-line);
}
#dovlo .dovlo-reviews .dovlo-review__author {
display: grid;
grid-template-columns: 48px minmax(0, 1fr);
gap: 14px;
align-items: start;
}
#dovlo .dovlo-reviews .dovlo-review__avatar {
display: grid;
width: 48px;
height: 48px;
place-items: center;
border-radius: var(--dovlo-radius-sm);
color: var(--dovlo-surface);
background: linear-gradient(
135deg,
var(--dovlo-brand-dark),
var(--dovlo-brand)
);
box-shadow: var(--dovlo-shadow-avatar);
font-size: 0.82rem;
font-weight: 850;
line-height: 1;
letter-spacing: 0.04em;
}
#dovlo .dovlo-reviews .dovlo-review__person {
min-width: 0;
}
#dovlo .dovlo-reviews .dovlo-review__person > strong {
display: block;
color: var(--dovlo-ink) !important;
font-size: 0.98rem;
font-weight: 850;
line-height: 1.4;
}
#dovlo .dovlo-reviews .dovlo-review__source-row {
display: flex;
margin-top: 4px;
align-items: baseline;
flex-wrap: wrap;
}
#dovlo .dovlo-reviews .dovlo-review__source-row > span {
color: var(--dovlo-muted);
font-size: 0.78rem;
line-height: 1.5;
}
#dovlo .dovlo-reviews .dovlo-review__toggle {
position: relative;
display: inline-flex !important;
border: 0 !important;
color: var(--dovlo-muted) !important;
background: transparent !important;
font-size: 0.78rem !important;
line-height: 1.5 !important;
text-decoration: underline;
text-decoration-thickness: 1px;
text-underline-offset: 3px;
cursor: pointer;
}
#dovlo .dovlo-reviews .dovlo-review__toggle:hover {
color: var(--dovlo-brand) !important;
}
#dovlo .dovlo-reviews .dovlo-review__disclosure {
display: grid;
grid-template-rows: 0fr;
visibility: hidden;
opacity: 0;
transition:
grid-template-rows 240ms ease,
opacity 200ms ease,
visibility 0s linear 240ms;
}
#dovlo .dovlo-reviews .dovlo-review__disclosure > span {
min-height: 0;
overflow: hidden;
color: var(--dovlo-muted);
font-size: 0.76rem;
line-height: 1.5;
}
#dovlo .dovlo-reviews .dovlo-review__disclosure[aria-hidden="false"] {
grid-template-rows: 1fr;
visibility: visible;
opacity: 1;
transition:
grid-template-rows 240ms ease,
opacity 200ms ease,
visibility 0s linear 0s;
}
@media (min-width: 780px) {
#dovlo .dovlo-reviews .dovlo-review {
padding: 30px 26px 26px;
transition:
transform 220ms ease,
border-color 220ms ease,
box-shadow 220ms ease;
}
#dovlo .dovlo-reviews .dovlo-review:hover {
border-color: var(--dovlo-shadow-border-hover);
box-shadow: var(--dovlo-shadow-md);
transform: translateY(-4px);
}
}
@media (min-width: 940px) {
#dovlo .dovlo-reviews {
grid-template-columns: repeat(3, minmax(0, 1fr));
gap: 20px;
}
}