/**
 * Villa Reviews section — laurel score header and a two-column card grid with a
 * "Load more" reveal, on the dark band. Depends on villa-home.css.
 *
 * @package Villa_Addon
 */

.vo-reviews { background: var(--dark); padding-block: var(--sp-160); padding-inline: var(--pad-x); }
.vo-reviews__inner { width: 100%; margin-inline: auto; }

.reviews__head { text-align: center; max-width: 640px; margin: 0 auto clamp(3rem, 6vw, 5rem); }
.reviews__head h2 { color: var(--cream); font-family: var(--display); font-weight: 600; line-height: 1.1; font-size: clamp(2.1rem, 1.2rem + 3.1vw, 60px); margin: 0; }
.reviews__score { display: inline-flex; align-items: center; gap: 20px; margin-bottom: 1.4rem; }
.reviews__num { font-family: var(--display); font-weight: 600; font-size: clamp(3rem, 2rem + 4vw, 5rem); line-height: 1; color: #fff; }
.reviews__num small { font-family: var(--sans); font-size: 1.4rem; font-weight: 500; color: rgba(255, 255, 255, .55); margin-left: .3rem; }
.laurel { width: clamp(44px, 7vw, 64px); height: auto; color: var(--teal); }
.laurel.flip { transform: scaleX(-1); }
.reviews__sub { color: rgba(255, 255, 255, .68); font-size: 18px; line-height: 1.5; margin-top: 1rem; }

.reviews__grid { display: grid; grid-template-columns: 1fr 1fr; gap: 48px clamp(48px, 7vw, 120px); }
.rcard { display: flex; flex-direction: column; }
.rcard__head { display: flex; align-items: center; gap: 14px; margin-bottom: 20px; }
.rcard__av { width: 46px; height: 46px; border-radius: 50%; flex: 0 0 auto; display: grid; place-items: center; color: #fff; font-family: var(--display); font-weight: 600; font-size: 20px; box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .16); }
.rcard__who { display: flex; flex-direction: column; line-height: 1.3; }
.rcard__who b { color: #fff; font-weight: 600; font-size: 16px; }
.rcard__who span { color: rgba(255, 255, 255, .55); font-size: 16px; }
.rcard__quote { color: rgba(255, 255, 255, .9); font-size: 20px; line-height: 1.4; font-weight: 400; margin: 0; }
.rcard__foot { display: flex; align-items: center; gap: 12px; margin-top: 22px; color: rgba(255, 255, 255, .55); font-size: 15px; }
.stars::before { content: "\2605\2605\2605\2605\2605"; letter-spacing: 2px; color: var(--teal-ink); font-size: 16px; }

.rcard.is-more { display: none; }
.rcard.is-more.show { display: flex; animation: rcardIn .5s var(--ease) both; }
@keyframes rcardIn { from { opacity: 0; transform: translateY(20px); } to { opacity: 1; transform: none; } }

.reviews__more { text-align: center; margin-top: clamp(2.5rem, 5vw, 4rem); }
.reviews__more.done { display: none; }
.reviews__more .vo-btn { border-color: rgba(255, 255, 255, .45); color: #fff; }
.reviews__more .vo-btn:hover { background: #fff; color: var(--dark); border-color: #fff; }

@media (max-width: 820px) { .reviews__grid { grid-template-columns: 1fr; gap: 40px; } }
