/* Graz auf Rad – motion, compact video magazine and model comparison */
.icon{display:inline-block;width:1.15em;height:1.15em;vertical-align:-.2em;flex-shrink:0;pointer-events:none;color:inherit}.arrow{display:inline-flex;align-items:center;justify-content:center}.arrow .icon{width:1em;height:1em}.round .icon{width:19px;height:19px}.play .icon{width:24px;height:24px;fill:currentColor;stroke-width:1.2;transform:translateX(1px)}.menu-toggle .icon{width:21px;height:21px;vertical-align:middle}.menu-toggle .icon-close{display:none}.menu-toggle[aria-expanded=true] .icon-menu{display:none}.menu-toggle[aria-expanded=true] .icon-close{display:inline-block}.dialog-close .icon,.clear-compare .icon,.lightbox button .icon{width:19px;height:19px}.video-pagination button{display:inline-flex;align-items:center;justify-content:center}.compare-toggle>.icon{width:18px;height:18px}.promise .icon{width:20px;height:20px}.zoom-label .icon{width:15px;height:15px}
body.dialog-open{overflow:hidden}.header{transition:box-shadow .25s,background .25s}.header.scrolled{box-shadow:0 5px 24px #173d3210;background:#f5f3ebfa}.btn .arrow,.text-link .arrow{transition:transform .25s}.btn:hover .arrow,.text-link:hover .arrow{transform:translate(3px,-3px)}
.hero-scroll{height:178vh;height:178svh;position:relative}.hero-scroll .hero{position:sticky;top:86px;height:calc(100vh - 86px);height:calc(100svh - 86px);min-height:500px;max-height:none;isolation:isolate;clip-path:inset(0 var(--hero-inset,0px) round var(--hero-radius,0px))}.hero-scroll .hero-media{transform-origin:75% 58%;backface-visibility:hidden}.hero-scroll .hero:after{z-index:0;background:linear-gradient(90deg,#f5f3ebed 0%,#f5f3eb9c 31%,#f5f3eb00 64%)}.hero-scroll .hero-copy{will-change:transform,opacity}.hero-second{position:absolute;z-index:3;left:max(48px,calc((100vw - 1360px)/2));top:28%;max-width:530px;opacity:0;pointer-events:none;transform:translateY(45px)}.hero-second h2{font-size:clamp(45px,5.1vw,75px);line-height:1.02;color:var(--green);margin-bottom:23px}.hero-second p{font-size:17px;margin-bottom:26px}.hero-chapters{position:absolute;left:max(48px,calc((100vw - 1360px)/2));bottom:76px;width:min(490px,40vw);z-index:3;display:flex;justify-content:space-between;gap:18px}.hero-chapter{display:flex;gap:9px;align-items:center;font-size:9px;color:#617459;white-space:nowrap;transition:color .25s}.hero-chapter b{font-weight:600}.hero-chapter.active{color:var(--green)}.hero-chapter.active:before{content:"";width:5px;height:5px;border-radius:50%;background:var(--green)}.hero-progress{position:absolute;top:30px;width:100%;height:2px;background:#173d3229}.hero-progress i{display:block;background:var(--green);width:100%;height:100%;transform:scaleX(var(--hero-progress,0));transform-origin:left}.hero-coordinate{position:absolute;right:46px;top:30px;font-size:9px;letter-spacing:.16em;writing-mode:vertical-rl;color:#173d3299;z-index:2}.hero-scroll .hero-bottom{bottom:20px;justify-content:space-between}.hero-scroll .hero-copy{padding-bottom:90px}.hero-scroll .hero h1{font-size:clamp(64px,7.3vw,106px)}.hero-finish{margin-top:3px}
.motion-on .stagger-categories>.category,.motion-on .stagger-products>.product-card,.motion-on .stagger-steps>article{opacity:0;transform:translateY(32px);transition:opacity .7s,transform .8s cubic-bezier(.2,.7,.2,1)}.motion-on .visible.stagger-categories>.category,.motion-on .visible.stagger-products>.product-card,.motion-on .visible.stagger-steps>article{opacity:1;transform:none}.stagger-categories>:nth-child(2),.stagger-products>:nth-child(2),.stagger-steps>:nth-child(2){transition-delay:.12s!important}.stagger-categories>:nth-child(3),.stagger-products>:nth-child(3),.stagger-steps>:nth-child(3){transition-delay:.24s!important}.editorial-reveal img{transition:transform 1.2s cubic-bezier(.2,.65,.25,1)}.motion-on .editorial-reveal:not(.visible) img{transform:scale(1.07)}.category .round{transition:background .25s,color .25s,transform .25s}.category:hover .round{background:var(--lime);color:var(--green);border-color:var(--lime);transform:rotate(-8deg)}.steps article{position:relative}.steps article:before{content:"";position:absolute;top:-37px;left:0;width:70px;height:2px;background:#819d4c;transform:scaleX(0);transform-origin:left;transition:transform .6s}.steps.visible article:before{transform:scaleX(1)}.faq details[open] p{animation:answer-in .25s ease-out}@keyframes answer-in{from{opacity:0;transform:translateY(-5px)}to{opacity:1;transform:none}}
.video-intro{padding:24px 0 38px}.video-intro h1{font-size:clamp(43px,4.8vw,68px);line-height:1.03;margin:0 0 18px}.video-intro h1 span{color:#71835f}.video-intro p{font-size:14px;color:var(--muted);margin:0}.film-feature-section{padding:0 0 15px}.film-feature{display:grid;grid-template-columns:1.15fr 1fr;background:var(--green);border-radius:10px;overflow:hidden;color:var(--paper)}.film-feature-image{align-self:stretch;display:flex;align-items:center;background:#1a3026}.film-feature-copy{padding:44px 44px 35px}.film-feature-copy .eyebrow{font-size:9px;color:var(--lime);display:flex;gap:9px;align-items:center}.live-dot{width:5px;height:5px;background:var(--lime);border-radius:50%}.film-feature-copy h2{font-size:clamp(33px,3.2vw,46px);line-height:1.03;margin-bottom:20px}.film-feature-copy>p{font-size:13px;color:#c3d0c1;max-width:385px}.film-product-link{display:block;font-size:11px;margin:19px 0 0;text-decoration:underline;text-underline-offset:4px}.film-feature-copy .film-source{font-size:9px;margin:21px 0 0;color:#adc1ac}.film-feature .btn{font-size:11px;padding:13px 18px;gap:24px}.video-trigger{border:0;padding:0;display:block;width:100%;aspect-ratio:16/9;position:relative;overflow:hidden;background:#153026;color:white;cursor:pointer}.video-trigger img{width:100%;height:100%;object-fit:cover;transition:transform .55s,opacity .3s}.video-trigger:after{content:"";position:absolute;inset:0;background:linear-gradient(transparent 60%,#0c231a90);pointer-events:none}.video-trigger:hover img{transform:scale(1.035);opacity:.85}.video-trigger .play{width:58px;height:58px;font-size:17px;box-shadow:0 0 0 9px #d6e87b19;transition:transform .3s,box-shadow .3s}.video-trigger:hover .play{transform:scale(1.08);box-shadow:0 0 0 14px #d6e87b19}.video-duration{position:absolute;right:12px;bottom:12px;background:#10251ed9;padding:3px 7px;border-radius:3px;font-size:10px;z-index:1}.film-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:35px 25px}.film-card{min-width:0}.film-card .video-trigger{border-radius:6px}.film-card-copy{padding-top:18px}.film-card-copy .eyebrow{font-size:9px;color:#6a7b61;margin-bottom:9px}.film-card h3{font-size:20px;line-height:1.25;letter-spacing:-.035em;margin:0 0 10px;overflow-wrap:anywhere}.film-card h3 button{font:inherit;background:transparent;border:0;padding:0;text-align:left}.film-card h3 button:hover{text-decoration:underline;text-underline-offset:5px}.film-card p{font-size:11px;color:var(--muted);max-width:330px;margin:0}.channel-section{padding-top:65px}.channel-section .section-head{margin-bottom:27px}.channel-section h2{font-size:43px}.channel-section .section-head p{font-size:12px;max-width:350px}.channel-section .catalog-tools{margin-bottom:15px}.chips button span{margin-left:8px;opacity:.7}.channel-footer{border-top:1px solid var(--line);margin-top:45px;padding-top:24px;display:flex;align-items:center;justify-content:space-between;gap:30px}.channel-footer p{max-width:500px;font-size:12px;color:var(--muted);margin:0}.video-privacy{font-size:10px;color:#76826f;margin:25px 0 0}.home-films .film-feature{background:#21483a}.home-films .film-feature-image{border-radius:6px}.home-film-footer{display:flex;justify-content:space-between;gap:25px;border-top:1px solid #446451;margin-top:25px;padding-top:20px;font-size:11px;color:#c4d2bd}.home-film-footer a{color:var(--lime)}.video-dialog{width:min(790px,calc(100vw - 40px));max-height:90vh;max-height:90svh;padding:0;background:#f5f3eb;color:var(--green);border:0;border-radius:10px;box-shadow:0 30px 100px #06140c55;overflow:auto}.video-dialog::backdrop,.compare-dialog::backdrop{background:#071c15bf;backdrop-filter:blur(6px)}.video-dialog-head{padding:20px 24px;display:flex;align-items:center;justify-content:space-between;gap:25px}.video-dialog-head .eyebrow{font-size:8px;margin-bottom:6px}.video-dialog-head h2{font-size:20px;letter-spacing:-.025em;line-height:1.25;margin:0;max-width:650px}.dialog-close{border:1px solid #bbc8b3;background:transparent;width:35px;height:35px;flex:none;border-radius:50%;font-size:22px;color:var(--green);display:flex;align-items:center;justify-content:center}.dialog-close:hover{background:var(--sage)}.compact-player{aspect-ratio:16/9;width:100%;background:#091b13;position:relative}.compact-player iframe{display:block;width:100%;height:100%;border:0}.video-dialog.is-short{width:min(365px,calc(100vw - 40px))}.video-dialog.is-short .compact-player{aspect-ratio:9/16;max-height:63vh;max-height:63svh}.video-dialog.is-short .video-dialog-head{padding:15px 18px}.video-dialog.is-short .video-dialog-head h2{font-size:15px}.video-dialog-foot{display:flex;justify-content:space-between;align-items:center;gap:20px;padding:14px 24px;font-size:10px}.video-dialog-foot>a{text-decoration:underline;text-underline-offset:3px}.video-pagination{display:flex;gap:13px;align-items:center}.video-pagination button{width:30px;height:30px;border:1px solid var(--line);background:transparent;border-radius:50%;font-size:15px}.video-pagination button:disabled{opacity:.3}.video-dialog[open],.compare-dialog[open]{animation:dialog-in .22s ease-out}@keyframes dialog-in{from{opacity:0;transform:translateY(14px) scale(.985)}to{opacity:1;transform:none}}.compact-video-page{max-width:990px;margin:auto}.compact-video-page .page-intro{padding:22px 0 30px}.compact-video-page .page-intro h1{font-size:clamp(36px,4.3vw,57px)}.compact-video-page .page-intro p{font-size:13px}.compact-video-page .section{padding-bottom:65px}.compact-video-page .details-layout{gap:40px}.compact-video-page .details-layout h2{font-size:32px}.compact-video-page .details-layout p{font-size:12px}.inline-player{max-width:800px;margin-left:auto;margin-right:auto}.inline-player .play{width:58px;height:58px;font-size:17px}.inline-player .video-consent{font-size:10px}.compare-toggle{border:0;border-top:1px solid #c9d3c1;background:transparent;padding:12px 0;width:100%;text-align:left;font-size:11px;display:flex;align-items:center;gap:8px;color:#53674a}.compare-toggle span{font-size:17px}.compare-toggle[aria-pressed=true]{color:var(--green);font-weight:700}.compare-toggle:hover{color:var(--green)}.compare-bar{position:fixed;bottom:22px;left:50%;transform:translateX(-50%);z-index:24;box-shadow:0 12px 35px #173d3240;width:min(580px,calc(100vw - 36px));padding:15px 18px;background:var(--paper);border:1px solid #c3d0b8;border-radius:9px;display:flex;align-items:center;gap:20px}.compare-bar>div{flex:1}.compare-bar strong{display:block;font-size:13px}.compare-bar>div>span{font-size:10px;color:var(--muted)}.compare-bar .btn{font-size:11px;padding:11px 16px;gap:20px}.clear-compare{border:0;background:transparent;font-size:22px;padding:7px;color:var(--muted)}.compare-dialog{width:min(900px,calc(100vw - 35px));max-height:86vh;max-height:86svh;border:0;border-radius:10px;padding:0;background:var(--paper);color:var(--green);overflow:auto}.compare-table-wrap{overflow-x:auto;padding:0 24px}.compare-table{border-collapse:collapse;width:100%;font-size:11px;min-width:480px}.compare-table th,.compare-table td{padding:16px;border-bottom:1px solid var(--line);text-align:left;vertical-align:top}.compare-table th{font-weight:400;color:var(--muted);min-width:100px}.compare-table td{min-width:165px;max-width:250px}.compare-table img{width:150px;background:white;border-radius:4px;margin-bottom:16px}.compare-table h3{font-size:17px;margin-bottom:0}.compare-table .text-link{font-size:10px}.compare-disclaimer{padding:18px 24px;margin:0;font-size:10px}.toast{position:fixed;bottom:115px;left:50%;transform:translateX(-50%);background:var(--green);color:white;padding:12px 18px;border-radius:5px;font-size:12px;z-index:26;width:max-content;max-width:90vw;box-shadow:0 5px 15px #173d3240}
@media(max-width:1100px){.hero-second,.hero-chapters{left:32px}.hero-second{max-width:460px}.hero-second h2{font-size:52px}.hero-chapters{width:440px;max-width:47vw}.hero-chapter{font-size:8px;gap:5px}.film-feature-copy{padding:32px}.film-feature-copy h2{font-size:36px}.hero-scroll .hero h1{font-size:82px}}
@media(max-width:850px){.film-feature-copy{padding:26px}.film-feature-copy h2{font-size:31px}.film-feature-copy>p{font-size:12px}.film-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:30px 22px}.film-feature .btn{gap:10px;padding:11px 12px;font-size:10px}.film-feature-copy .eyebrow{font-size:8px}.video-dialog{width:min(740px,calc(100vw - 32px))}}
@media(max-width:600px){.film-feature{grid-template-columns:1fr}.film-feature-copy{padding:28px}.film-feature-copy h2{font-size:36px}.film-feature-copy>p{max-width:100%}.film-feature .btn{font-size:11px;padding:13px 17px}.film-feature-copy .eyebrow{font-size:9px}.film-feature-copy .film-source{font-size:9px;margin-top:18px}.video-intro{padding:15px 0 28px}.video-intro h1{font-size:44px}.video-intro p{font-size:12px}.channel-section{padding-top:45px}.channel-section h2{font-size:34px}.channel-section .section-head p{font-size:12px}.film-grid{gap:25px 14px}.film-card h3{font-size:15px;letter-spacing:-.025em}.film-card-copy{padding-top:12px}.film-card-copy .eyebrow{font-size:7px;margin-bottom:7px}.film-card p{font-size:10px}.film-card .play{width:38px;height:38px;font-size:12px;box-shadow:none}.film-card .video-duration{font-size:8px;bottom:7px;right:7px;padding:2px 5px}.video-trigger .play{width:50px;height:50px}.channel-footer{display:block;margin-top:32px}.channel-footer p{margin-bottom:15px;font-size:11px}.channel-footer .text-link{font-size:11px}.video-privacy{font-size:9px}.home-film-footer{display:block;font-size:10px}.home-film-footer span{display:block;margin-bottom:12px}.video-dialog-head{padding:16px;gap:14px}.video-dialog-head h2{font-size:16px}.video-dialog-head .eyebrow{font-size:7px}.dialog-close{width:31px;height:31px;font-size:20px}.video-dialog-foot{padding:12px 16px;gap:9px;font-size:9px}.video-pagination{gap:9px}.video-pagination button{width:29px;height:29px}.compact-video-page .page-intro h1{font-size:39px}.compact-video-page .details-layout{gap:15px}.compare-bar{padding:12px;gap:10px;bottom:14px}.compare-bar>div>span{font-size:8px}.compare-bar strong{font-size:11px}.compare-bar .btn{font-size:9px;gap:10px;padding:11px}.compare-bar .btn .arrow{display:none}.clear-compare{padding:3px}.compare-table-wrap{padding:0 12px}.compare-table th,.compare-table td{padding:12px}.steps article:before{display:none}.compare-disclaimer{padding:15px}.video-dialog{max-height:93vh;max-height:93svh}}
@media(prefers-reduced-motion:reduce){.hero-scroll{height:auto}.hero-scroll .hero{position:relative;top:0;clip-path:none!important}.hero-second,.hero-chapters,.hero-coordinate{display:none}.hero-scroll .hero-copy{opacity:1!important;transform:none!important}.hero-scroll .hero-media{transform:none!important}.motion-on .stagger-categories>.category,.motion-on .stagger-products>.product-card,.motion-on .stagger-steps>article{opacity:1;transform:none}.editorial-reveal img{transform:none!important}}


/* A composed portrait scene: both text chapters and the photograph stay in view. */
@media (max-width:850px){
  .hero-scroll{height:172vh;height:172svh}
  .hero-scroll .hero{position:sticky;top:var(--hero-header,74px);height:calc(100vh - var(--hero-header,74px) - 28px);height:calc(100svh - var(--hero-header,74px) - 28px);min-height:530px;max-height:none;padding:0;clip-path:inset(0 var(--hero-inset,0px) round var(--hero-radius,0px));background:#ebece2}
  .hero-scroll .hero>.wrap{align-items:flex-start;padding-top:38px}
  .hero-scroll .hero-copy{max-width:520px;padding:0;position:relative;z-index:2}
  .hero-scroll .hero h1{font-size:clamp(58px,9.7vw,80px);line-height:.98;margin:18px 0 20px}
  .hero-scroll .hero-copy>p{font-size:14px;line-height:1.65;max-width:345px;margin-bottom:24px}
  .hero-scroll .hero .eyebrow{font-size:8px;letter-spacing:.15em;margin:0}
  .hero-scroll .hero .actions{gap:22px;align-items:center;flex-wrap:wrap}
  .hero-scroll .hero .btn{font-size:11px;padding:14px 18px;gap:18px}
  .hero-scroll .hero .text-link{font-size:11px}
  .hero-scroll .hero-media{inset:auto 0 0;width:100%;height:80%;object-position:70% 62%;transform-origin:70% 65%;mask-image:linear-gradient(180deg,transparent 0%,#000 22%);-webkit-mask-image:linear-gradient(180deg,transparent 0%,#000 22%)}
  .hero-scroll .hero:after{background:linear-gradient(180deg,#f5f3eb 0%,#f5f3ebee 23%,#f5f3eb8c 41%,#f5f3eb00 66%,#173d3233 100%);z-index:0}
  .hero-second{display:block;left:32px;right:32px;top:40px;max-width:520px}
  .hero-second h2{font-size:clamp(45px,7.3vw,64px);line-height:1.02;margin:18px 0 20px;letter-spacing:-.055em}
  .hero-second p{font-size:14px;line-height:1.65;margin-bottom:24px}
  .hero-chapters{display:flex;left:24px;right:24px;bottom:20px;max-width:none;width:auto;gap:10px;padding:13px 12px 20px;background:#f5f3ebeb;border:1px solid #ffffff70;border-radius:8px;backdrop-filter:blur(10px)}
  .hero-chapter{font-size:8px;gap:5px;color:#55614f}
  .hero-chapter.active:before{display:none}
  .hero-chapter.active{color:#173d32}
  .hero-progress{left:12px;right:12px;top:auto;bottom:10px;width:auto}
  .hero-coordinate{display:none}
  .hero-scroll .hero-bottom{display:none}
}
@media (max-width:600px){
  .hero-scroll .hero{min-height:570px}
  .hero-scroll .hero>.wrap{padding:30px 22px 0}
  .hero-scroll .hero-copy{max-width:100%}
  .hero-scroll .hero h1{font-size:clamp(51px,15.3vw,76px);margin:16px 0 18px}
  .hero-scroll .hero-copy>p{font-size:12px;line-height:1.65;max-width:310px;margin-bottom:20px}
  .hero-scroll .hero .actions{gap:18px}
  .hero-scroll .hero .btn{font-size:10px;padding:13px 14px;gap:13px}
  .hero-scroll .hero .text-link{font-size:10px}
  .hero-scroll .hero-media{height:69%;object-position:72% 64%;width:100%}
  .hero-scroll .hero:after{background:linear-gradient(180deg,#f5f3eb 0%,#f5f3ebf5 24%,#f5f3eb96 40%,#f5f3eb00 59%,#173d3233 100%)}
  .hero-second{top:32px;left:22px;right:22px}
  .hero-second h2{font-size:clamp(38px,11.4vw,51px);margin:19px 0 18px}
  .hero-second p{font-size:13px;margin-bottom:20px}
  .hero-chapters{left:16px;right:16px;bottom:18px;gap:7px}
  .hero-chapter{font-size:7px;gap:4px}
}
@media (max-width:850px) and (max-height:700px){
  .hero-scroll .hero>.wrap{padding-top:22px}
  .hero-scroll .hero h1{font-size:clamp(48px,13.5vw,68px);margin:14px 0}
  .hero-scroll .hero-copy>p{font-size:11px;margin-bottom:16px;max-width:290px}
  .hero-scroll .hero-media{height:67%}
  .hero-second{top:24px}
  .hero-second h2{font-size:clamp(36px,10.8vw,48px)}
}
@media (prefers-reduced-motion:no-preference){
  .hero-copy>.eyebrow{animation:hero-enter .7s both}
  .hero-copy>h1{animation:hero-enter .9s .09s both}
  .hero-copy>p{animation:hero-enter .9s .18s both}
  .hero-copy>.actions{animation:hero-enter .9s .27s both}
  .hero-media{animation:hero-photo-enter 1.2s both}
  .hero-chapters{animation:hero-enter .9s .4s both}
}
@keyframes hero-enter{from{opacity:0;transform:translate3d(0,20px,0)}to{opacity:1;transform:translate3d(0,0,0)}}
@keyframes hero-photo-enter{from{opacity:.3;filter:blur(3px)}to{opacity:1;filter:blur(0)}}
@media (prefers-reduced-motion:reduce){
  .hero-scroll{height:auto}
  .hero-scroll .hero{position:relative;top:0;clip-path:none!important}
  .hero-second,.hero-chapters{display:none}
  .hero-scroll .hero-copy{opacity:1!important;transform:none!important}
  .hero-scroll .hero-media{transform:none!important}
}