

/* Banner */
.banner {background: var(--_c-grad-primary); padding-block: 0.75rem;}
.banner .wrapper {display: grid; grid-template-columns: minmax(534px, 647px) minmax(436px, 474px); align-items: center; gap: 1.5rem;}
.banner .content > :first-child {font-size: var(--fs-xl, 40px); margin-bottom: 1.75rem;}
.banner .content ul {margin-bottom: 1.75rem;}
.banner .content li {position: relative; color: var(--c-secondary); padding-left: 1.5rem;}
.banner .content li::before {position: absolute; inset: 0 auto 0 0; width: 0.875rem; height: 0.875rem; background: no-repeat center/cover url('https://customcosmeticboxes.com/wp-content/themes/customcosmeticboxes/assets/images/icons/banner-list.svg'); filter: var(--filter-primary); content: ''; margin-block: auto;}
.banner .content li:not(:last-child) {margin-bottom: 0.75rem;}
.banner .content p {color: var(--c-text); margin-bottom: 1.75rem;}
.banner .btns {display: flex; align-items: center; gap: 1.25rem;}
.banner .btn__primary {text-transform: uppercase; padding: 0.875rem 1.875rem; border-radius: 5px;}
.banner .image {background: no-repeat center/contain url('https://customcosmeticboxes.com/wp-content/themes/customcosmeticboxes/assets/images/banner-back.webp');}
.banner .image img {margin-inline: auto;}

/* Process */
.process {padding-block: 2rem;}
.process .head {text-align: center; margin-bottom: 2.5rem;}
.process .head > :first-child {font-size: var(--fs-lg, 38px); font-weight: 600; line-height: 1.2; margin-bottom: 1.25rem;}
.process .head p {max-height: 4.125rem;}
.process ul {display: grid; grid-template-columns: repeat(4, 1fr); gap: 1.5rem;}
.process li {display: flex; flex-direction: column; align-items: center; gap: 1.25rem; text-align: center;}
.process li :nth-child(2) {font-size: var(--fs-md, 24px); color: var(--c-heading);}
.process li p {max-height: 3rem; font-size: var(--fs-base, 16px);}

/* Offers */
.offers {padding-block: 2rem;}
.offers .head {text-align: center; margin-bottom: 2.5rem;}
.offers .head :first-child {font-size: var(--fs-lg, 38px); font-weight: 600; line-height: 1.2; margin-bottom: 1.25rem;}
.offers .head p {max-height: 4.125rem;}
.offers .wrapper {display: grid; grid-template-columns: repeat(3, 1fr); gap: 1.5rem;}
.offers .card {display: flex; flex-direction: column; gap: 1.25rem; padding: 2rem 1.875rem; border: 1px solid var(--_c-lgt-beige); border-radius: 5px;}
.offers .card > :nth-child(2) {font-size: var(--fs-sm, 20px); font-weight: 500; color: var(--c-heading); text-transform: capitalize;}
.offers .card p {max-height: 120px;}
.offers .card li {position: relative; font-size: var(--fs-base, 16px); color: var(--c-secondary); text-transform: capitalize; padding-left: 1.5rem;}
.offers .card li::before {position: absolute; inset: 0 auto 0 0; width: 0.875rem; height: 0.875rem; background: no-repeat center/cover url('https://customcosmeticboxes.com/wp-content/themes/customcosmeticboxes/assets/images/icons/card-tick.svg'); filter: var(--filter-primary); content: ''; margin-block: auto;}
.offers .card li:not(:last-child) {margin-bottom: 0.625rem;}

/* Designs */
.design {padding-block: 2rem;}
.design .head {text-align: center; margin-bottom: 2.5rem;}
.design .head :first-child {font-size: var(--fs-lg, 38px); font-weight: 600; line-height: 1.2; margin-bottom: 1.25rem;}
.design .head p {max-height: 7.5rem; font-size: var(--fs-base, 16px);}
.design .wrapper {display: grid; grid-template-columns: repeat(3, 1fr); gap: 1.25rem;} 
.design .card {display: flex; flex-direction: column; gap: 1.25rem; box-shadow: var(--_c-shdw-lgt); padding: 1.25rem; border-radius: 10px;}
.design .image img {width: 100%;}
.design .card > :nth-child(2) {font-size: var(--fs-sm, 20px); font-weight: 700; text-align: center;}
.design .card li {position: relative; font-size: var(--fs-base, 16px); color: var(--c-text); padding-left: 1.25rem;}
.design .card li::before {position: absolute; inset: 0 auto 0 0; width: 0.625rem; height: 0.625rem; background: no-repeat center/cover url('https://customcosmeticboxes.com/wp-content/themes/customcosmeticboxes/assets/images/icons/design-list.svg'); filter: var(--fltr-gray); content: ''; margin-block: auto;}
.design .card li:not(:last-child) {margin-bottom: 0.625rem;}
.design .card > :nth-child(4) {display: block; font-size: calc(var(--fs-base, 16px) + 2px); font-weight: 500; text-transform: capitalize; text-align: right; color: var( --c-heading); transition: var(--trans-3);}
.design .card:hover > :nth-child(4) {color: var(--c-heading);}

/* Quote */
.quote { background: no-repeat center/cover url('https://customcosmeticboxes.com/wp-content/themes/customcosmeticboxes/assets/images/form-back.webp'); padding-block: 1.25rem;}
.quote .wrapper {display: grid; grid-template-columns: minmax(476px, 571px) minmax(456px, 531px); align-items: center; gap: 2.5rem;}
.quote .content > :not(:last-child) {color: var(--_c-pink); margin-bottom: 1.5rem;}
.quote .content > :first-child {font-size: calc(var(--fs-lg, 38px) - 4px); color: #fff;}
.quote .content > p {line-height: 1.7;}
.quote ul {display: grid; grid-template-columns: repeat(2, 1fr); align-items: center; gap: 1.5rem;}
.quote ul li {position: relative; font-size: var(--fs-base, 16px); padding-left: 1.5rem;}
.quote ul li::before {position: absolute; inset: 0 auto 0 0; width: 0.875rem; height: 0.875rem; background: no-repeat center/cover url('https://customcosmeticboxes.com/wp-content/themes/customcosmeticboxes/assets/images/icons/quote-list.svg'); filter: var(--_filter-gray); content: ''; margin-block: auto;}  
.quote .orders {display: flex; justify-content: space-between; align-items: center; gap: 1.5rem;}
.quote .orders > :first-child {display: flex; align-items: center; gap: 0.5rem; font-size: var(--fs-sm, 20px); text-transform: capitalize; color: #fff;}
.quote .orders > :first-child > :first-child {font-size: var(--fs-xl, 40px); font-weight: 600; color: var(--c-primary);}
.quote .transparent {display: flex; align-items: center; gap: 1rem; color: #fff; padding: 0.875rem 1.25rem; border-radius: 5px;}
.quote .transparent img {filter: var(--filter-white);}

/* Packaging */
.packaging {padding-block: 2rem;}
.packaging .wrapper {display: grid; grid-template-columns: minmax(460px, 566px) minmax(471px, 543px); align-items: center; gap: 1.5rem;}
.packaging .content > :first-child {font-size: calc(var(--fs-xl, 40px) - 2px); text-transform: capitalize; margin-bottom: 1rem;}
.packaging .content > :first-child * {display: inline-block; font-size: var(--fs-base, 16px); font-family: var(--ff-primary); font-weight: 500; color: #626262; margin-bottom: 0.5rem;} 
.packaging .content p {max-height: 8.75rem; margin-bottom: 1.25rem;}
.packaging .content ul {display: grid; grid-template-columns: repeat(2, 1fr); gap: 1.25rem 1rem; width: fit-content;}
.packaging .content li {position: relative; color: var(--c-secondary); padding-left: 1.875rem;}
.packaging .content li::before {position: absolute; inset: 0 auto 0 0; width: 0.875rem; height: 0.875rem; background: no-repeat center/cover url('https://customcosmeticboxes.com/wp-content/themes/customcosmeticboxes/assets/images/icons/card-tick.svg'); filter: var(--filter-primary); content: ''; margin-block: auto;}
.packaging .features {display: grid; grid-template-columns: repeat(3, 1fr); align-items: center; gap: 1.5rem;}

/* Benefits */
.benefits {padding-block: 2rem;}
.benefits .head {text-align: center; margin-bottom: 3.125rem;}
.benefits .head :first-child {font-size: calc(var(--fs-xl, 40px) - 2px); font-weight: 600; line-height: 1.2; margin-bottom: 1.25rem;}
.benefits .head p {max-height: 4.125rem;}
.benefits ul {display: grid; grid-template-columns: repeat(6, 1fr); gap: 1.5rem;}
.benefits li {display: flex; flex-direction: column; align-items: center; gap: 0.5rem; font-size: var(--fs-base, 16px); text-align: center; text-transform: capitalize; color: #000;}
.benefits li div {width: 3.25rem; height: 3.5rem;}

/* Brand */
.brand {padding-block: 2rem;}
.brand .wrapper {display: grid; grid-template-columns: repeat(2, 1fr); align-items: center; gap: 1.5rem;}
.brand .content {display: flex; flex-wrap: wrap;}
.brand .content > :first-child {width: 100%; font-size: calc(var(--fs-lg, 32px) + 2px); font-weight: 600; line-height: 1.2; margin-bottom: 1.25rem;}
.brand .content > p {margin-bottom: 2rem;}
.brand .content > p:nth-of-type(1) {width: 100%;}
.brand .content > p:nth-of-type(2) {width: 18.75rem;}
.brand .content > ul {width: 14.125rem;}
.brand .content li {position: relative; color: var(--c-secondary); padding-left: 1.5rem;}
.brand .content li::before {position: absolute; inset: 0.125rem auto auto 0; width: 0.875rem; height: 0.875rem; background: no-repeat center/cover url('https://customcosmeticboxes.com/wp-content/themes/customcosmeticboxes/assets/images/icons/banner-list.svg'); filter: var(--filter-primary); content: '';}
.brand .content li:not(:last-child) {margin-bottom: 1rem;}
.brand .btn__primary {width: 195px; padding-block: 0.875rem; border-radius: 5px;}
.brand .gallery {display: grid; grid-template-columns: repeat(2, 1fr); gap: 1.25rem;}
.brand .gallery > :nth-child(3) {grid-column: span 2;}
.brand .gallery img {width: 100%;}

/* Why */
.why {padding-block: 2rem;}
.why .head {text-align: center; margin-bottom: 2.5rem;}
.why .head :first-child {font-size: var(--fs-lg, 32px); font-weight: 600; line-height: 1.2; margin-bottom: 1.25rem;}
.why .head p {max-height: 4.125rem;}
.why .wrapper {display: grid; grid-template-columns: repeat(4, 1fr); align-items: center; gap: 1.5rem;}
.why .card {height: 100%; box-shadow: var(--secondary-shdw); padding: 1.25rem; border-radius: 10px; box-shadow: var(--_shdw-primary);} 
.why .card > div {display: flex; align-items: center; gap: 1.875rem; margin-bottom: 0.625rem;}
.why .card p {font-size: var(--fs-base, 16px);}
.why .image {width: 74px; height: 72px; display: flex; justify-content: center; align-items: center; background-color: var(--_lgt-primary);}
.why .card > div > :nth-child(2) {font-size: var(--fs-sm, 20px); text-transform: capitalize; color: var(--c-heading);}

/* Testimonial */
.testimonial {padding-block: 3.5rem; background: no-repeat center/cover url('https://customcosmeticboxes.com/wp-content/themes/customcosmeticboxes/assets/images/test-back.webp');}
.testimonial .wrapper {display: grid; grid-template-columns: 30% 1fr; align-items: center; gap: 1.5rem;}
.testimonial .head > :first-child {font-size: calc(var(--fs-xl, 40px) - 2px); text-transform: capitalize;}
.testimonial .head > :first-child * {display: block; font-size: var(--fs-base, 16px); text-transform: capitalize; color: var(--c-primary); margin-bottom: 0.75rem;}
.testimonial .btn__primary {width: 156px; font-size: var(--fs-base, 16px); padding: 0.875rem 0.625rem; background-color: var(--c-lgt-primary);}
.testimonial .btn__primary:hover {background-color: var(--_c-lgt-primary);}
.testimonial .reviews {display: grid; grid-template-columns: repeat(2, 1fr); text-align: center; gap: 1rem; }
.testimonial .card {position: relative; display: flex; flex-direction: column; justify-content: center; align-items: center; background-color: #fff; padding: 5rem 1.25rem 1.25rem 1.25rem; border-radius: 0.625rem;}
.testimonial .card::before {position: absolute; inset: 16px 0 auto; width: 3.125rem; height: 2.75rem; background: no-repeat center/cover url('https://customcosmeticboxes.com/wp-content/themes/customcosmeticboxes/assets/images/icons/test-quote-icon.svg'); filter: var(--_fltr-red); content: ''; margin-inline: auto;}
.testimonial .card p {max-height: 120px; font-size: var(--fs-base, 16px); margin-bottom: 1.5rem;}
.testimonial .card > :nth-child(2) {font-size: var(--fs-sm, 20px); font-weight: 500; text-transform: capitalize; color: #000; margin-bottom: 0.25rem; margin-top: auto;} 
.testimonial .card > :nth-child(3) {font-size: var(--fs-base, 16px);}

/* Faq */
.faq {padding-block: 2.5rem;}
.faq .head {margin-bottom: 1.875rem;}
.faq .head > :first-child {font-size: calc(var(--fs-xl, 40px) - 2px); margin-bottom: 1rem;}
.faq .head > :first-child * {display: block; font-size: var(--fs-base, 16px); text-transform: capitalize; color: #626262; margin-bottom: 0.5rem;}
.faq .wrapper {display: grid; grid-template-columns: repeat(2, 1fr); align-items: center; gap: 2rem;}
.faq .head p {max-height: 4.5rem;}
.faq .content {max-height: 20rem; padding-left: 1.875rem;}
.faq .acc-btn {position: relative; width: 100%; color: var(--c-secondary); text-align: start; font-size: var(--fs-base, 16px); font-weight: 500; padding: 0 2rem 1rem 0;}
.faq .acc-btn {margin-bottom: 1rem;}
.faq .acc-item:last-child .acc-btn {margin-bottom: 0; border-bottom: none;}
.faq .acc-btn::after {position: absolute; inset: 0.125rem 0.5rem auto auto; width: 1rem; height: 1rem; background: no-repeat center/cover url('https://customcosmeticboxes.com/wp-content/themes/customcosmeticboxes/assets/images/icons/faq+.svg'); content: ''; filter: var(--filter-secondary);}
.faq .acc-btn.active::after {inset: 0.375rem 0.5rem auto auto; height: 4px; background-image: url('https://customcosmeticboxes.com/wp-content/themes/customcosmeticboxes/assets/images/icons/faq-.svg'); filter: var(--filter-primary);}
.faq .panel { padding: 0.25rem 1.875rem 1rem 0; display: none;}
.faq .acc-item:first-of-type .panel {display: block;}
.faq .acc-item:first-of-type .acc-btn {margin-bottom: 1rem;}
.faq .acc-item:first-of-type .acc-btn.active {margin-bottom: 0;}
.faq .acc-item .acc-btn.active {color: var(--c-heading);}
.faq .panel p {font-size: var(--fs-base, 16px); color: var(--c-text); margin-bottom: 0.5rem;}
.faq .panel :where(ul, ol) {padding-left: 1.125rem;}
.faq .panel :where(ul, ol) li {font-size: var(--fs-base, 16px);}
.faq .panel ul li {list-style: disc;}
.faq .panel ol li {list-style: auto;}
.faq .panel li:not(:last-child) {margin-bottom: 0.35rem;}
.faq .acc-btn.active + .panel {display: block; } 
.faq .acc-btn.active {margin-bottom: 0;}


/* Media Queries */
@media only screen and (max-width: 991px) {
    /* Banner */
    .banner .wrapper {grid-template-columns: 1fr;}
    .banner .content > :first-child {margin-bottom: 1rem;}
    .banner .content ul {margin-bottom: 1.25rem;}
    .banner .carousel-inner {text-align: center;}
    .banner .image img {margin-inline: auto;}
    .banner .btn__primary {padding: 0.75rem 1.5rem;}
    /* Process */
    .process {padding-block: 1.5rem}
    .process .head {margin-bottom: 1.875rem;}
    .process li {max-width: 17.5rem; margin-inline: auto;}
    /* Offers */
    .offers {padding-block: 1.5rem;}
    .offers .head {margin-bottom: 1.875rem;}
    .offers .wrapper {grid-template-columns: repeat(2, 1fr); gap: 1rem;}
    .offers .card {padding: 1.5rem 1.25rem; gap: 0.625rem;}
    /* Design */
    .design {padding-block: 1.5rem;}
    .design .head {margin-bottom: 1.875rem;}
    .design .wrapper {grid-template-columns: repeat(2, 1fr);}
    /* Quote */
    .quote .wrapper {grid-template-columns: 1fr;}
    .quote .form {order: 2;}
    .quote .content {order: 1;}
    .quote .content > :not(:last-child) {margin-bottom: 1rem;}
    .quote ul {gap: 1rem;}
    .quote ul:nth-of-type(2) {gap: 3.125rem;}
    .quote ul:nth-of-type(2) img {width: 4.125rem;}
    .quote .transparent {padding: 0.75rem 1.25rem;}
    /* Packaging */
    .packaging {padding-block: 1.5rem;}
    .packaging .wrapper {grid-template-columns: 1fr;}
    .packaging .features {grid-template-columns: repeat(2, 1fr);}
    .packaging img {width: fit-content; margin-inline: auto;}
    .packaging .content ul {gap: 1rem 0.75rem;}
    /* Benefits */
    .benefits {padding-block: 1.5rem;}
    .benefits .head {max-width: 48rem; margin-bottom: 1.875rem; margin-inline: auto;}
    .benefits .head :first-child {margin-bottom: 1rem;}
    .benefits ul {grid-template-columns: repeat(3, 1fr);}
    /* Brand */
    .brand {padding-block: 1.5rem;}
    .brand .wrapper {grid-template-columns: 1fr;}
    .brand .content > :first-child {margin-bottom: 0.75rem;}
    .brand .content > p:nth-of-type(2) {width: 60%;}
    .brand .content > ul {width: 40%;}
    .brand .btn__primary {width: 166px; padding-block: 0.75rem;}
    /* Why */
    .why {padding-block: 1.5rem;}
    .why .head {margin-bottom: 1.875rem;}
    .why .wrapper {grid-template-columns: repeat(2, 1fr); gap: 1rem;}
    /* Testimonial */
    .testimonial {padding-block: 2rem;}
    .testimonial .wrapper {grid-template-columns: 1fr;}
    .testimonial .card {padding-top: 4rem;}
    .testimonial .card::before {width: 2.5rem; height: 2.25rem;}
    /* Faq */
    .faq {padding-block: 1.75rem;}
    .faq .wrapper {grid-template-columns: 1fr; gap: 1.5rem;}
    .faq .image img {margin-inline: auto;}
    .faq .content {padding-left: 0;}
}
@media only screen and (max-width: 767px) {
    /* Process */
    .process ul {grid-template-columns: repeat(2, 1fr);}
    /* Offers */
    .offers .wrapper {grid-template-columns: 1fr;}
    .offers .card {max-width: 23.125rem; margin-inline: auto;}
    /* Design */
    .design .wrapper {grid-template-columns: 1fr; gap: 1.125rem;}
    .design .card {max-width: 23.125rem; margin-inline: auto;}
    /* Testimonial */
    .testimonial .head > :first-child {text-align: center;}
}
@media only screen and (max-width: 575px) {
    /* Banner */
    .banner .content > :first-child {margin-bottom: 0.75rem;}  
    .banner .content ul {margin-bottom: 0.875rem;}
    .banner .content li::before {width: 0.75rem; height: 0.75rem; inset: 0.375rem auto auto 0;}
    .banner .content p {margin-bottom: 1rem;}
    .banner .btns {gap: 0.75rem;}
    .banner .image img {width: 270px;}
    .banner .btn__primary {padding: 0.5rem;}
    /* Process */
    .process {padding-block: 1rem;}
    .process .head {margin-bottom: 1rem;}
    .process .head :first-child {margin-bottom: 0.75rem;}
    .process li {gap: 0.375rem;}
    .process li img {width: 2.75rem;}
    /* Offers */
    .offers {padding-block: 1rem;}
    .offers .head {margin-bottom: 1rem;}
    .offers .head :first-child {margin-bottom: 0.75rem;}
    /* Design */
    .design {padding-block: 1rem;}
    .design .head {margin-bottom: 1.5rem;}
    .design .head :first-child {margin-bottom: 0.75rem;}
    .design .card {gap: 0.75rem; padding: 0.75rem;}
    /* Quote */
    .quote .wrapper {gap: 1.5rem;}
    .quote ul:nth-of-type(1) {gap: 0.75rem;}
    .quote ul:nth-of-type(2) {gap: 1.875rem;}
    .quote ul:nth-of-type(2) img {width: 3.125rem;}
    .quote .orders {gap: 0.5rem; flex-wrap: wrap;}
    .quote .transparent {gap: 0.5rem; padding: 0.5rem;}
    .quote .transparent img {width: 0.875rem;}
    /* Packaging */
    .packaging {padding-block: 0.875rem;}
    .packaging .wrapper {gap: 1.25rem;}
    .packaging .content > :first-child {margin-bottom: 0.5rem;}
    .packaging .content > :first-child * {margin-bottom: 0.25rem;}
    .packaging .content p {margin-bottom: 0.75rem;}
    .packaging .content ul {gap: 0.75rem;}
    .packaging img {width: 20rem;}
    .packaging .features {grid-template-columns: 1fr; gap: 0.5rem;}
    .packaging .features li {padding-left: 3rem;}
    .packaging .features li::before {width: 2rem; height: 2rem;}
    /* Benefits */
    .benefits {padding-block: 1rem;}
    .benefits .head {margin-bottom: 1rem;}
    .benefits .head :first-child {margin-bottom: 0.75rem;}
    .benefits ul {grid-template-columns: repeat(2, 1fr); gap: 1rem;}
    .benefits li {gap: 0.75rem;}
    .benefits li div {width: 40px; height: 42px;}
    .benefits li div img {width: 34px;}
    /* Brand */
    .brand {padding-block: 1rem;}
    .brand .wrapper {gap: 1rem;}
    .brand .content > :first-child {margin-bottom: 0.5rem;}
    .brand .content > p {margin-bottom: 0.625rem;}
    .brand .content > p:nth-of-type(2) {width: 100%;}
    .brand .content > ul {width: 100%; margin-bottom: 1rem;}
    .brand .btn__primary {width: 140px; padding-block: 0.5rem;}
    .brand .gallery {gap: 0.75rem;}
    /* Why */
    .why {padding-block: 1rem;}
    .why .head {margin-bottom: 1rem;}
    .why .head :first-child {margin-bottom: 0.75rem;}
    .why .wrapper {gap: 0.875rem;}
    .why .card {padding: 14px;}
    .why .card > div {gap: 0.875rem;}
    .why .image {width: 56px; height: 44px;}
    .why .card img {width: 1.875rem;}
    /* Testimonial */
    .testimonial {padding-block: 1rem;}
    .testimonial .head > :first-child * {margin-bottom: 0.25rem;}
    .testimonial .wrapper {gap: 0.75rem;}
    .testimonial .reviews {grid-template-columns: 1fr;}
    .testimonial .card {padding: 3.5rem 1rem 1rem 1rem;}
    .testimonial .card::before {width: 2rem; height: 1.75rem;}
    .testimonial .card p {margin-bottom: 1rem;}
    /* Faq */
    .faq {padding-block: 1rem;}
    .faq .image img {width: 350px; margin-inline: auto;}
    .faq .head {margin-bottom: 0.75rem;}
    .faq .head > :first-child {margin-bottom: 0.5rem;}
    .faq .wrapper > img {width: 21.875rem;}
    .faq .acc-btn::after {width: 0.75rem; height: 0.75rem;}
    .faq .acc-btn.active::after {width: 0.75rem;}
    .faq .acc-btn {padding-bottom: 0.625rem; margin-bottom: 0.625rem;}
    .faq .panel {padding-bottom: 0.625rem;}
    .faq .acc-item:first-of-type .acc-btn {margin-bottom: 0.625rem;}
}
@media only screen and (max-width: 475px) {
    /* Banner */
    .banner .btns {flex-wrap: wrap;}
    /* Process */
    .process ul {grid-template-columns: 1fr; gap: 1rem;}
    /* Quote */
    .quote ul:nth-of-type(2) {gap: 1.25rem;}
    .quote ul:nth-of-type(1) li {padding-left: 1.5rem;}
    .quote ul:nth-of-type(1) li::before {width: 0.875rem;}
    .quote ul:nth-of-type(1) {grid-template-columns: 1fr; gap: 0.625rem;}
    /* Benefits */
    .benefits ul {gap: 0.75rem;}
    .benefits li {gap: 0.5rem;}
    /* Brand */
    .brand .content li:not(:last-child) {margin-bottom: 0.75rem;}
    /* Why */ 
    .why .wrapper {grid-template-columns: 1fr;}
}