.before-after-section{background:var(--bg-color);color:var(--text-color)}.before-after-section--bg{background:var(--bg-color)}.before-after__title{margin-bottom:.25em}.before-after__subtitle{margin:0;opacity:.75}.before-after__grid{display:grid;grid-template-columns:1fr;gap:16px;margin-top:20px}@media screen and (min-width: 768px){.before-after__grid--cols-2{grid-template-columns:repeat(2,1fr)}.before-after__grid--cols-3{grid-template-columns:repeat(3,1fr)}}.before-after__card{background:var(--card-bg);border:1px solid var(--border-color);border-radius:14px;padding:14px;display:flex;flex-direction:column}.before-after__images{order:1}.before-after__review{order:2}.before-after__meta{order:3;margin-top:auto;padding-top:8px}.before-after__review{color:var(--text-color);font-size:15px;line-height:1.55;margin:10px 2px 8px}.before-after__images{display:grid;grid-template-columns:1fr 1fr;gap:8px}@media screen and (max-width: 767px){.before-after__images{grid-template-columns:1fr 1fr;gap:6px}}.before-after__image{position:relative;border-radius:12px;overflow:hidden;background:#f2f2f2;border:1px solid var(--border-color);margin:auto}.before-after__image img{display:block;width:100%;height:320px;object-fit:cover}@media screen and (max-width: 767px){.before-after__image img{height:200px}}.before-after__placeholder{width:100%;height:320px}@media screen and (max-width: 767px){.before-after__placeholder{height:200px}}.before-after__badge{position:absolute;top:10px;left:10px;z-index:1;background:var(--accent-color);color:#fff;padding:6px 10px;border-radius:999px;font-size:12px;letter-spacing:.4px}.before-after__meta{display:flex;align-items:center;justify-content:space-between;gap:10px}.before-after__stars .star{color:#ddd;font-size:15px;line-height:1}.before-after__stars .star--filled{color:var(--accent-color)}.before-after__author{text-align:right}.before-after__author .author{margin:0;font-weight:600;text-transform:uppercase;letter-spacing:.5px;font-size:12px;color:var(--text-color)}.before-after__author .date{margin:0;font-size:11px;opacity:.7;color:var(--text-color)}.before-after__card:hover{box-shadow:0 6px 18px #00000014}
/*# sourceMappingURL=/cdn/shop/t/67/assets/section-before-after.css.map */
