
html {scroll-behavior: auto;}
.reviews {padding-block: 50px 20px; --clr-text: #7a7a7a; --clr-border: #dee2e6;}
.reviews .head {text-align: center; margin-bottom: 50px;}
.reviews .head h1 {font-size: var(--fs-xl); font-weight: var(--fw-semi-bold); line-height: 160%; color: var(--clr-primary); margin-bottom: 16px;}
.reviews .head h1 span {color: var(--clr-secondary); font-size: calc(var(--fs-xl) + 6px);}
.reviews .head p {font-size: var(--fs-400); font-weight: var(--fw-regular); line-height: 160%; color: var(--clr-light-300);}        
.reviews .columns {display: grid; grid-template-columns: repeat(3, 1fr); gap: 20px; margin-bottom: 46px;}
.reviews .columns p {font-size: var(--fs-400); font-weight: var(--fw-regular); line-height: 160%; color: var(--clr-light-300);}
.reviews .review {position: relative; padding: 32px 22px 64px 28px; background-color: #FBFDFF; border-radius: 9px; box-shadow: var(--shadow-lt); margin-bottom: 30px;}
.reviews .review > :first-child {display: block; text-align: center; margin-bottom: 12px;}
.reviews .review::before {position: absolute; bottom: 18px; right: 18px; width: 49px; height: 36px; background: no-repeat center/cover url(https://www.ybyboxes.com.au/wp-content/themes/ybyboxesca/assets/images/icons/quote-icon.png); content: '';}
.reviews .review p {color: var(--clr-light-500); height: 155px;overflow-y: auto; padding-right: 18px;}
.reviews .client-name {margin-left: 28px;}
.reviews .client-name strong {position: relative; display: block; font-size: var(--fs-600); font-weight: var(--fw-semi-bold); margin-bottom: 12px; padding-left: 20px;}
.reviews .client-name strong::before {position: absolute; top: 10px; left: 0; width: 8px; height: 8px; background-color: #F5CC00; border-radius: 50%; content: '';}
.reviews .client-name ul {display: inline-flex; align-items: center; padding-left: 20px;}
.reviews .client-name li {padding-right: 3px;}
.reviews .client-name li svg {fill: #F5CC00; width: 12px; height: 12px;}
.reviews .buttons {display: flex; align-items: center; justify-content: center; gap: 20px;}
.reviews .buttons a {width: 152px;}
.reviews .overlay {position: absolute; inset: 0; height: 100%; width: 100%; display: flex; align-items: center; justify-content: center;  background-color: rgb(0 0 0 / .5);}
.reviews .feedback {position: relative; width: 500px; margin-inline: auto; background-color: #fff; z-index: 100;}
.reviews .feedback button:first-child {position: absolute; top: -20px; right: -20px;}
.reviews .feedback .title {border-bottom: 1px solid var(--clr-border); padding: 16px;}
.reviews .feedback .title h2 {position: relative; text-align: center;font-size: var(--fs-xl); font-weight: var(--fw-semi-bold); line-height: 160%; color: var(--clr-primary); margin-bottom: 16px;}
.reviews .feedback .title h2::before {position: absolute; inset: auto 0 0; margin-inline: auto; width: 168px; height: 5px; background-color: var(--clr-secondary-lt); content: '';}
.reviews .feedback form {position: relative; padding: 36px 16px 50px; display: flex; align-items: center; justify-content: center; flex-wrap: wrap; gap: 10px 5px;}
.reviews .feedback form :where(input, select, textarea) {width: 48%; padding: 5px; font-size: var(--fs-400); height: 38px; border: 1px solid rgb(118, 118, 118); color: rgb(118, 118, 118);;}
.reviews .feedback form select {appearance: none;}
.reviews .feedback form input[type="file"]{    padding: 10px 15px 10px 50px !important;background-image: url(https://www.ybyboxes.com.au/wp-content/themes/ybyboxesca/assets/images/icons/file_upload.webp);background-repeat: no-repeat;background-position: 1%;}
.reviews .feedback form input[type="number"]::-webkit-inner-spin-button {appearance: none;}
.reviews .feedback form textarea {width: 97%; height: 100px; resize: none; margin-bottom: 10px;}
.reviews .feedback form button[type="submit"] {width: 138px; color: #fff; background: linear-gradient(#ff3019 0,#cf0404 100%); padding-block: 8px; font-size: var(--fs-400); margin-inline: 8px auto;}


.video {padding-bottom: 40px;}
.video .title {text-align: center;}
.video .title h2 {font-size: var(--fs-xl); font-weight: var(--fw-semi-bold); line-height: 160%; color: var(--clr-primary); margin-bottom: 16px;}
.video .title h2 span {color: var(--clr-secondary); font-size: calc(var(--fs-xl) + 6px);}
.video iframe {height: 630px; margin-bottom: 50px;width:100%;border:0}
.video .slick-slide {margin: 0 10px;}
.video .slick-list {margin: 0 -10px;}
.video .arrow-btns {margin-left: 10px;text-align:end;}
.video .arrow-btns > button {position: relative;}
.video .arrow-btns .prev-btn::before {position: absolute; top: 15px; left: -15px; width: 25px; height: 6px; background-color: #fff; border: 1px solid #0061bc; transform: rotate(90deg); content: '';}
.video .arrow-btns .next-btn::after {position: absolute; top: 15px; right: -15px; width: 25px; height: 6px; background-color: #fff; border: 1px solid #0061bc; transform: rotate(90deg); content: '';}
.video .more-videos {margin-top: 30px;}


@media only screen and (width < 991px) {
.video iframe {height: 500px; margin-bottom: 50px;width:100%;border:0}
.reviews .columns {grid-template-columns: repeat(2, 1fr);}
.video .more-videos {grid-template-columns: repeat(2, 1fr); gap: 20px;}
}
@media only screen and (width < 767px) {
.video iframe {height: 400px; margin-bottom: 50px;width:100%;border:0}

.reviews .columns {grid-template-columns: 1fr;}
.reviews .review {padding-bottom: 52px;}
.reviews .review p {max-height: 78px;}
.reviews .review::before {width: 36px; height: 26px;}
.reviews .feedback {width: 450px;}
}
@media only screen and (width < 575px) {
.video iframe {height: 300px; margin-bottom: 50px;width:100%;border:0}
.reviews .review p {max-height: 100px;}
.reviews .feedback {max-width: 380px;}
}
@media only screen and (width < 475px) {
.video iframe {height: 200px; margin-bottom: 50px;width:100%;border:0}
.reviews .review p {padding-right: 10px;}
.reviews .buttons {flex-direction: column; gap: 10px;}
.reviews .feedback {max-width: 280px;}
.reviews .feedback .title h2 {margin-bottom: 0;}
.reviews .feedback .title h2::before {width: 110px;}
.reviews .feedback form {flex-direction: column; padding-block: 20px;}
.reviews .feedback form :is(input, select, textarea) {width: 100%;}
.video .more-videos {grid-template-columns: 1fr;}
}