.dashcam-clarity{background-color:#000;color:#fff;overflow:hidden}.dashcam-clarity .page-width{padding-left:1.6rem;padding-right:1.6rem}@media screen and (min-width:750px){.dashcam-clarity .page-width{padding-left:3rem;padding-right:3rem}}.dashcam-clarity__grid{display:grid;grid-template-columns:1fr;gap:2.4rem;align-items:center}@media screen and (min-width:990px){.dashcam-clarity__grid{grid-template-columns:minmax(0,.95fr) minmax(0,1.05fr);gap:3.2rem 4.8rem}}.dashcam-clarity__content{display:flex;flex-direction:column;align-items:flex-start;gap:1.4rem;min-width:0}@media screen and (min-width:750px){.dashcam-clarity__content{gap:1.8rem;max-width:52rem}}.dashcam-clarity__badge{display:inline-flex;align-items:center;gap:.55rem;margin:0;padding:.55rem 1.2rem;font-size:.78rem;font-weight:600;letter-spacing:.14em;text-transform:uppercase;color:#fff;border:.1rem solid rgba(255,255,255,.85);border-radius:.25rem;line-height:1.4}@media screen and (min-width:750px){.dashcam-clarity__badge{font-size:.85rem;padding:.6rem 1.4rem}}.dashcam-clarity__badge-icon{display:inline-block;width:.55rem;height:.55rem;border-radius:50%;background:var(--dashcam-accent, #6cbd45);box-shadow:0 0 .6rem #6cbd45a6;flex-shrink:0}.dashcam-clarity__heading{margin:0;font-family:var(--font-heading-family);font-size:clamp(2.6rem,6vw,4.8rem);line-height:1.08;font-weight:800;letter-spacing:-.02em;text-transform:uppercase;color:transparent}.dashcam-clarity__heading-line{display:block;color:#fff}.dashcam-clarity__heading-line--accent{color:var(--dashcam-accent, #6cbd45);font-size:clamp(3rem,7vw,4rem);line-height:1.1;letter-spacing:-.01em}.dashcam-clarity__subtext{margin:0;font-size:clamp(1.25rem,2.2vw,1.5rem);line-height:1.55;color:#ffffffe0;max-width:42rem}.dashcam-clarity__cta{display:inline-flex;align-items:stretch;margin-top:.4rem;text-decoration:none;color:#fff;border:.1rem solid rgba(255,255,255,.85);border-radius:.25rem;overflow:hidden;transition:border-color .25s ease,color .25s ease,transform .25s ease}.dashcam-clarity__cta:hover{border-color:var(--dashcam-accent, #6cbd45);color:#fff;transform:translateY(-.1rem)}.dashcam-clarity__cta--static{cursor:default;opacity:.75}.dashcam-clarity__cta-label{display:inline-flex;align-items:center;padding:.95rem 1.4rem;font-size:.95rem;font-weight:600;letter-spacing:.12em;text-transform:uppercase}@media screen and (min-width:750px){.dashcam-clarity__cta-label{padding:1.05rem 1.6rem;font-size:1rem}}.dashcam-clarity__cta-icon{display:inline-flex;align-items:center;justify-content:center;padding:0 1rem;border-left:.1rem solid rgba(255,255,255,.85);transition:border-color .25s ease}.dashcam-clarity__cta:hover .dashcam-clarity__cta-icon{border-left-color:var(--dashcam-accent, #6cbd45)}.dashcam-clarity__cta-icon svg{width:1.2rem;height:1.2rem}.dashcam-clarity__media{min-width:0;width:100%}.dashcam-image-compare{position:relative;width:100%}.dashcam-image-compare__media{position:relative;width:100%;max-width:100%;aspect-ratio:21 / 9;height:auto;min-height:0;overflow:hidden;border-radius:1rem;border:.1rem solid rgba(255,255,255,.12);background:#111;-webkit-user-select:none;user-select:none;touch-action:none;cursor:ew-resize}@media screen and (min-width:750px){.dashcam-image-compare__media{border-radius:1.2rem}}.dashcam-image-compare__layer{position:absolute;top:0;right:0;bottom:0;left:0;overflow:hidden}.dashcam-image-compare__layer--after{z-index:0}.dashcam-image-compare__layer--before{z-index:1;clip-path:inset(0 50% 0 0)}.dashcam-image-compare__image{display:block;width:100%;height:100%;object-fit:cover;object-position:center;pointer-events:none}.dashcam-image-compare__layer .placeholder-svg{width:100%;height:100%;object-fit:cover;display:block}.dashcam-image-compare__label{position:absolute;z-index:2;max-width:calc(50% - 2rem);pointer-events:none}.dashcam-image-compare__label--before{top:1.2rem;left:1.2rem}.dashcam-image-compare__label--after{top:1.2rem;right:1.2rem;text-align:right}@media screen and (min-width:750px){.dashcam-image-compare__label--before,.dashcam-image-compare__label--after{top:1.6rem}.dashcam-image-compare__label--before{left:1.6rem}.dashcam-image-compare__label--after{right:1.6rem}}.dashcam-image-compare__label-title{margin:0;font-size:clamp(1rem,2vw,1.25rem);font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:#fff;line-height:1.2}.dashcam-image-compare__label-text{margin:.35rem 0 0;font-size:clamp(.85rem,1.6vw,1rem);line-height:1.4;color:#ffffffd1}.dashcam-image-compare__line{position:absolute;top:0;bottom:0;left:50%;width:.2rem;transform:translate(-50%);z-index:3;pointer-events:none}.dashcam-image-compare__line:before{content:"";position:absolute;top:0;right:0;bottom:0;left:0;background:linear-gradient(to bottom,transparent 0%,rgba(255,255,255,.3) 15%,rgba(255,255,255,.95) 40%,rgba(255,255,255,.95) 60%,rgba(255,255,255,.3) 85%,transparent 100%);box-shadow:0 0 1.2rem #00000073}.dashcam-image-compare__knob{position:absolute;top:50%;left:50%;z-index:5;display:flex;align-items:center;justify-content:center;width:3.6rem;height:3.6rem;padding:0;margin:0;border:.15rem solid rgba(255,255,255,.9);border-radius:50%;background:#fff;color:#121923;transform:translate(-50%,-50%);cursor:grab;touch-action:none;pointer-events:auto;-webkit-user-select:none;user-select:none;box-shadow:0 .4rem 1.6rem #00000059;transition:transform .2s ease,box-shadow .2s ease,border-color .2s ease}@media screen and (min-width:750px){.dashcam-image-compare__knob{width:4.4rem;height:4.4rem}}.dashcam-image-compare__knob svg{width:1.4rem;height:1.4rem;pointer-events:none}.dashcam-image-compare__knob:active,.dashcam-image-compare.is-dragging .dashcam-image-compare__knob{cursor:grabbing;transform:translate(-50%,-50%) scale(.95);border-color:var(--dashcam-accent, #6cbd45)}.dashcam-image-compare__layer--before{transition:clip-path .1s ease-out}.dashcam-image-compare__line,.dashcam-image-compare__knob{transition:left .1s ease-out}.dashcam-image-compare.is-dragging .dashcam-image-compare__layer--before,.dashcam-image-compare.is-dragging .dashcam-image-compare__line,.dashcam-image-compare.is-dragging .dashcam-image-compare__knob{transition:none}.dashcam-image-compare.is-dragging .dashcam-image-compare__media{cursor:grabbing}
/*# sourceMappingURL=/cdn/shop/t/10/assets/component-dashcam-clarity-comparison.css.map */
