@layer components {

    .review-form {
        max-width: 640px;
        margin-bottom: clamp(28px, 3.6vw, 56px);
        padding: var(--s-6);
        border-radius: var(--r-1);
        background: var(--c-surface);
    }

    .review-form__star {
        min-width: 64px;
        justify-items: center;
        text-align: center;
    }

    .review-form__actions {
        display: flex;
        flex-wrap: wrap;
        gap: var(--s-2);
    }

    @media (max-width: 599px) {
        .review-form {
            padding: var(--s-5);
        }

        .review-form__star {
            min-width: 52px;
            padding-inline: var(--s-2);
        }
    }

}