@layer components{.guide-page,.hv2-page,.c26-page,.w8r-page,.wcc-page{--purple-deep: #3d1aaf;--purple: #4f25c8;--purple-mid: #6b43e0;--purple-bright: #8b6fe5;--lavender: #b9a7e8;--lavender-soft: #d5c9f0;--lavender-pale: #eee8fb;--lime: #c9ff3d;--lime-deep: #a8e020;--carrot: #ff7a2f;--terracotta: #e0612f;--peach: #ffc9a3;--coral: #ff6b5e;--bg: #f2f1f6;--bg-soft: #fbfaf8;--bg-lavender: #eeeafb;--ink: #18103c;--ink-soft: #2e2553;--gray: #6b6580;--gray-soft: #9a93ad;--grad-purple: linear-gradient(135deg, #6b43e0 0%, #4f25c8 60%, #3d1aaf 100%);--grad-lavender: linear-gradient(135deg, #eeeafb, #e2dbf6);--grad-lime: linear-gradient(135deg, #d4ff50, #a8e020);--pill: 999px;--radius-lg: 28px;--radius-md: 18px;--s-1: 4px;--s-2: 8px;--s-3: 12px;--s-4: 16px;--s-6: 24px;--s-8: 32px;--s-10: 40px;--s-12: 48px;--s-16: 64px;--fs-xxs: 11px;--fs-xs: 12px;--fs-sm: 14px;--fs-base: 15px;--fs-md: 16px;--fs-lg: 18px;--fs-xl: 22px;--fs-2xl: 30px;--fs-3xl: 40px;--fs-4xl: 56px;--fs-5xl: 64px;--lh-tight: 1.04;--lh-snug: 1.25;--lh-normal: 1.45;--lh-relaxed: 1.55}}@layer components{.g-before-after .out-wrap{display:grid;grid-template-columns:1fr;gap:28px;align-items:center}@media (min-width: 980px){.g-before-after .out-wrap{grid-template-columns:.8fr 1.2fr;gap:40px}}.g-before-after .out-list{display:flex;flex-direction:column;gap:12px}.g-before-after .out-plate{display:flex;gap:15px;align-items:flex-start;background:#fff;border:1px solid var(--lavender-pale);border-radius:var(--radius-md);padding:16px 18px;box-shadow:0 6px 18px #3d1aaf0d;transition:transform .15s ease,box-shadow .15s ease}.g-before-after .out-plate:hover{transform:translate(4px);box-shadow:0 12px 28px #3d1aaf1a}.g-before-after .out-plate .pic{width:40px;height:40px;border-radius:11px;background:var(--grad-lavender);color:var(--purple);display:flex;align-items:center;justify-content:center;flex:none}.g-before-after .out-plate .pic svg{width:21px;height:21px}.g-before-after .out-plate .pic.num{font-family:Onest;font-weight:800;font-size:18px;letter-spacing:-.03em;border-radius:13px;color:var(--ink);background:radial-gradient(125% 125% at 30% 24%,#eeffbe,#c9ff3d 52%,#a8e020);box-shadow:0 8px 18px #a8e02080,inset 0 2px 4px #ffffffb3,inset 0 -3px 6px #7c990f59}.g-before-after .out-plate h3{font-size:16px;font-weight:800;letter-spacing:-.01em;margin-bottom:3px;line-height:1.2}.g-before-after .out-plate p{font-size:13px;color:var(--gray);line-height:1.4}.g-before-after .ba-cap{font-size:13px;font-weight:700;color:var(--purple-mid);margin-bottom:12px;display:flex;align-items:center;gap:8px}.g-before-after .ba-cap svg{width:16px;height:16px}.g-before-after .ba{position:relative;border-radius:var(--radius-lg);overflow:hidden;box-shadow:0 24px 60px #14083c2e;-moz-user-select:none;user-select:none;-webkit-user-select:none;touch-action:pan-y;cursor:ew-resize;border:1px solid var(--lavender-pale)}.g-before-after .ba-layer{padding:54px 30px 30px;background:#fff}.g-before-after .ba-after{position:absolute;inset:0;z-index:2;clip-path:inset(0 0 0 var(--pos, 50%))}.g-before-after .ba-after .ba-layer{background:linear-gradient(160deg,#fbfff0,#fff 60%);height:100%}.g-before-after .ba-rh{display:flex;align-items:baseline;gap:10px;flex-wrap:wrap}.g-before-after .ba-rh b{font-size:19px;font-weight:800;letter-spacing:-.02em;color:var(--ink)}.g-before-after .ba-rh span{font-size:13px;color:var(--gray)}.g-before-after .ba-rule{height:1px;background:var(--lavender-pale);margin:14px 0 16px}.g-before-after .ba-sec{font-size:11px;font-weight:800;text-transform:uppercase;letter-spacing:.08em;margin-bottom:12px}.g-before-after .ba-before .ba-sec{color:var(--gray-soft)}.g-before-after .ba-after .ba-sec{color:var(--lime-deep)}.g-before-after .ba-after .ba-sec,.g-before-after .ba-after .ba-li{margin-left:12px}.g-before-after .ba-li{position:relative;padding:0 0 9px 22px;font-size:13.5px;line-height:1.4;min-height:22px}.g-before-after .ba-li:last-child{padding-bottom:0}.g-before-after .ba-intro{font-size:13.5px;font-weight:700;color:var(--ink-soft);margin-bottom:10px}.g-before-after .ba-before .ba-li{color:var(--gray)}.g-before-after .ba-before .ba-li:before{content:"";position:absolute;left:2px;top:6px;width:6px;height:6px;border-radius:50%;background:var(--gray-soft)}.g-before-after .ba-after .ba-li{color:var(--ink-soft);font-weight:500;padding-bottom:13px}.g-before-after .ba-after .ba-li:before{content:"";position:absolute;left:0;top:2px;width:15px;height:15px;border-radius:5px;background-color:#a8e02033;background-repeat:no-repeat;background-position:center;background-size:10px;background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%2376990F' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'><path d='M20 6L9 17l-5-5'/></svg>")}.g-before-after .ba-after .ba-li b{color:var(--purple);font-weight:800}.g-before-after .ba-after .ba-li .tool{color:var(--gray-soft);font-weight:600}.g-before-after .ba-badge{position:absolute;top:18px;z-index:5;font-size:10.5px;font-weight:800;text-transform:uppercase;letter-spacing:.07em;padding:5px 11px;border-radius:var(--pill);transition:opacity .18s ease}.g-before-after .ba-badge.hide{opacity:0;pointer-events:none}.g-before-after .ba-badge.before{left:18px;background:#e4495f24;color:#e4495f}.g-before-after .ba-badge.after{right:18px;z-index:6;background:var(--lime);color:var(--ink)}.g-before-after .ba-divider{position:absolute;top:0;bottom:0;left:var(--pos, 50%);width:2px;background:#fff;box-shadow:0 0 0 1px #4f25c81f,0 0 14px #14083c2e;z-index:7;transform:translate(-1px)}.g-before-after .ba-handle{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:42px;height:42px;border-radius:50%;background:#fff;box-shadow:0 6px 18px #14083c47;display:flex;align-items:center;justify-content:center;color:var(--purple);gap:1px}.g-before-after .ba-handle svg{width:13px;height:13px}.g-before-after .out-cta{text-align:center;margin-top:42px}.g-before-after .out-cta-panel{position:relative;overflow:hidden;background:var(--grad-purple);border-radius:var(--radius-lg);padding:36px 34px;display:flex;flex-direction:column;align-items:center;gap:22px;box-shadow:0 22px 50px #3d1aaf47}.g-before-after .out-cta-panel:before{content:"";position:absolute;inset:0;border-radius:inherit;background:radial-gradient(80% 120% at 88% 0%,#c9ff3d38,#c9ff3d00 55%);pointer-events:none}.g-before-after .out-cta-panel p{font-size:18px;color:#fff;line-height:1.55;max-width:620px;margin:0;position:relative}.g-before-after .out-cta-panel p b{color:var(--lime);font-weight:800}@media (max-width: 640px){.g-before-after .ba-layer{padding:48px 22px 24px}.g-before-after .ba-rh b{font-size:17px}.g-before-after .ba-li{font-size:13px}}}