.mh-before-after{padding-top:var(--mh-before-after-padding-top, 56px);padding-bottom:var(--mh-before-after-padding-bottom, 56px)}.mh-before-after__inner{max-width:calc(1280px + 2 * var(--mh-page-gutter))}.mh-before-after__card{display:flex;flex-direction:column;gap:var(--mh-space-6);padding:var(--mh-space-14);border:var(--mh-border-width-1) solid var(--mh-color-border-secondary);border-radius:var(--mh-radius-2xl);background:var(--mh-color-bg-primary)}.mh-before-after__card--brand{background:var(--mh-color-bg-brand)}.mh-before-after__card--secondary{background:var(--mh-color-bg-secondary)}.mh-before-after__card--custom{background:var(--mh-before-after-bg)}.mh-before-after__head{display:flex;flex-direction:column;gap:var(--mh-space-4)}.mh-before-after__title{color:var(--mh-color-text-primary);text-wrap:balance}.mh-before-after__subtitle{color:var(--mh-color-text-secondary);font-family:var(--mh-font-content);font-size:var(--mh-font-size-xl);line-height:1.6;letter-spacing:-.03em}.mh-before-after__body{display:grid;grid-template-columns:minmax(0,422fr) minmax(0,720fr);align-items:center;gap:var(--mh-space-6)}.mh-before-after__body:not(:has(.mh-before-after__results)){grid-template-columns:minmax(0,1fr)}.mh-before-after__compare{position:relative;display:block;aspect-ratio:720 / 520;overflow:hidden;border:var(--mh-border-width-8) solid var(--mh-color-core-white);border-radius:var(--mh-radius-3xl);background:var(--mh-color-bg-tertiary);-webkit-user-select:none;user-select:none}.mh-before-after__image{position:absolute;top:0;right:0;bottom:0;left:0;width:100%;height:100%;object-fit:cover;pointer-events:none}.mh-before-after__after{position:absolute;top:0;right:0;bottom:0;left:0;clip-path:inset(0 0 0 var(--mh-ba-position))}.mh-before-after__line{position:absolute;top:0;bottom:0;left:var(--mh-ba-position);width:2px;background:var(--mh-color-core-white);transform:translate(-50%);pointer-events:none}.mh-before-after__handle{position:absolute;top:50%;left:50%;display:flex;align-items:center;justify-content:center;width:48px;height:48px;border-radius:var(--mh-radius-full);background:var(--mh-color-core-white);color:var(--mh-color-text-primary);transform:translate(-50%,-50%)}.mh-before-after__label{position:absolute;top:var(--mh-space-3);z-index:1;pointer-events:none}.mh-before-after__label--before{left:var(--mh-space-3)}.mh-before-after__label--after{right:var(--mh-space-3)}.mh-before-after__range{position:absolute;top:0;right:0;bottom:0;left:0;z-index:2;width:100%;height:100%;margin:0;opacity:0;cursor:ew-resize;-webkit-appearance:none;appearance:none}.mh-before-after__compare:has(.mh-before-after__range:focus-visible) .mh-before-after__handle{box-shadow:var(--mh-shadow-btn-focus-primary)}.mh-before-after__results{display:flex;flex-direction:column;gap:var(--mh-space-5)}.mh-before-after__stats{display:flex;flex-direction:column;gap:var(--mh-space-3);margin:0;padding:0;list-style:none}.mh-before-after__stat{display:flex;flex-direction:column;gap:var(--mh-space-1);padding:var(--mh-space-6);border:var(--mh-border-width-1) solid var(--mh-color-border-secondary);border-radius:var(--mh-radius-2xl);background:var(--mh-color-bg-primary)}.mh-before-after__figure{color:var(--mh-color-text-brand)}.mh-before-after__text{color:var(--mh-color-text-secondary);font-family:var(--mh-font-content);font-size:var(--mh-font-size-md);line-height:1.6;letter-spacing:-.03em}.mh-before-after__mention{color:var(--mh-color-text-secondary);font-family:var(--mh-font-content);font-size:var(--mh-font-size-xs);line-height:1.4;letter-spacing:-.01em}@media(max-width:1023px){.mh-before-after__card{padding:var(--mh-space-10)}.mh-before-after__body{grid-template-columns:minmax(0,1fr)}.mh-before-after__compare{order:-1}}@media(max-width:767px){.mh-before-after{padding-top:min(var(--mh-before-after-padding-top, 56px),8px);padding-bottom:min(var(--mh-before-after-padding-bottom, 56px),8px)}.mh-before-after__card{gap:var(--mh-space-4);padding:var(--mh-space-10) var(--mh-space-5) var(--mh-space-8)}.mh-before-after__card .mh-surface__watermark{display:none}.mh-before-after__head{gap:var(--mh-space-2);text-align:center}.mh-before-after__body{gap:var(--mh-space-4)}.mh-before-after__stats{gap:6px}.mh-before-after__results{gap:var(--mh-space-2)}.mh-before-after__compare{aspect-ratio:334 / 272;border-width:var(--mh-border-width-4);border-radius:var(--mh-radius-2xl)}.mh-before-after__label{top:var(--mh-space-2)}.mh-before-after__label--before{left:var(--mh-space-2)}.mh-before-after__label--after{right:var(--mh-space-2)}.mh-before-after__line{width:1px}.mh-before-after__handle{width:25px;height:25px}.mh-before-after__handle .mh-icon{width:8px;height:8px}.mh-before-after__stat{flex-direction:row;align-items:center;gap:var(--mh-space-3);padding:var(--mh-space-3);border-radius:var(--mh-radius-xl)}.mh-before-after__figure{flex-shrink:0;text-box:trim-both cap alphabetic}}.mh-before-after__image--placeholder{background:var(--mh-color-bg-secondary);fill:var(--mh-color-text-tertiary)}
/*# sourceMappingURL=/cdn/shop/t/126/assets/mh-product-before-after.css.map */