.reviews-page { background: #050507; color: #fff; min-height: 100vh; }
.site-header { position: sticky; top: 0; z-index: 5; display: flex; align-items: center; justify-content: space-between; padding: 14px 6vw; background: #08080bea; border-bottom: 1px solid #ffffff1f; backdrop-filter: blur(10px); }
.site-header .brand img { width: 118px; height: auto; }
.back-home { color: #fff; text-decoration: none; font-weight: 800; }
.back-home:hover { color: var(--cyan); }
.reviews-hero { padding: 110px 7vw 90px; text-align: center; background: radial-gradient(circle at 50% 20%, #0c668444, transparent 42%); }
.reviews-hero h1 { margin: 8px 0 18px; font-size: clamp(48px, 8vw, 94px); line-height: .96; }
.reviews-hero > p:last-child { max-width: 680px; margin: 0 auto; color: #bfc0c7; font-size: 18px; }
.approved-reviews, .leave-review { padding: 85px 7vw; }
.approved-reviews { background: #0a0a0e; }
.reviews-heading { display: grid; grid-template-columns: 1.2fr .8fr; gap: 40px; align-items: end; max-width: 1180px; margin: 0 auto 38px; }
.reviews-heading h2, .review-intro h2 { margin: 7px 0 0; font-size: clamp(36px, 5vw, 62px); }
.reviews-heading > p, .review-intro > p:last-child { color: #bfc0c7; }
.review-list { display: grid; gap: 22px; max-width: 1180px; margin: auto; }
.reviews-empty { padding: 46px 28px; border: 1px solid #ffffff24; text-align: center; background: #050507; }
.reviews-empty span { color: #20c9f3; font-size: 25px; letter-spacing: 5px; }
.reviews-empty h3 { margin: 15px 0 8px; font-size: 24px; }
.reviews-empty p { margin: 0; color: #bfc0c7; }
.review-card { padding: 34px; border: 1px solid #ffffff24; background: #050507; }
.review-card-top { display: flex; align-items: flex-start; justify-content: space-between; gap: 24px; }
.review-card h3 { margin: 0 0 6px; font-size: 26px; }
.review-card-top p { margin: 0; color: #20c9f3; font-weight: 750; }
.review-stars { flex: 0 0 auto; color: #20c9f3; font-size: 22px; letter-spacing: 3px; }
.review-card blockquote { margin: 28px 0 0; color: #e5e5e9; font-size: clamp(19px, 2.2vw, 25px); line-height: 1.55; }
.leave-review { display: grid; grid-template-columns: .8fr 1.2fr; gap: 70px; max-width: 1180px; margin: auto; }
.review-form { display: grid; gap: 22px; padding: 34px; border: 1px solid #ffffff24; background: #0a0a0e; }
.review-form label, .review-form legend { color: #fff; font-weight: 750; }
.review-form input[type="text"], .review-form textarea { box-sizing: border-box; width: 100%; margin-top: 9px; padding: 14px 15px; border: 1px solid #ffffff2e; border-radius: 2px; background: #050507; color: #fff; font: inherit; }
.review-form input:focus, .review-form textarea:focus { outline: 2px solid var(--cyan); outline-offset: 2px; }
.review-form fieldset { margin: 0; padding: 0; border: 0; }
.rating { display: flex; flex-direction: row-reverse; justify-content: flex-end; gap: 5px; margin-top: 8px; }
.rating input { position: absolute; opacity: 0; }
.rating label { color: #585860; cursor: pointer; font-size: 35px; line-height: 1; }
.rating label:hover, .rating label:hover ~ label, .rating input:checked ~ label { color: #20c9f3; }
.permission { display: flex; gap: 10px; align-items: flex-start; color: #bfc0c7 !important; font-weight: 500 !important; }
.permission input { margin-top: 4px; }
.purchase-again-options { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 10px; }
.purchase-again-options label { display: flex; align-items: center; gap: 8px; min-width: 88px; padding: 11px 14px; border: 1px solid #ffffff2e; border-radius: 2px; cursor: pointer; }
.purchase-again-options input { width: auto; margin: 0; accent-color: var(--cyan); }
.review-form .button { border: 0; cursor: pointer; font: inherit; }
.form-note { margin: -10px 0 0; color: #92939a; font-size: 13px; }
.reviews-footer { display: flex; align-items: center; justify-content: center; gap: 20px; padding: 35px 7vw; border-top: 1px solid #ffffff1f; background: #050507; color: #bfc0c7; }
.reviews-footer img { width: 92px; }
@media (max-width: 760px) {
  .reviews-heading, .leave-review { grid-template-columns: 1fr; }
  .leave-review { gap: 34px; }
  .reviews-hero { padding-top: 80px; }
  .review-form { padding: 24px 18px; }
  .review-card-top { flex-direction: column; }
  .review-card { padding: 26px 20px; }
  .reviews-footer { flex-direction: column; text-align: center; }
}