/* Mobile image-led opening. Desktop composition and cinematic stay intact. */
.selection-opening-image{display:none}
.selection-mobile-title-break{display:none}
.selection-mobile-heading{display:none}
@media(max-width:720px), (pointer:coarse) and (max-width:1024px) and (max-height:500px){
 html body.editorial-site #main section#vergleich.p-selection .p-opening{
  --opening-progress:min(var(--selection-block,1),var(--cinema-departure,1));
  --photo-enter:clamp(0,calc(var(--opening-progress) * 1.55),1);
  --title-enter:clamp(0,calc((var(--opening-progress) - .14) * 1.4),1);
  --copy-enter:clamp(0,calc((var(--opening-progress) - .24) * 1.5),1);
  --tabs-enter:clamp(0,calc((var(--opening-progress) - .34) * 1.65),1);
  opacity:1!important;transform:none!important;transition:none!important;
 }
 html body.editorial-site #main section#vergleich.p-selection .p-opening[data-selection-motion]{
  opacity:1!important;transform:none!important;transition:none!important;
 }
 html body.editorial-site #main section#vergleich.p-selection .p-opening>div:first-child{
  display:block!important;position:relative!important;height:auto!important;
  min-height:0!important;padding:0!important;opacity:1!important;
  transform:none!important;clip-path:none!important;transition:none!important;
 }
 html body.editorial-site #main section#vergleich.p-selection .p-opening>div:first-child::after,
 html body.editorial-site #main section#vergleich.p-selection .p-opening>div:first-child::before{content:none!important;display:none!important}
 html body.editorial-site #main section#vergleich.p-selection .selection-opening-image{
  display:block!important;position:relative!important;inset:auto!important;
  width:100%!important;height:280px!important;margin:0!important;overflow:hidden!important;
  border-radius:50% 50% 0 0 / 46% 46% 0 0!important;
  opacity:var(--photo-enter)!important;
  clip-path:inset(0 0 calc((1 - var(--photo-enter)) * 20%) 0)!important;
  transform:none!important;transition:none!important;
 }
 html body.editorial-site #main section#vergleich.p-selection .selection-opening-image img{
  display:block!important;width:100%!important;height:100%!important;
  object-fit:cover!important;object-position:50% 42%!important;
  border-radius:0!important;opacity:1!important;
  transform:scale(calc(1.035 - var(--photo-enter) * .035))!important;
  transition:none!important;
 }
 html body.editorial-site #main section#vergleich.p-selection .selection-opening-image::after{
  content:none!important;display:none!important;
 }
 html body.editorial-site #main section#vergleich.p-selection .p-opening h2:not(.selection-mobile-heading){display:none!important}
 html body.editorial-site #main section#vergleich.p-selection .p-opening h2.selection-mobile-heading{
  display:block!important;position:relative!important;inset:auto!important;
  width:100%!important;max-width:none!important;margin:24px auto 0!important;
  padding:0 4px!important;text-align:center!important;color:#102e3b!important;
  font-size:clamp(25px,6.6vw,29px)!important;line-height:1.25!important;
  font-weight:400!important;letter-spacing:-.035em!important;text-wrap:balance;
  opacity:var(--title-enter)!important;
  transform:translateY(calc((1 - var(--title-enter)) * 12px))!important;
 }
 html body.editorial-site #main section#vergleich.p-selection .p-opening h2.selection-mobile-heading>br{display:initial!important}
 html body.editorial-site #main section#vergleich.p-selection .selection-title-quiet{
  position:static!important;inset:auto!important;margin:0!important;
  font-size:24px!important;line-height:1.1!important;letter-spacing:-.04em!important;
  color:#fff!important;opacity:var(--title-enter)!important;
  transform:translateY(calc((1 - var(--title-enter)) * 18px))!important;
 }
 html body.editorial-site #main section#vergleich.p-selection .selection-mobile-title-break{display:block!important}
 html body.editorial-site #main section#vergleich.p-selection .selection-title-result{
  position:static!important;inset:auto!important;
  max-width:10ch!important;margin:0!important;color:#fff!important;
  font-size:clamp(38px,10.7vw,48px)!important;line-height:1.04!important;
  letter-spacing:-.055em!important;text-wrap:balance!important;
  opacity:var(--title-enter)!important;
  transform:translateY(calc((1 - var(--title-enter)) * 18px))!important;
 }
 html body.editorial-site #main section#vergleich.p-selection .p-opening>p{
  max-width:none!important;padding:14px 8px 22px!important;margin:0!important;text-align:center!important;
  opacity:var(--copy-enter)!important;clip-path:none!important;transition:none!important;
  transform:translateY(calc((1 - var(--copy-enter)) * 12px))!important;
 }
 html body.editorial-site #main section#vergleich.p-selection .selection-copy-desktop{display:none!important}
 html body.editorial-site #main section#vergleich.p-selection .selection-copy-mobile{display:block!important;width:100%!important;max-width:none!important;margin:0 auto!important;}
 html body.editorial-site #main section#vergleich.p-selection .selection-proof{
  display:none!important;
 }
 html body.editorial-site #main section#vergleich.p-selection .selection-explanation{
  display:block!important;margin:0 auto!important;max-width:35ch!important;
  color:#62747b!important;font-size:15px!important;line-height:1.55!important;text-wrap:pretty!important;
 }
 html body.editorial-site #main section#vergleich.p-selection .flow-switch{
  background:#fff!important;padding:0!important;gap:12px!important;min-height:48px!important;
  border-radius:0!important;box-shadow:none!important;opacity:var(--tabs-enter)!important;
  transform:translateY(calc((1 - var(--tabs-enter)) * 8px))!important;transition:none!important;
 }
 html body.editorial-site #main section#vergleich.p-selection .flow-switch button{
  position:relative!important;min-height:48px!important;padding:10px 4px 13px!important;
  border-radius:0!important;background:transparent!important;box-shadow:none!important;
  font-size:14px!important;line-height:1.3!important;color:#62747b!important;
 }
 html body.editorial-site #main section#vergleich.p-selection .flow-switch button[aria-selected=true]{color:#102e3b!important}
 html body.editorial-site #main section#vergleich.p-selection .flow-switch button::after{
  content:''!important;display:block!important;position:absolute!important;
  inset:auto 10px 0!important;height:2px!important;background:#c48b40!important;
  border-radius:1px!important;transform:none!important;opacity:0!important;
 }
 html body.editorial-site #main section#vergleich.p-selection .flow-switch button[aria-selected=true]::after{opacity:1!important}
}

/* Visible entrances run after the cinematic gate, independently per element. */
@media(max-width:720px), (pointer:coarse) and (max-width:1024px) and (max-height:500px){
 html body.editorial-site #main section#vergleich.p-selection .p-opening[data-selection-entrance] .selection-opening-image{
  opacity:1!important;clip-path:inset(0)!important;
  transition:opacity .85s ease,clip-path 1.05s cubic-bezier(.22,.7,.25,1)!important;
 }
 html body.editorial-site #main section#vergleich.p-selection .p-opening[data-selection-entrance] .selection-opening-image[data-selection-reveal=pending]{
  opacity:0!important;clip-path:inset(0 0 18% 0)!important;
 }
 html body.editorial-site #main section#vergleich.p-selection .p-opening[data-selection-entrance] .selection-opening-image img{
  transform:scale(1)!important;transition:transform 1.2s cubic-bezier(.22,.7,.25,1)!important;
 }
 html body.editorial-site #main section#vergleich.p-selection .p-opening[data-selection-entrance] .selection-opening-image[data-selection-reveal=pending] img{transform:scale(1.045)!important}
 html body.editorial-site #main section#vergleich.p-selection .p-opening[data-selection-entrance] h2.selection-mobile-heading{
  opacity:1!important;transform:none!important;
  transition:opacity .85s ease,transform 1s cubic-bezier(.22,.7,.25,1)!important;
 }
 html body.editorial-site #main section#vergleich.p-selection .p-opening[data-selection-entrance] h2.selection-mobile-heading[data-selection-reveal=pending]{
  opacity:0!important;transform:translate3d(0,16px,0)!important;
 }
 html body.editorial-site #main section#vergleich.p-selection .p-opening[data-selection-entrance]>p{
  opacity:1!important;transform:none!important;
  transition:opacity .9s ease .08s,transform 1s cubic-bezier(.22,.7,.25,1) .08s!important;
 }
 html body.editorial-site #main section#vergleich.p-selection .p-opening[data-selection-entrance]>p[data-selection-reveal=pending]{
  opacity:0!important;transform:translate3d(0,12px,0)!important;
 }
 html body.editorial-site #main section#vergleich.p-selection .p-opening[data-selection-entrance] .flow-switch{
  opacity:1!important;transform:none!important;transition:opacity .75s ease!important;
 }
 html body.editorial-site #main section#vergleich.p-selection .p-opening[data-selection-entrance] .flow-switch[data-selection-reveal=pending]{opacity:0!important}
}
