@font-face{font-family:"IBM Plex Mono";src:url(assets/fonts/ibm-plex-mono-latin-400-normal.woff2) format('woff2');font-style:normal;font-weight:400;font-display:swap}
@font-face{font-family:"IBM Plex Mono";src:url(assets/fonts/ibm-plex-mono-latin-500-normal.woff2) format('woff2');font-style:normal;font-weight:500;font-display:swap}

.produktfahrt{position:relative;height:400svh;margin-top:42px}
.produktfahrt:not([data-gl="ok"]){height:auto}
.produktstage[data-zoom="ja"]{z-index:300}
.produktstage{position:sticky;top:74px;height:calc(100svh - 74px);min-height:520px;overflow:clip;background:radial-gradient(120% 95% at 50% 40%,rgba(255,255,255,.94) 0%,rgba(214,239,227,.5) 52%,rgba(186,224,206,.72) 100%),var(--paper)}
.produktstage::before{content:"";position:absolute;inset:0;pointer-events:none;background-image:radial-gradient(circle,rgba(15,122,82,.16) 1px,transparent 1.2px);background-size:76px 76px;opacity:.55;transform:scale(1.12);transition:opacity 1.1s ease,transform 1.6s cubic-bezier(.2,.7,.2,1);-webkit-mask-image:radial-gradient(80% 80% at 50% 45%,transparent 30%,#000 78%);mask-image:radial-gradient(80% 80% at 50% 45%,transparent 30%,#000 78%)}
.produktstage.fahrt-an::before{opacity:.78;transform:scale(1.05)}
.produktstage.fahrt-halt::before{opacity:1;transform:none}

.produktstage::after{content:"";position:absolute;inset:-2px;pointer-events:none;z-index:4;background:radial-gradient(72% 68% at 50% 46%,rgba(247,250,248,0) 42%,rgba(238,247,242,.72) 76%,rgba(224,240,232,.96) 100%);opacity:1;transition:opacity 1.2s ease}
.produktstage.fahrt-halt::after{opacity:.28}
.produktstage[data-zoom="ja"]::after{opacity:0;transition:opacity .5s ease}
.produktstage__canvas{position:absolute;inset:0;width:100%;height:100%;display:block;z-index:1}
.produktstage.is-voll .produktstage__canvas{position:fixed;z-index:201}
.produktstage__hit{position:absolute;inset:0;z-index:2;width:100%;height:100%;margin:0;padding:0;background:none;border:0;cursor:default;-webkit-tap-highlight-color:transparent}
.produktstage[data-hover="ja"] .produktstage__hit{cursor:pointer}
.produktstage__hit:focus-visible{outline:3px solid var(--green);outline-offset:-6px}

.produkthud{position:absolute;inset:0;z-index:3;pointer-events:none;font:400 13.5px/1.6 "IBM Plex Mono",ui-monospace,monospace;color:#1f4234;letter-spacing:.05em}
.produkthud p{margin:0}
.produkthud strong{font-weight:500;color:#0f261c}
.produkthud__tag{position:absolute;opacity:0;transform:translateY(10px);transition:opacity .8s ease,transform .8s ease}
.fahrt-1 .produkthud__tag--name,.fahrt-2 .produkthud__tag--recht,.fahrt-3 .produkthud__tag--cta{opacity:1;transform:none}
.produkthud__tag--name{left:clamp(18px,8vw,150px);top:16%}
.produkthud__tag--name::after{content:"";position:absolute;left:calc(100% + 12px);top:92%;width:clamp(40px,9vw,150px);height:1px;background:rgba(15,122,82,.45);transform:rotate(24deg);transform-origin:left top}
.produkthud__tag--recht{right:clamp(18px,7vw,130px);top:32%;text-align:right}
.produkthud__tag--cta{right:clamp(18px,8vw,160px);bottom:17%;text-align:right}
.produktstage[data-zoom="ja"] .produkthud{opacity:0;transition:opacity .4s ease}
@media (max-width:839px){
  .produkthud__tag--recht{display:none}
  .produkthud__tag--name{top:7%}
  .produkthud__tag--cta{right:auto;left:50%;bottom:12%;text-align:center;transform:translate(-50%,10px)}
  .fahrt-3 .produkthud__tag--cta{transform:translate(-50%,0)}
}

.produktdunkel{position:fixed;inset:0;z-index:200;pointer-events:none;opacity:0;transition:opacity .85s ease;background:radial-gradient(110% 90% at 62% 42%,#102a1f 0%,#09150e 55%,#060f0a 100%)}
.produktstage[data-zoom="ja"] .produktdunkel{opacity:1;pointer-events:auto}

.produktdetail{position:fixed;inset:0;z-index:202;opacity:0;transition:opacity .6s ease .35s}
.produktdetail:not(.is-offen){transition:opacity .4s ease}
.produktdetail::before{content:"";position:absolute;inset:0;pointer-events:none;background:linear-gradient(90deg,rgba(4,12,8,0) 18%,rgba(4,12,8,.74) 33%,rgba(4,12,8,.74) 58%,rgba(4,12,8,0) 74%)}
.produktdetail.is-offen{opacity:1}
.produktdetail[hidden]{display:none}
.produktdetail__marke{position:absolute;top:24px;left:30px;display:flex;align-items:center;gap:11px;color:#dff2e7;font:600 1.2rem/1 Bricolage,Hanken,sans-serif;letter-spacing:-.01em;text-shadow:0 0 22px rgba(142,245,200,.35);opacity:0;transition:opacity .7s ease 1.15s}
.produktdetail:not(.is-offen) .produktdetail__marke{transition:opacity .3s ease}
.produktdetail.is-offen .produktdetail__marke{opacity:1}
.produktdetail__marke .crest{width:28px;height:28px}
.produktdetail__panel{position:absolute;left:clamp(24px,36vw,40vw);top:50%;transform:translateY(calc(-50% + 12px));width:min(500px,86vw);max-height:86vh;overflow:auto;scrollbar-width:thin;padding:20px 4px;font:400 14px/1.85 "IBM Plex Mono",ui-monospace,monospace;letter-spacing:.02em;color:rgba(230,245,238,.96);opacity:0;transition:opacity .7s ease 1s,transform .7s ease 1s}
.produktdetail:not(.is-offen) .produktdetail__panel{transition:opacity .3s ease,transform .3s ease}
.produktdetail.is-offen .produktdetail__panel{opacity:1;transform:translateY(-50%)}
.produktdetail__panel p{margin:0 0 1.4em;max-width:58ch}
.produktdetail__kicker{color:rgba(178,212,196,.92);letter-spacing:.14em;padding-bottom:10px;border-bottom:1px solid rgba(142,245,200,.25);margin-bottom:1.6em;display:inline-block}
.produktdetail__punkte{list-style:none;margin:0 0 1.6em;padding:0;color:rgba(206,242,224,.92)}
.produktdetail__punkte li::before{content:"";display:inline-block;width:14px;height:1px;background:rgba(142,245,200,.55);margin:0 10px 4px 0}
.produktdetail__gruppe{color:rgba(178,212,196,.75);margin-bottom:.35em;letter-spacing:.1em}
.produktdetail__links{margin-top:0}
.produktdetail__links a{color:#f2fbf6;text-decoration:none;font-weight:500;letter-spacing:.04em}
.produktdetail__links a:hover,.produktdetail__links a:focus-visible{color:#8ef5c8}
.produktdetail__links a:focus-visible{outline:1.5px solid #8ef5c8;outline-offset:4px}
.produktdetail__close{position:absolute;top:26px;right:30px;background:none;border:0;color:#dff2e7;font:500 13px/1 "IBM Plex Mono",ui-monospace,monospace;letter-spacing:.08em;padding:15px 24px;cursor:pointer;opacity:0;transition:opacity .7s ease 1.15s}
.produktdetail:not(.is-offen) .produktdetail__close{transition:opacity .3s ease}
.produktdetail.is-offen .produktdetail__close{opacity:1}
.produktdetail__close:hover{color:#8ef5c8}
.produktdetail__close::before,.produktdetail__close::after,.produktdetail__close span::before,.produktdetail__close span::after{content:"";position:absolute;width:9px;height:9px;border:0 solid rgba(223,242,231,.7)}
.produktdetail__close::before{top:0;left:0;border-top-width:1.5px;border-left-width:1.5px}
.produktdetail__close::after{top:0;right:0;border-top-width:1.5px;border-right-width:1.5px}
.produktdetail__close span::before{bottom:0;left:0;border-bottom-width:1.5px;border-left-width:1.5px}
.produktdetail__close span::after{bottom:0;right:0;border-bottom-width:1.5px;border-right-width:1.5px}
.produktdetail__close:focus-visible{outline:1.5px solid #8ef5c8;outline-offset:3px}
@media (max-width:839px){
  .produktdetail::before{background:linear-gradient(90deg,rgba(4,12,8,.55) 0%,rgba(4,12,8,.82) 12%,rgba(4,12,8,.82) 88%,rgba(4,12,8,.55) 100%)}
  .produktdetail__marke{top:18px;left:20px}
  .produktdetail__close{top:14px;right:12px}
  .produktdetail__panel{left:22px;right:22px;width:auto;font-size:12.5px}
}

.produktstage:not([data-gl="ok"]){position:relative;top:auto;height:auto;min-height:0;background:none}
.produktstage:not([data-gl="ok"])::before{content:none}
.produktstage:not([data-gl="ok"]) :is(.produktstage__canvas,.produkthud,.produktstage__hit,.produktdunkel,.produktdetail){display:none}
.produktstage[data-gl="ok"] .produktstage__fallback{display:none}

@media (prefers-reduced-motion:reduce){
  .produkthud__tag,.produktdunkel,.produktdetail,.produktdetail__panel,.produktdetail__marke,.produktdetail__close,.produktstage::before,.produktstage::after{transition:none}
  .produktstage::before{opacity:1;transform:none}
  .produktstage::after{opacity:.28}
}