:root{
  
  --mo-aus: cubic-bezier(.22,1,.36,1);

  
  --mo-feder: cubic-bezier(.22,1.2,.36,1);
  --mo-feder: linear(0, .0033 .8%, .0263 2.5%, .0919 5%, .1932 7.9%,
    .4093 13.1%, .6088 17.1%, .7607 20.6%, .8785 24%, .9629 27.4%,
    1.0182 30.9%, 1.0502 34.7%, 1.0621 38.9%, 1.0561 44%, 1.0366 50.8%,
    1.0059 63%, .9974 72.3%, 1.0001 90%, 1);

  --mo-schein: rgba(201,164,92,.13);
  --mo-kante:  rgba(201,164,92,.38);
}



.schwebt{
  position:relative;
  
  isolation:isolate;
  transition:
    transform   .52s var(--mo-feder),
    box-shadow  .45s var(--mo-aus),
    border-color .3s var(--mo-aus);
}


.schwebt::after{
  content:"";
  position:absolute; inset:0; z-index:2;
  border-radius:inherit; pointer-events:none;
  mix-blend-mode:plus-lighter;
  background:radial-gradient(460px circle at var(--mx,50%) var(--my,0%),
             var(--mo-schein), transparent 62%);
  opacity:0; transition:opacity .4s var(--mo-aus);
}

@media (hover:hover) and (pointer:fine){
  .schwebt:hover{
    transform:translateY(-6px) scale(1.006);
    border-color:var(--mo-kante);
    box-shadow:
      0 0 0 1px rgba(201,164,92,.12),
      inset 0 1px 0 rgba(235,217,168,.10),
      0 34px 68px -28px rgba(201,164,92,.42),
      0 12px 28px -20px rgba(0,0,0,.7);
  }
  .schwebt:hover::after{opacity:1}

  
  .schwebt:hover .pfeil,
  .schwebt:hover .mehr span{transform:translateX(5px)}
}


.schwebt:active{
  transform:translateY(-1px) scale(.994);
  transition-duration:.13s;
}


.schwebt:focus-visible{
  transform:translateY(-6px) scale(1.006);
  border-color:var(--mo-kante);
}


@media (hover:hover) and (pointer:fine){
  .ist-cockpit .schwebt:hover{transform:translateY(-3px)}
  .ist-cockpit .schwebt:focus-visible{transform:translateY(-3px)}
}
.ist-cockpit .schwebt:active{transform:translateY(0) scale(.997)}




.bewegt :where(.auf){
  opacity:0;
  transform:translateY(18px);
  transition:
    opacity   .6s var(--mo-aus),
    transform .8s var(--mo-feder);
  transition-delay:calc(var(--i,0) * 60ms);
}
.bewegt :where(.auf.da){opacity:1; transform:none}


.bewegt :where(.schwebt.auf){transform:translateY(22px) scale(.985)}
.bewegt :where(.schwebt.auf.da){transform:none}


@media (hover:hover) and (pointer:fine){
  .cta{transition:transform .38s var(--mo-feder), filter .25s var(--mo-aus),
       border-color .25s var(--mo-aus), color .25s var(--mo-aus)}
  .cta:hover{transform:translateY(-3px)}
}
.cta:active{transform:translateY(-1px) scale(.985); transition-duration:.12s}


@media (prefers-reduced-motion:reduce){
  .schwebt,.schwebt::after,.bewegt .auf,.cta{
    transition:none !important; animation:none !important;
  }
  .bewegt .auf,.bewegt .schwebt.auf{opacity:1 !important; transform:none !important}
  .schwebt:hover,.schwebt:active,.schwebt:focus-visible{transform:none !important}
  .schwebt:hover::after{opacity:0 !important}
}


html:not(.ist-cockpit) .fussnav a,
html:not(.ist-cockpit) .kopf nav a,
html:not(.ist-cockpit) .textlink{
  display:inline-flex; align-items:center; min-height:44px;
}





@property --bs-ga  {syntax:'<angle>';      initial-value:0deg;    inherits:false}
@property --bs-gao {syntax:'<angle>';      initial-value:0deg;    inherits:false}
@property --bs-gp  {syntax:'<percentage>'; initial-value:5%;      inherits:false}
@property --bs-gs  {syntax:'<color>';      initial-value:#FFF4D6; inherits:false}
@property --bs-fill{syntax:'<color>';      initial-value:#C9A45C; inherits:false}

html:not(.ist-cockpit) .cta.gold{
  
  --bs-ga:0deg; --bs-gao:0deg; --bs-gp:5%; --bs-gs:#FFF4D6; --bs-fill:#C9A45C;
  --bs-hl:#FFF1CC; --bs-hl2:#FFFFFF;
  position:relative; isolation:isolate; overflow:hidden;
  border:1px solid transparent; border-radius:999px;
  background:
    linear-gradient(180deg, rgba(255,255,255,.20), rgba(255,255,255,0) 58%) padding-box,
    linear-gradient(var(--bs-fill), var(--bs-fill)) padding-box,
    conic-gradient(from calc(var(--bs-ga) - var(--bs-gao)),
      transparent, var(--bs-hl) var(--bs-gp), var(--bs-gs) calc(var(--bs-gp) * 2),
      var(--bs-hl) calc(var(--bs-gp) * 3), transparent calc(var(--bs-gp) * 4)) border-box;
  box-shadow:
    inset 0 0 0 1px rgba(23,19,9,.16),
    inset 0 1px 0 rgba(255,250,235,.38),
    0 12px 32px -14px rgba(201,164,92,.62);
  animation:bs-ring 4.5s linear infinite;
  transition:
    transform .38s var(--mo-feder), translate .5s var(--mo-feder),
    box-shadow .35s var(--mo-aus), --bs-fill .25s ease,
    --bs-gao .8s cubic-bezier(.25,1,.5,1), --bs-gp .8s cubic-bezier(.25,1,.5,1),
    --bs-gs .8s cubic-bezier(.25,1,.5,1);
}
html:not(.ist-cockpit) .cta.gold > *{position:relative; z-index:1}

html:not(.ist-cockpit) .cta.gold::after{
  content:""; pointer-events:none; position:absolute; left:50%; top:50%;
  translate:-50% -50%; z-index:-1; width:100%; aspect-ratio:1;
  background:linear-gradient(-50deg, transparent, var(--bs-hl), transparent);
  -webkit-mask-image:radial-gradient(circle at bottom, transparent 40%, #000);
          mask-image:radial-gradient(circle at bottom, transparent 40%, #000);
  opacity:.45; animation:bs-schimmer 6s linear infinite;
}
html:not(.ist-cockpit) .cta.gold:is(:hover, :focus-visible){
  --bs-gp:20%; --bs-gao:95deg; --bs-gs:var(--bs-hl2); --bs-fill:#D4B06A;
  transform:translateY(-2px);
  box-shadow:
    inset 0 0 0 1px rgba(23,19,9,.16),
    inset 0 1px 0 rgba(255,250,235,.45),
    0 18px 40px -14px rgba(201,164,92,.78);
}
html:not(.ist-cockpit) .cta.gold:active{transform:translateY(0) scale(.97); transition-duration:.12s}
html:not(.ist-cockpit) .cta.gold .pfeil{display:inline-block; transition:transform .35s var(--mo-feder)}
html:not(.ist-cockpit) .cta.gold:hover .pfeil{transform:translateX(3px)}


html:not(.ist-cockpit) .cta.gold.gross:not(form .cta){
  animation:bs-ring 4.5s linear infinite, bs-puls 3.2s var(--mo-aus) infinite;
}
@keyframes bs-ring{to{--bs-ga:360deg}}
@keyframes bs-schimmer{to{rotate:360deg}}
@keyframes bs-puls{
  0%  {box-shadow:inset 0 0 0 1px rgba(23,19,9,.16), inset 0 1px 0 rgba(255,250,235,.38),
                  0 12px 32px -14px rgba(201,164,92,.62), 0 0 0 0 rgba(201,164,92,.42)}
  70% {box-shadow:inset 0 0 0 1px rgba(23,19,9,.16), inset 0 1px 0 rgba(255,250,235,.38),
                  0 12px 32px -14px rgba(201,164,92,.62), 0 0 0 14px rgba(201,164,92,0)}
  100%{box-shadow:inset 0 0 0 1px rgba(23,19,9,.16), inset 0 1px 0 rgba(255,250,235,.38),
                  0 12px 32px -14px rgba(201,164,92,.62), 0 0 0 0 rgba(201,164,92,0)}
}

.bs-ruht, .bs-ruht::after, .bs-ruht i{animation-play-state:paused !important}


html:not(.ist-cockpit) .cta.geist{
  border-color:transparent; border-radius:999px; color:var(--fg,#F2F0EA); font-weight:500;
  background:rgba(255,255,255,.06);
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.12);
  -webkit-backdrop-filter:blur(12px); backdrop-filter:blur(12px);
  transition:transform .38s var(--mo-feder), background-color .25s var(--mo-aus), box-shadow .25s var(--mo-aus);
}
html:not(.ist-cockpit) .cta.geist:hover{
  background:rgba(255,255,255,.10);
  box-shadow:inset 0 0 0 1px rgba(235,217,168,.32);
}


.bs-kulisse{position:fixed; inset:0; z-index:-1; pointer-events:none; overflow:hidden; contain:strict}
.bs-kulisse i{position:absolute; display:block}
.bs-raster{
  inset:-56px;
  background-image:
    linear-gradient(rgba(255,255,255,.04) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255,255,255,.04) 1px, transparent 1px);
  background-size:56px 56px;
  -webkit-mask-image:radial-gradient(80% 62% at 50% 12%, #000 0%, transparent 100%);
          mask-image:radial-gradient(80% 62% at 50% 12%, #000 0%, transparent 100%);
  animation:bs-raster 90s linear infinite;
}
.bs-kugel{border-radius:50%}
.bs-kugel.k1{width:760px; height:760px; top:-240px; left:-200px;
  background:radial-gradient(closest-side, rgba(201,164,92,.11), rgba(201,164,92,0));
  animation:bs-kugel-a 38s cubic-bezier(.23,1,.32,1) infinite alternate}
.bs-kugel.k2{width:640px; height:640px; top:34vh; right:-240px;
  background:radial-gradient(closest-side, rgba(255,255,255,.035), rgba(255,255,255,0));
  animation:bs-kugel-b 46s cubic-bezier(.23,1,.32,1) infinite alternate}
.bs-kugel.k3{width:560px; height:560px; bottom:-220px; left:28vw;
  background:radial-gradient(closest-side, rgba(201,164,92,.07), rgba(201,164,92,0));
  animation:bs-kugel-c 52s cubic-bezier(.23,1,.32,1) infinite alternate}
.bs-korn{inset:0; opacity:.035;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.85' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E")}
@keyframes bs-raster{to{transform:translate3d(56px,56px,0)}}
@keyframes bs-kugel-a{to{transform:translate3d(90px,70px,0) scale(1.12)}}
@keyframes bs-kugel-b{from{transform:scale(1.08)} to{transform:translate3d(-70px,-90px,0) scale(.96)}}
@keyframes bs-kugel-c{from{transform:scale(.95)} to{transform:translate3d(60px,-50px,0) scale(1.1)}}

html.hat-kulisse:not(.ist-cockpit) .hero{background-color:transparent}
@media (max-width:760px){
  .bs-kugel.k3{display:none}
  .bs-korn{opacity:.025}
}


.bs-fortschritt{position:absolute; left:0; bottom:-1px; width:100%; height:2px; pointer-events:none;
  background:linear-gradient(90deg, #8A6F3C, #C9A45C 55%, #EBD9A8);
  transform-origin:0 50%; transform:scaleX(0); will-change:transform}
.bs-gescrollt{box-shadow:0 18px 40px -30px rgba(0,0,0,.9)}


.bs-w{display:inline-block; vertical-align:top; overflow:hidden; padding-bottom:.12em; margin-bottom:-.12em}
@supports (overflow:clip){.bs-w{overflow-x:visible; overflow-y:clip}}
.bs-wi{display:inline-block; transform:translateY(112%);
  transition:transform .9s var(--mo-aus); transition-delay:calc(var(--w, 0) * 42ms)}
.bs-worte.bs-da .bs-wi{transform:none}


@media (hover:hover) and (pointer:fine) and (min-width:861px){
  .bewegt:not(.ist-cockpit) :where(.auf){
    filter:blur(8px);
    transition:opacity .7s var(--mo-aus), transform .8s var(--mo-feder), filter .7s var(--mo-aus);
    transition-delay:calc(var(--i,0) * 70ms);
  }
  .bewegt:not(.ist-cockpit) :where(.auf.da){filter:none}
}


.bs-rand::before{
  content:""; position:absolute; inset:0; z-index:3; pointer-events:none;
  border-radius:inherit; padding:1px;
  background:radial-gradient(260px circle at var(--mx,50%) var(--my,0%), rgba(235,217,168,.75), rgba(201,164,92,0) 70%);
  -webkit-mask:linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
  -webkit-mask-composite:xor; mask-composite:exclude;
  opacity:0; transition:opacity .35s var(--mo-aus);
}
@media (hover:hover) and (pointer:fine){ .bs-rand:hover::before{opacity:1} }


@keyframes bs-auftritt{from{opacity:0; transform:translateY(26px)}}
@keyframes bs-auftritt-scharf{from{opacity:0; transform:translateY(26px); filter:blur(10px)}}
@keyframes bs-foto{from{transform:scale(1.05)}}
.hero .wortmarke > span{animation:bs-auftritt .9s var(--mo-aus) both}
.hero .wortmarke > span:nth-child(2){animation-delay:.09s}
.hero .wortmarke > span:nth-child(3){animation-delay:.18s}
.hero .leitsatz{animation:bs-auftritt .9s var(--mo-aus) .3s both}
.hero .termin{animation:bs-auftritt 1s var(--mo-aus) .44s both}
.hero .hero-bild img{animation:bs-foto 1.6s var(--mo-aus) both}
@media (hover:hover) and (pointer:fine) and (min-width:861px){
  .hero .wortmarke > span, .hero .leitsatz, .hero .termin{animation-name:bs-auftritt-scharf}
}

@keyframes bs-foto-weit{from{scale:1.05}}
@media (min-width:861px){ .hero .hero-bild img{animation-name:bs-foto-weit} }


.bs-strahlen{position:absolute; inset:0; z-index:0; pointer-events:none; overflow:hidden}
.bs-strahlen i{position:absolute; top:-30%; left:74%; width:170px; height:150%;
  transform-origin:50% 0; filter:blur(22px);
  background:linear-gradient(180deg, rgba(235,217,168,.20), rgba(201,164,92,.06) 45%, rgba(201,164,92,0) 78%)}
.bs-strahlen i:nth-child(1){animation:bs-strahl-a 13s ease-in-out infinite alternate}
.bs-strahlen i:nth-child(2){width:110px; left:80%; opacity:.8; animation:bs-strahl-b 17s ease-in-out infinite alternate}
.bs-strahlen i:nth-child(3){width:220px; left:66%; opacity:.55; animation:bs-strahl-c 21s ease-in-out infinite alternate}
@keyframes bs-strahl-a{from{transform:translateX(-50%) rotate(-24deg)} to{transform:translateX(-50%) rotate(-17deg)}}
@keyframes bs-strahl-b{from{transform:translateX(-50%) rotate(-4deg)}  to{transform:translateX(-50%) rotate(5deg)}}
@keyframes bs-strahl-c{from{transform:translateX(-50%) rotate(22deg)}  to{transform:translateX(-50%) rotate(15deg)}}
@media (max-width:860px){
  .bs-strahlen i{left:50%; filter:blur(16px)}
  .bs-strahlen i:nth-child(3){display:none}
}


.termin .eyebrow{display:inline-flex; align-items:center; gap:9px}
.termin .eyebrow::before{content:""; width:8px; height:8px; border-radius:50%; flex:none;
  background:var(--gold,#C9A45C); box-shadow:0 0 0 0 rgba(201,164,92,.6); animation:bs-punkt 2.4s var(--mo-aus) infinite}
@keyframes bs-punkt{0%{box-shadow:0 0 0 0 rgba(201,164,92,.6)} 70%{box-shadow:0 0 0 8px rgba(201,164,92,0)} 100%{box-shadow:0 0 0 0 rgba(201,164,92,0)}}


@supports selector(::details-content){
  :root{interpolate-size:allow-keywords}
  details::details-content{block-size:0; overflow-y:clip;
    transition:block-size .45s var(--mo-aus), content-visibility .45s allow-discrete}
  details[open]::details-content{block-size:auto}
}


@media (prefers-reduced-motion:reduce){
  html:not(.ist-cockpit) .cta.gold, html:not(.ist-cockpit) .cta.gold::after,
  .bs-raster, .bs-kugel, .bs-strahlen i, .termin .eyebrow::before,
  .hero .wortmarke > span, .hero .leitsatz, .hero .termin, .hero .hero-bild img{animation:none !important}
  .bs-wi{transform:none !important; transition:none !important}
  .bewegt :where(.auf){filter:none !important}
  html:not(.ist-cockpit) .cta.gold:hover{transform:none}
  details::details-content{transition:none !important}
}