:root { --review-red: #a60000; --review-green: #12482d; --review-gold: #ffc400; --review-paper: #fff8ea; --review-line: #decda9; }
body { min-width: 320px; background: radial-gradient(circle at 88% 4%, #ffe272 0 11%, transparent 30%), #f5ead2; color: #1f160d; }.review-header { min-height: 92px; padding: 14px clamp(20px, 6vw, 88px); display: flex; align-items: center; justify-content: space-between; gap: 20px; background: rgba(255,250,240,.95); border-bottom: 1px solid rgba(125,74,42,.16); }.review-brand img { width: min(250px,46vw); display: block; }.back-link { color: var(--review-green); font-size: 12px; font-weight: 900; letter-spacing: .07em; text-transform: uppercase; }.review-main { min-height: calc(100vh - 235px); padding: clamp(48px,8vw,108px) 20px; display: grid; place-items: center; }.review-card { width: min(900px,100%); padding: clamp(30px,6vw,68px); border: 1px solid var(--review-line); border-radius: 22px; background: var(--review-paper); box-shadow: 0 22px 60px rgba(84,47,13,.15); text-align: center; }.review-card .eyebrow { margin-bottom: 10px; }.review-card h1 { max-width: 680px; margin: 0 auto; font: 900 clamp(38px,6vw,68px)/.98 Georgia,serif; letter-spacing: -.045em; }.review-intro { max-width: 600px; margin: 22px auto 36px; color: #685a45; line-height: 1.65; }.feedback-success { max-width: 620px; margin: 0 auto 28px; padding: 14px 18px; border-radius: 9px; background: #e0efd9; color: var(--review-green); font-weight: 800; line-height: 1.5; }
.visually-hidden { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; }
.experience-options { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 22px; }.experience-options[hidden] { display: none; }.experience-option { min-height: 245px; padding: 28px; display: grid; place-items: center; align-content: center; gap: 10px; border: 0; border-radius: 16px; color: #fff; font: inherit; cursor: pointer; text-decoration: none; transition: transform .2s ease, box-shadow .2s ease; }.experience-option:hover { transform: translateY(-5px); box-shadow: 0 18px 32px rgba(33,18,2,.2); }.experience-option span { width: 64px; height: 64px; display: grid; place-items: center; border: 1px solid rgba(255,255,255,.58); border-radius: 50%; font-size: 31px; }.experience-option strong { font: 900 clamp(25px,4vw,36px)/1 Georgia,serif; }.experience-option small { font-size: 12px; font-weight: 800; letter-spacing: .03em; }.experience-option.good { background: var(--review-green); }.experience-option.improve { background: var(--review-red); }
.feedback-form { max-width: 640px; margin: 36px auto 0; padding-top: 35px; border-top: 1px solid var(--review-line); text-align: left; }.feedback-heading { text-align: center; }.feedback-heading h2 { margin: 0; font: 900 34px/1 Georgia,serif; }.feedback-heading p:last-child { color: #685a45; line-height: 1.55; }.feedback-fields { margin: 25px 0 20px; display: grid; gap: 15px; }.feedback-fields label,.rating-field { display: grid; gap: 7px; color: var(--review-green); font-size: 12px; font-weight: 900; text-transform: uppercase; letter-spacing: .055em; }.rating-field { margin: 0; padding: 0; border: 0; }.rating-field legend { padding: 0; }.rating-stars { display: flex; flex-direction: row-reverse; justify-content: flex-end; gap: 5px; }.rating-stars input { position: absolute; opacity: 0; }.rating-stars label { color: #d8c7a0; font-size: 34px; line-height: 1; cursor: pointer; transition: color .15s; }.rating-stars input:checked ~ label,.rating-stars label:hover,.rating-stars label:hover ~ label { color: var(--review-gold); }.feedback-fields input,.feedback-fields textarea,.feedback-fields select { width: 100%; box-sizing: border-box; padding: 13px; border: 1px solid var(--review-line); border-radius: 8px; background: #fffdf8; color: #1f160d; font: 400 15px Arial,sans-serif; resize: vertical; }.feedback-fields input:focus,.feedback-fields textarea:focus,.feedback-fields select:focus { outline: 3px solid rgba(255,196,0,.35); border-color: #d8a400; }.feedback-submit { width: 100%; min-height: 53px; border: 0; cursor: pointer; }.feedback-note { margin: 15px 0 0; color: #685a45; font-size: 12px; line-height: 1.5; text-align: center; }.review-footer { min-height: 95px; padding: 18px clamp(20px,6vw,88px); display: flex; align-items: center; justify-content: space-between; gap: 20px; background: #101e14; color: #cbd6cc; }.review-footer p { margin: 0; }.review-footer a { color: #fff; font-size: 12px; font-weight: 900; text-transform: uppercase; }
@media (max-width: 620px) { .review-header { min-height: 72px; }.experience-options { grid-template-columns: 1fr; }.experience-option { min-height: 185px; }.review-footer { flex-direction: column; justify-content: center; text-align: center; }.review-main { min-height: auto; padding: 42px 14px; }.review-card { padding: 30px 20px; } }