/*  offers */
.offers {padding-block: 20px; --_c-light-200: #d6d6d6; --_c-blue-500: #01778f;}
.offers .wrapper {display: grid; grid-template-columns: minmax(600px, 767px) minmax(300px, 364px); gap: 30px;}
.offers .image img {position: sticky; top: 70px;}
.offers .head {text-align: center; padding-inline: 20px; margin-block: 20px;}
.offers .head > :first-child {font-size: calc(var(--fs-lg, 30px) - 2px); margin-bottom: 8px;}
.offers .products {display: grid; grid-template-columns: repeat(auto-fit, minmax(218px, 1fr)); gap: 30px;}
.offers .item {width: 100%; color: var(--_c-blue-500); text-align: center; padding: 10px; border: 1px solid var(--_c-light-200); overflow: hidden;}
.offers .item:hover {border-color: var(--_c-blue-500);}
.offers .item:hover > img {transform: scale(1.1);}
.offers .item:hover button {background-color: var(--_c-blue-500);}
.offers .item > img {margin-bottom: 8px; height: 185px; object-fit: cover;}
.offers .item > :nth-child(2) {display: block; margin-bottom: 28px;}
.offers .item button {display: block; width: 120px; text-transform: capitalize;  border-radius: 5px; margin-left: auto;}
.offers :where(.wrapper, .image img, .head, .head *, .products, .item, .item *) {transition: var(--transition);}


/*  featurs */
.features {padding-block: 40px 20px; --_c-maroon: #b51e25; --_fs-xl: calc(var(--fs-xl, 36px) + 14px);}
.features .head {text-align: center; margin-bottom: 20px;}
.features .head > :first-child {font-size: calc(var(--fs-sm, 18px) + 2px); color: var(--c-secondary); margin-bottom: 10px;}
.features .head > :first-child * {display: block; font-size: var(--fs-base, 16px); margin-bottom: 3px;}
.features .head p {max-width: 900px; margin-inline: auto;}
.features .timer {background: no-repeat center/cover url(https://www.emenacpackaging.com.au/wp-content/themes/emenac-au/assets/images/offer-timer-bg.webp); display: flex; flex-direction: column; justify-content: center; align-items: center; height: 510px;}
.features .time {margin-bottom: 10px;}
.features .time > * {font-size: var(--_fs-xl); color: var(--_c-maroon); margin-inline: 25px;}
.features .highlights {padding-block: 16px;  text-align: center;}

@media only screen and (max-width: 991px) {
.offers .wrapper {grid-template-columns: 1fr; margin-bottom: 30px;}
.offers .image {margin-inline: auto;}
.quote-form form .group {flex-wrap: nowrap;}
.quote-form form :is(input[id="quantity"], input[id="contact"]) {width: auto;}
}

@media only screen and (max-width: 767px) {
.offers .products {gap: 20px;}
.features {padding-block: 20px;}
.features .timer {max-height: 380px;}
}

@media only screen and (max-width: 575px){
.offers .head {padding: 0;}
.offers .item > :nth-child(2) {margin-bottom: 15px;}
.offers .item button {width: 100px;}
.features .time > * {margin-inline: 15px;}
}

@media only screen and (max-width: 475px) {
.quote-form form .group {flex-wrap: wrap;}
.quote-form form :is(input[id="quantity"], input[id="contact"]) {width: 100%;}
.offers .item {width: auto; margin-inline: auto;}
}