#lv-cmp{
  --c-gold:#d4af37; --c-gold-l:#f0d879; --c-cream:#f5f0e8; --c-grey:#ab9c98;
  position:relative; overflow:hidden;
  width:auto; max-width:100vw;
  margin-left:calc(50% - 50vw); margin-right:calc(50% - 50vw);
  padding:clamp(58px,8vw,112px) clamp(18px,5vw,64px);
  font-family:'Inter',system-ui,-apple-system,'Segoe UI',sans-serif;
  color:var(--c-cream);
}
#lv-cmp *{ box-sizing:border-box; }

#lv-cmp .lv-cmp-media{ position:absolute; inset:0; z-index:0; }
#lv-cmp .lv-cmp-media img{ width:100%; height:100%; object-fit:cover;
  filter:grayscale(.62) brightness(.28) contrast(1.06); }
#lv-cmp .lv-cmp-veil{ position:absolute; inset:0;
  background:
    repeating-linear-gradient(45deg, rgba(212,175,55,.05) 0px, rgba(212,175,55,.05) 1px, transparent 1px, transparent 15px),
    radial-gradient(ellipse at 50% 40%, rgba(10,10,10,.5) 0%, rgba(7,7,7,.9) 62%, #050505 100%); }
#lv-cmp .lv-cmp-inner{ position:relative; z-index:1; max-width:1180px; margin:0 auto; }

#lv-cmp .lv-cmp-head{ text-align:center; max-width:820px; margin:0 auto; }
#lv-cmp .lv-cmp-kicker{ display:block; font-family:'Space Grotesk',system-ui,sans-serif;
  font-weight:600; font-size:11px; letter-spacing:.28em; text-transform:uppercase; color:var(--c-gold); }
#lv-cmp .lv-cmp-title{ font-family:'Space Grotesk',system-ui,sans-serif; font-weight:700;
  font-size:clamp(1.7rem,4.4vw,3.1rem); line-height:1.04; letter-spacing:-.015em;
  text-transform:uppercase; color:var(--c-cream); margin:14px 0 0; }
#lv-cmp .lv-cmp-title span{
  background-image:linear-gradient(100deg,var(--lvt-gold-tief) 0%,var(--lvt-gold-licht) 22%,var(--lvt-gold-mittel) 46%,var(--lvt-gold-weiss) 68%,var(--lvt-gold-tief) 100%);
  -webkit-background-clip:text; background-clip:text; color:transparent; }
#lv-cmp .lv-cmp-lead{ margin:18px auto 0; max-width:70ch;
  font-size:clamp(.94rem,1.5vw,1.05rem); line-height:1.7; color:var(--c-grey); }
#lv-cmp .lv-cmp-lead strong{ color:var(--c-cream); font-weight:500; }

/* Vergleich */
#lv-cmp .lv-cmp-stage{ position:relative; margin:clamp(36px,5vw,58px) auto 0;
  width:min(560px,92%); }
#lv-cmp .lv-cmp-wrap{ position:relative; padding:1.6mm;
  padding:6px;
  background:linear-gradient(150deg, rgba(212,175,55,.6), rgba(212,175,55,.12) 46%, rgba(212,175,55,.42)); }
#lv-cmp .lv-cmp-view{ position:relative; overflow:hidden; aspect-ratio:724 / 1024;
  background:#070707; cursor:ew-resize; touch-action:pan-y; user-select:none; }
#lv-cmp .lv-cmp-view img{ position:absolute; inset:0; width:100%; height:100%;
  object-fit:cover; display:block; -webkit-user-drag:none; }
#lv-cmp .lv-cmp-view img.after{ clip-path:inset(0 0 0 50%); will-change:clip-path; }
#lv-cmp .lv-cmp-corner{ position:absolute; width:22px; height:22px; z-index:6; pointer-events:none; }
#lv-cmp .lv-cmp-corner.tl{ left:-4px; top:-4px; border-left:2px solid var(--c-gold); border-top:2px solid var(--c-gold); }
#lv-cmp .lv-cmp-corner.br{ right:-4px; bottom:-4px; border-right:2px solid var(--c-gold); border-bottom:2px solid var(--c-gold); }

#lv-cmp .lv-cmp-bar{ position:absolute; top:0; bottom:0; width:2px; margin-left:-1px; z-index:4;
  background:linear-gradient(180deg, rgba(212,175,55,.2), var(--c-gold) 18%, var(--c-gold) 82%, rgba(212,175,55,.2));
  pointer-events:none; will-change:left; }
#lv-cmp .lv-cmp-knob{ position:absolute; top:50%; z-index:5; width:52px; height:52px;
  margin:-26px 0 0 -26px; padding:0; border:0; cursor:ew-resize;
  background:rgba(8,8,8,.86); box-shadow:inset 0 0 0 1px var(--c-gold), 0 12px 30px rgba(0,0,0,.6);
  transform:rotate(45deg); transition:background .3s ease; will-change:left; }
#lv-cmp .lv-cmp-knob:hover{ background:rgba(212,175,55,.22); }
#lv-cmp .lv-cmp-knob:focus-visible{ outline:2px solid var(--c-gold-l); outline-offset:5px; }
#lv-cmp .lv-cmp-knob s, #lv-cmp .lv-cmp-knob u{ position:absolute; top:50%; width:8px; height:8px;
  margin-top:-4px; text-decoration:none;
  border-top:1.7px solid var(--c-gold); border-right:1.7px solid var(--c-gold); }
#lv-cmp .lv-cmp-knob s{ left:11px; transform:rotate(-135deg) rotate(-45deg); }
#lv-cmp .lv-cmp-knob u{ right:11px; transform:rotate(45deg) rotate(-45deg); }

#lv-cmp .lv-cmp-tag{ position:absolute; top:14px; z-index:5; padding:7px 13px;
  font-family:'Space Grotesk',system-ui,sans-serif; font-size:9px; font-weight:600;
  letter-spacing:.22em; text-transform:uppercase; white-space:nowrap;
  transition:opacity .3s ease; }
#lv-cmp .lv-cmp-tag.l{ left:14px; color:#5c5c5c; background:rgba(245,245,245,.9); }
#lv-cmp .lv-cmp-tag.r{ right:14px; color:var(--lvt-schwarz);
  background:linear-gradient(120deg,var(--lvt-gold-tief) 0%,var(--lvt-gold-licht) 22%,var(--lvt-gold-mittel) 48%,var(--lvt-gold-weiss) 72%,var(--lvt-gold-tief) 100%); }

#lv-cmp .lv-cmp-note{ margin:20px auto 0; text-align:center;
  font-family:'Space Grotesk',system-ui,sans-serif; font-size:9.5px; letter-spacing:.22em;
  text-transform:uppercase; color:#8a7a4e; }
#lv-cmp .lv-cmp-note b{ color:var(--c-gold); font-weight:700; }

/* Punkte */
#lv-cmp .lv-cmp-points{ list-style:none; margin:clamp(46px,6vw,76px) 0 0; padding:0;
  display:grid; grid-template-columns:repeat(3,1fr); gap:clamp(16px,2.4vw,30px); }
#lv-cmp .lv-cmp-pface{ position:relative; height:100%; padding:30px 26px 28px;
  background:
    repeating-linear-gradient(45deg, rgba(212,175,55,.05) 0px, rgba(212,175,55,.05) 1px, transparent 1px, transparent 14px),
    linear-gradient(180deg,var(--lvt-karte-hell) 0%,var(--lvt-karte) 60%,var(--lvt-karte-tief) 100%);
  box-shadow:inset 0 0 0 1px rgba(212,175,55,.22);
  clip-path:polygon(16px 0,100% 0,100% calc(100% - 16px),calc(100% - 16px) 100%,0 100%,0 16px);
  transition:box-shadow .4s ease, transform .6s var(--lvt-weich); }
@media (hover:hover){
  #lv-cmp .lv-cmp-point:hover .lv-cmp-pface{ box-shadow:inset 0 0 0 1px rgba(212,175,55,.6); transform:translateY(-3px); }
}
#lv-cmp .lv-cmp-pnum{ display:block; font-family:'Space Grotesk',system-ui,sans-serif;
  font-weight:700; font-size:13px; letter-spacing:.2em; color:var(--c-gold); margin-bottom:16px; }
#lv-cmp .lv-cmp-ptitle{ font-family:'Space Grotesk',system-ui,sans-serif; font-weight:600;
  font-size:1.02rem; line-height:1.25; letter-spacing:-.01em; text-transform:uppercase;
  color:var(--c-cream); margin:0 0 12px; }
#lv-cmp .lv-cmp-ptext{ margin:0; font-size:.88rem; line-height:1.68; color:var(--c-grey); }

#lv-cmp .lv-cmp-rev{ opacity:0; transform:translateY(26px);
  transition:opacity .7s ease, transform .8s var(--lvt-weich); }
#lv-cmp.is-in .lv-cmp-rev{ opacity:1; transform:none; }
#lv-cmp.is-in .lv-cmp-stage{ transition-delay:.1s; }
#lv-cmp.is-in .lv-cmp-points{ transition-delay:.18s; }

@media (max-width:860px){
  #lv-cmp .lv-cmp-points{ grid-template-columns:1fr; }
  #lv-cmp .lv-cmp-knob{ width:44px; height:44px; margin:-22px 0 0 -22px; }
  #lv-cmp .lv-cmp-tag{ font-size:8px; padding:6px 10px; }
}
@media (prefers-reduced-motion:reduce){
  #lv-cmp .lv-cmp-rev{ opacity:1; transform:none; transition:none; }
}