


/* Banner */
.banner {background: var(--_c-grad-primary); padding-block: 2rem;}
.banner .wrapper {display: grid; grid-template-columns: repeat(2, 1fr); gap: 4rem;}
.banner .content > :first-child {font-size: var(--fs-xxl, 46px); text-transform: capitalize; margin-bottom: 1rem;}
.banner .content > :first-child * {display: block; font-size: calc(var(--fs-base, 16px) + 2px); font-weight: 500; margin-bottom: 0.5rem;}
.banner .content p:not(:last-of-type) {margin-bottom: 1.5rem;}
.banner .image img {margin: auto;}

/* Media Queries */
@media only screen and (max-width: 1200px) {
    /* Banner */
    .banner .wrapper {gap: 2rem;}
}
@media only screen and (max-width: 991px) {
    /* Banner */
    .banner {padding-block: 1.5rem;}
    .banner .wrapper {grid-template-columns: 1fr; gap: 1.5rem;}
    .banner .content > :first-child {margin-bottom: 0.75rem;}
    .banner .content p:not(:last-of-type) {margin-bottom: 1rem;}
}
@media only screen and (max-width: 575px) {
    /* Banner */
    .banner {padding-block: 1rem;}
    .banner .wrapper {margin-bottom: 1rem;}
    .banner .content > :first-child {margin-bottom: 0.5rem;}
    .banner .content > :first-child * {margin-bottom: 0.25rem;}
    .banner .content p:not(:last-of-type) {margin-bottom: 0.5rem;}
}

/* Tuck */
.tuck {padding-block: 2rem;}
.tuck[data-bg="true"]{background-color: var(--_c-lgt-primary);}
.tuck .wrapper {display: grid; grid-template-columns: 598px 1fr; gap: 3rem;}
.tuck .image img {margin: auto;}
.tuck .content > :first-child {font-size: var(--fs-xxl, 46px); text-transform: capitalize; margin-bottom: 1rem;}
.tuck .content > :first-child * {display: block; font-size: calc(var(--fs-base, 16px) + 2px); font-weight: 700; margin-bottom: 0.5rem;}
.tuck .content p:not(:last-of-type) {margin-bottom: 1rem;}
.tuck .content p:last-of-type {margin-bottom: 2rem;}
.tuck .content a {position: relative; text-wrap: wrap; margin-left: auto; padding: 0.625rem 1.75rem; border-radius: 3px;}
.tuck .content a::before {position: absolute; inset: 0 12px 0 auto; width: 0.375rem; height: 0.625rem; background: no-repeat center/cover url('https://customcosmeticboxes.com/wp-content/themes/customcosmeticboxes/assets/images/icons/chevron-right.svg'); content: ''; margin-block: auto;}    
/* Media Queries */
@media only screen and (max-width: 1200px) {
    /* Tuck */
    .tuck .wrapper {gap: 1.5rem;}
}
@media only screen and (max-width: 991px) {
    /* Tuck */
    .tuck {padding-block: 1.5rem;}
    .tuck .wrapper {grid-template-columns: 1fr;}
    .tuck .image {order: 2;}
    .tuck .content {order: 1;}
    .tuck .content > :first-child {margin-bottom: 0.75rem;}
    .tuck .content p:last-of-type {margin-bottom: 1.25rem;}
    .tuck .content a {padding: 0.5rem 1.25rem;}
    .tuck .content a::before {right: 8px;}
}
@media only screen and (max-width: 575px) {
    /* Tuck */
    .tuck {padding-block: 1rem;}
    .tuck .wrapper {margin-bottom: 1rem;}
    .tuck .content > :first-child {margin-bottom: 0.5rem;}
    .tuck .content p:not(:last-of-type) {margin-bottom: 0.625rem;}
    .tuck .content p:last-of-type {margin-bottom: 0.75rem;}
    .tuck .content a {padding: 0.375rem 0.625rem;}
    .tuck .content a::before {right: 3px; width: 0.25rem;}
}

/* Reverse */
.reverse {padding-block: 2rem;}
.reverse[data-bg="true"]{background-color: var(--_c-lgt-primary);}
.reverse .wrapper {display: grid; grid-template-columns: 1fr 598px; gap: 3rem;}
.reverse .image img {margin: auto;}
.reverse .content > :first-child {font-size: var(--fs-xxl, 46px); text-transform: capitalize; margin-bottom: 1rem;}
.reverse .content > :first-child * {display: block; font-size: calc(var(--fs-base, 16px) + 2px); font-weight: 700; margin-bottom: 0.5rem;}
.reverse .content p:not(:last-of-type) {margin-bottom: 1rem;}
.reverse .content p:last-of-type {margin-bottom: 2rem;}
.reverse .content a {position: relative; text-wrap: wrap; margin-left: auto; padding: 0.625rem 1.75rem; border-radius: 3px;}
.reverse .content a::before {position: absolute; inset: 0 12px 0 auto; width: 0.375rem; height: 0.625rem; background: no-repeat center/cover url('https://customcosmeticboxes.com/wp-content/themes/customcosmeticboxes/assets/images/icons/chevron-right.svg'); content: ''; margin-block: auto;}    
/* Media Queries */
@media only screen and (max-width: 1200px) {
    /* Reverse */
    .reverse .wrapper {gap: 1.5rem;}
}
@media only screen and (max-width: 991px) {
    /* Reverse */
    .reverse {padding-block: 1.5rem;}
    .reverse .wrapper {grid-template-columns: 1fr;}
    .reverse .image {order: 2;}
    .reverse .content {order: 1;}
    .reverse .content > :first-child {margin-bottom: 0.75rem;}
    .reverse .content p:last-of-type {margin-bottom: 1.25rem;}
    .reverse .content a {padding: 0.5rem 1.25rem;}
    .reverse .content a::before {right: 8px;}
}
@media only screen and (max-width: 575px) {
    /* Reverse */
    .reverse {padding-block: 1rem;}
    .reverse .wrapper {margin-bottom: 1rem;}
    .reverse .content > :first-child {margin-bottom: 0.5rem;}
    .reverse .content p:not(:last-of-type) {margin-bottom: 0.625rem;}
    .reverse .content p:last-of-type {margin-bottom: 0.75rem;}
    .reverse .content a {padding: 0.375rem 0.625rem;}
    .reverse .content a::before {right: 3px; width: 0.25rem;}
}

/* Crash */
.crash {padding-block: 2rem;}
.crash[data-bg="true"]{background-color: var(--_c-lgt-primary);}
.crash .wrapper {display: grid; grid-template-columns: 1fr 598px; gap: 3rem;}
.crash .image img {margin: auto;}
.crash .content > :first-child {font-size: var(--fs-xxl, 46px); text-transform: capitalize; margin-bottom: 1rem;}
.crash .content > :first-child * {display: block; font-size: calc(var(--fs-base, 16px) + 2px); font-weight: 700; margin-bottom: 0.5rem;}
.crash .content p:not(:last-of-type) {margin-bottom: 1rem;}
.crash .content p:last-of-type {margin-bottom: 2rem;}
.crash .content a {position: relative; text-wrap: wrap; margin-left: auto; padding: 0.625rem 1.75rem; border-radius: 3px;}
.crash .content a::before {position: absolute; inset: 0 12px 0 auto; width: 0.375rem; height: 0.625rem; background: no-repeat center/cover url('https://customcosmeticboxes.com/wp-content/themes/customcosmeticboxes/assets/images/icons/chevron-right.svg'); content: ''; margin-block: auto;}
    
/* Media Queries */
@media only screen and (max-width: 1200px) {
    /* Crash */
    .crash .wrapper {gap: 1.5rem;}
}
@media only screen and (max-width: 991px) {
    /* Crash */
    .crash {padding-block: 1.5rem;}
    .crash .wrapper {grid-template-columns: 1fr;}
    .crash .image {order: 2;}
    .crash .content {order: 1;}
    .crash .content > :first-child {margin-bottom: 0.75rem;}
    .crash .content p:last-of-type {margin-bottom: 1.25rem;}
    .crash .content a {padding: 0.5rem 1.25rem;}
    .crash .content a::before {right: 8px;}
}
@media only screen and (max-width: 575px) {
    /* Crash */
    .crash {padding-block: 1rem;}
    .crash .wrapper {margin-bottom: 1rem;}
    .crash .content > :first-child {margin-bottom: 0.5rem;}
    .crash .content p:not(:last-of-type) {margin-bottom: 0.625rem;}
    .crash .content p:last-of-type {margin-bottom: 0.75rem;}
    .crash .content a {padding: 0.375rem 0.625rem;}
    .crash .content a::before {right: 3px; width: 0.25rem;}
}

/* Lock */
.lock {padding-block: 2rem;}
.lock[data-bg="true"]{background-color: var(--_c-lgt-primary);}
.lock .wrapper {display: grid; grid-template-columns: 598px 1fr; gap: 3rem;}
.lock .image img {margin: auto;}
.lock .content > :first-child {font-size: var(--fs-xxl, 46px); text-transform: capitalize; margin-bottom: 1rem;}
.lock .content > :first-child * {display: block; font-size: calc(var(--fs-base, 16px) + 2px); font-weight: 700; margin-bottom: 0.5rem;}
.lock .content p:not(:last-of-type) {margin-bottom: 1rem;}
.lock .content p:last-of-type {margin-bottom: 2rem;}
.lock .content a {position: relative; text-wrap: wrap; margin-left: auto; padding: 0.625rem 1.75rem; border-radius: 3px;}
.lock .content a::before {position: absolute; inset: 0 12px 0 auto; width: 0.375rem; height: 0.625rem; background: no-repeat center/cover url('https://customcosmeticboxes.com/wp-content/themes/customcosmeticboxes/assets/images/icons/chevron-right.svg'); content: ''; margin-block: auto;}
    
/* Media Queries */
@media only screen and (max-width: 1200px) {
    /* Lock */
    .lock .wrapper {gap: 1.5rem;}
}
@media only screen and (max-width: 991px) {
    /* Lock */
    .lock {padding-block: 1.5rem;}
    .lock .wrapper {grid-template-columns: 1fr;}
    .lock .image {order: 2;}
    .lock .content {order: 1;}
    .lock .content > :first-child {margin-bottom: 0.75rem;}
    .lock .content p:last-of-type {margin-bottom: 1.25rem;}
    .lock .content a {padding: 0.5rem 1.25rem;}
    .lock .content a::before {right: 8px;}
}
@media only screen and (max-width: 575px) {
    /* Lock */
    .lock {padding-block: 1rem;}
    .lock .wrapper {margin-bottom: 1rem;}
    .lock .content > :first-child {margin-bottom: 0.5rem;}
    .lock .content p {margin-bottom: 0.625rem;}
    .lock .content p:last-of-type {margin-bottom: 0.75rem;}
    .lock .content a {padding: 0.375rem 0.625rem;}
    .lock .content a::before {right: 3px; width: 0.25rem;}
}
/* Holster */
.holster {padding-block: 2rem;}
.holster [data-bg="true"]{background-color: var(--_c-lgt-primary);}
.holster .wrapper {display: grid; grid-template-columns: 598px 1fr; gap: 3rem;}
.holster .image img {margin: auto;}
.holster .content > :first-child {font-size: var(--fs-xxl, 46px); text-transform: capitalize; margin-bottom: 1rem;}
.holster .content > :first-child * {display: block; font-size: calc(var(--fs-base, 16px) + 2px); font-weight: 700; margin-bottom: 0.5rem;}
.holster .content p:not(:last-of-type) {margin-bottom: 1rem;}
.holster .content p:last-of-type {margin-bottom: 2rem;}
.holster .content a {position: relative; text-wrap: wrap; margin-left: auto; padding: 0.625rem 1.75rem; border-radius: 3px;}
.holster .content a::before {position: absolute; inset: 0 12px 0 auto; width: 0.375rem; height: 0.625rem; background: no-repeat center/cover url('https://customcosmeticboxes.com/wp-content/themes/customcosmeticboxes/assets/images/icons/chevron-right.svg'); content: ''; margin-block: auto;}
    
/* Media Queries */
@media only screen and (max-width: 1200px) {
    /* Holster */
    .holster .wrapper {gap: 1.5rem;}
}
@media only screen and (max-width: 991px) {
    /* Holster */
    .holster {padding-block: 1.5rem;}
    .holster .wrapper {grid-template-columns: 1fr;}
    .holster .image {order: 2;}
    .holster .content {order: 1;}
    .holster .content > :first-child {margin-bottom: 0.75rem;}
    .holster .content p:last-of-type {margin-bottom: 1.25rem;}
    .holster .content a {padding: 0.5rem 1.25rem;}
    .holster .content a::before {right: 8px;}
}
@media only screen and (max-width: 575px) {
    /* Holster */
    .holster {padding-block: 1rem;}
    .holster .wrapper {margin-bottom: 1rem;}
    .holster .content > :first-child {margin-bottom: 0.5rem;}
    .holster .content p:not(:last-of-type) {margin-bottom: 0.625rem;}
    .holster .content p:last-of-type {margin-bottom: 0.75rem;}
    .holster .content a {padding: 0.375rem 0.625rem;}
    .holster .content a::before {right: 3px; width: 0.25rem;}
}
/* Top */
.top {padding-block: 2rem; background-color: var(--_c-lgt-primary);}
.top [data-bg="true"]{background-color: var(--_c-lgt-primary);}
.top .wrapper {display: grid; grid-template-columns: 1fr 598px; gap: 3rem;}
.top .image img {margin: auto;}
.top .content > :first-child {font-size: var(--fs-xxl, 46px); text-transform: capitalize; margin-bottom: 1rem;}
.top .content > :first-child * {display: block; font-size: calc(var(--fs-base, 16px) + 2px); font-weight: 700; margin-bottom: 0.5rem;}
.top .content p:not(:last-of-type) {margin-bottom: 1rem;}
.top .content p:last-of-type {margin-bottom: 2rem;}
.top .content a {position: relative; text-wrap: wrap; margin-left: auto; padding: 0.625rem 1.75rem; border-radius: 3px;}
.top .content a::before {position: absolute; inset: 0 12px 0 auto; width: 0.375rem; height: 0.625rem; background: no-repeat center/cover url('https://customcosmeticboxes.com/wp-content/themes/customcosmeticboxes/assets/images/icons/chevron-right.svg'); content: ''; margin-block: auto;}
    
/* Media Queries */
@media only screen and (max-width: 1200px) {
    /* Top */
    .top .wrapper {gap: 1.5rem;}
}
@media only screen and (max-width: 991px) {
    /* Top */
    .top {padding-block: 1.5rem;}
    .top .wrapper {grid-template-columns: 1fr;}
    .top .image {order: 2;}
    .top .content {order: 1;}
    .top .content > :first-child {margin-bottom: 0.75rem;}
    .top .content p:last-of-type {margin-bottom: 1.25rem;}
    .top .content a {padding: 0.5rem 1.25rem;}
    .top .content a::before {right: 8px;}
}
@media only screen and (max-width: 575px) {
    /* Top */
    .top {padding-block: 1rem;}
    .top .wrapper {margin-bottom: 1rem;}
    .top .content > :first-child {margin-bottom: 0.5rem;}
    .top .content p:not(:last-of-type) {margin-bottom: 0.625rem;}
    .top .content p:last-of-type {margin-bottom: 0.75rem;}
    .top .content a {padding: 0.375rem 0.625rem;}
    .top .content a::before {right: 3px; width: 0.25rem;}
}
/* Sleeve */
.sleeve  {padding-block: 2rem;}
.sleeve [data-bg="true"]{background-color: var(--_c-lgt-primary);}
.sleeve  .wrapper {display: grid; grid-template-columns: 598px 1fr; gap: 3rem;}
.sleeve  .image img {margin: auto;}
.sleeve  .content > :first-child {font-size: var(--fs-xxl, 46px); text-transform: capitalize; margin-bottom: 1rem;}
.sleeve  .content > :first-child * {display: block; font-size: calc(var(--fs-base, 16px) + 2px); font-weight: 700; margin-bottom: 0.5rem;}
.sleeve  .content p:not(:last-of-type) {margin-bottom: 1rem;}
.sleeve .content p:last-of-type {margin-bottom: 2rem;}
.sleeve  .content a {position: relative; text-wrap: wrap; margin-left: auto; padding: 0.625rem 1.75rem; border-radius: 3px;}
.sleeve  .content a::before {position: absolute; inset: 0 12px 0 auto; width: 0.375rem; height: 0.625rem; background: no-repeat center/cover url('https://customcosmeticboxes.com/wp-content/themes/customcosmeticboxes/assets/images/icons/chevron-right.svg'); content: ''; margin-block: auto;}
    
/* Media Queries */
@media only screen and (max-width: 1200px) {
    /* Sleeve */
    .sleeve  .wrapper {gap: 1.5rem;}
}
@media only screen and (max-width: 991px) {
    /* Sleeve */
    .sleeve  {padding-block: 1.5rem;}
    .sleeve  .wrapper {grid-template-columns: 1fr;}
    .sleeve  .image {order: 2;}
    .sleeve  .content {order: 1;}
    .sleeve  .content > :first-child {margin-bottom: 0.75rem;}
    .sleeve .content p:last-of-type {margin-bottom: 1.25rem;}
    .sleeve  .content a {padding: 0.5rem 1.25rem;}
    .sleeve  .content a::before {right: 8px;}
}
@media only screen and (max-width: 575px) {
    /* Sleeve */
    .sleeve {padding-block: 1rem;}
    .sleeve .wrapper {margin-bottom: 1rem;}
    .sleeve .content > :first-child {margin-bottom: 0.5rem;}
    .sleeve .content p:not(:last-of-type) {margin-bottom: 0.625rem;}
    .sleeve .content p:last-of-type {margin-bottom: 0.75rem;}
    .sleeve .content a {padding: 0.375rem 0.625rem;}
    .sleeve .content a::before {right: 3px; width: 0.25rem;}
}


/* Piece */
.piece {padding-block: 2rem;}
.piece[data-bg="true"]{background-color: var(--_c-lgt-primary);}
.piece .wrapper {display: grid; grid-template-columns: 1fr 598px; gap: 3rem;}
.piece .image img {margin: auto;}
.piece .content > :first-child {font-size: var(--fs-xxl, 46px); text-transform: capitalize; margin-bottom: 1rem;}
.piece .content > :first-child * {display: block; font-size: calc(var(--fs-base, 16px) + 2px); font-weight: 700; margin-bottom: 0.5rem;}
.piece .content p:not(:last-of-type) {margin-bottom: 1rem;}
.piece .content p:last-of-type {margin-bottom: 2rem;}
.piece .content a {position: relative; text-wrap: wrap; margin-left: auto; padding: 0.625rem 1.75rem; border-radius: 3px;}
.piece .content a::before {position: absolute; inset: 0 12px 0 auto; width: 0.375rem; height: 0.625rem; background: no-repeat center/cover url('https://customcosmeticboxes.com/wp-content/themes/customcosmeticboxes/assets/images/icons/chevron-right.svg'); content: ''; margin-block: auto;}
    
/* Media Queries */
@media only screen and (max-width: 1200px) {
    /* Piece */
    .piece .wrapper {gap: 1.5rem;}
}
@media only screen and (max-width: 991px) {
    /* Piece */
    .piece {padding-block: 1.5rem;}
    .piece .wrapper {grid-template-columns: 1fr;}
    .piece .image {order: 2;}
    .piece .content {order: 1;}
    .piece .content > :first-child {margin-bottom: 0.75rem;}
    .piece .content p:last-of-type {margin-bottom: 1.25rem;}
    .piece .content a {padding: 0.5rem 1.25rem;}
    .piece .content a::before {right: 8px;}
}
@media only screen and (max-width: 575px) {
    /* Piece */
    .piece {padding-block: 1rem;}
    .piece .wrapper {margin-bottom: 1rem;}
    .piece .content > :first-child {margin-bottom: 0.5rem;}
    .piece .content p:not(:last-of-type) {margin-bottom: 0.625rem;}
    .piece .content p:last-of-type {margin-bottom: 0.75rem;}
    .piece .content a {padding: 0.375rem 0.625rem;}
    .piece .content a::before {right: 3px; width: 0.25rem;}
}

/* Details */
.details {padding-block: 2rem;}
.details .content {max-width: 882px; margin-bottom: 2rem;}
.details .content :where(h2, h3, h4, h5, h6) {font-weight: 600; color: var(--c-heading); text-transform: capitalize; margin-bottom: 1.25rem;}
.details .content h2 {font-size: var(--fs-lg, 32px)}
.details .content h3 {font-size: calc(var(--fs-md, 24px) + 4px);}
.details .content h4 {font-size: var(--fs-sm, 24px)}
.details .content h5 {font-size: var(--fs-sm, 20px);}
.details .content h6 {font-size: var(--fs-base, 16px);}
.details .content :where(ul, ol) {padding-left: 2.5rem; margin-bottom: 1rem;}
.details .content :where(ul, ol) li {font-size: var(--fs-base, 16px); line-height: 1.5;}
.details .content ul li {list-style: disc;}
.details .content ol li {list-style: auto;}
.details .content li:not(:last-child) {margin-bottom: 0.25rem;}
.details .content p {font-size: var(--fs-base, 16x); padding-left: 0.75rem;}
.details .content p a {display: inline; font-size: var(--fs-base, 16px); color: var(--c-primary);}
.details .content p:not(:last-of-type) { margin-bottom: 1rem;}
.details .content p strong {font-size: var(--fs-base, 16px); text-transform: capitalize; color: var(--c-text);}
.details .btn__primary {position: relative; text-transform: uppercase; text-wrap: wrap; padding: 0.625rem 2.625rem; border-radius: 3px;}
.details .btn__primary::before {position: absolute; inset: 0 20px 0 auto; width: 0.375rem; height: 0.625rem; background: no-repeat center/cover url('https://customcosmeticboxes.com/wp-content/themes/customcosmeticboxes/assets/images/icons/chevron-right.svg'); content: ''; margin-block: auto;}

/* Media Queries */
@media only screen and (max-width: 991px) {
     /* Details */
    .details {padding-block: 1.25rem;}
    .details .content {margin-bottom: 1.25rem;}
    .details .btn__primary {padding-inline: 1.625rem;}
    .details .btn__primary::before {right: 12px;}
}
@media only screen and (max-width: 575px) {
     /* Details */
    .details {padding-block: 0.75rem;}
    .details .content {margin-bottom: 0.75rem;}
    .details .content :is(h2, h3, h4, h5, h6) {margin-bottom: 0.5rem;}
    .details .content :where(ul, ol) {padding-left: 1.125rem; margin-bottom: 0.625rem;}
    .details .content p {padding-left: 0;}
    .details .content p:not(:last-of-type) {margin-bottom: 0.5rem;}
    .details .btn__primary {padding: 0.5rem 1rem;}
.details .btn__primary::before {width: 0.25rem; right: 6px;} 
}