/* STEP62 – real work, no numbered/template-like service cards */
.step62-wrap{width:min(1180px,calc(100% - 48px));margin:0 auto}
.step62-eyebrow{margin:0 0 14px;font-size:.75rem;font-weight:800;letter-spacing:.16em;color:#6b655c}
.step62-process,.step62-services,.step62-testimonials{position:relative;overflow:hidden}




/* INTRO BAND */
.step62-introband{background:linear-gradient(135deg,#ffffff 0%,#f6efe6 48%,#efb067 100%);color:#171614;padding:clamp(4.75rem,8vw,7rem) 0}
.step62-introband-inner{max-width:980px}
.step62-introband-kicker{margin:0 0 18px;font-size:.76rem;font-weight:800;letter-spacing:.16em;color:rgba(23,22,20,.68)}
.step62-introband h2{margin:0 0 24px;font-size:clamp(2.6rem,6vw,5.8rem);line-height:.92;letter-spacing:-.05em}
.step62-introband p{max-width:62ch;margin:0 0 18px;font-size:clamp(1.08rem,1.8vw,1.42rem);line-height:1.75;color:#3b352e}
.step62-introband-emphasis{font-weight:800;color:#171614}

/* PROCESS */
.step62-process{background:#f0ece3;color:#171614;padding:clamp(5rem,8vw,8rem) 0}
.step62-process-head{max-width:900px;margin:0 0 clamp(3rem,6vw,5.5rem)}
.step62-process-head h2,.step62-services-head h2,.step62-testimonials-head h2{margin:0;font-size:clamp(2.8rem,6.4vw,6rem);line-height:.9;letter-spacing:-.05em}
.step62-process-head>p:last-child,.step62-services-head>p:last-child,.step62-testimonials-head>p:last-child{max-width:62ch;margin:20px 0 0;color:#655f56;line-height:1.7}
.step62-process-story{display:grid;gap:0;border-top:1px solid rgba(23,22,20,.15)}
.step62-process-chapter{display:grid;grid-template-columns:minmax(0,.75fr) minmax(0,1.25fr);gap:clamp(2rem,5vw,5rem);align-items:center;padding:clamp(2.7rem,5vw,5.5rem) 0;border-bottom:1px solid rgba(23,22,20,.15)}
.step62-process-chapter--reverse .step62-process-copy{order:2}
.step62-process-chapter--reverse .step62-process-media{order:1}
.step62-process-copy{max-width:520px}
.step62-process-word{margin:0 0 22px;font-size:clamp(2.2rem,5vw,4.8rem);font-weight:900;letter-spacing:-.055em;line-height:.85}
.step62-process-copy h3{margin:0 0 14px;font-size:clamp(1.25rem,2vw,1.8rem)}
.step62-process-copy>p:last-child{margin:0;color:#645f57;line-height:1.75}
.step62-process-media{margin:0;min-height:420px;overflow:hidden;border-radius:2px;background:#ddd;clip-path:inset(8% 0 8% 0);transition:clip-path .8s cubic-bezier(.2,.8,.2,1),transform .8s cubic-bezier(.2,.8,.2,1),opacity .8s ease;opacity:.55;transform:translateY(26px)}
.step62-process-media img{display:block;width:100%;height:100%;min-height:420px;object-fit:cover;object-position:center top}
.step62-process-media--portrait img{object-position:center 20%}
.step62-process-chapter.is-visible .step62-process-media{clip-path:inset(0);opacity:1;transform:none}

/* SERVICES */
.step62-services{background:#101211;color:#f5f2eb;padding:clamp(5rem,8vw,8rem) 0}
.step62-services .step62-eyebrow{color:#aaa59c}
.step62-services-head{max-width:940px;margin-bottom:clamp(2.8rem,5vw,4.5rem)}
.step62-services-head>p:last-child{color:#aaa59f}
.step62-service-layout{display:grid;grid-template-columns:minmax(190px,.34fr) minmax(0,1fr);gap:clamp(2rem,5vw,5rem);align-items:start}
.step62-service-nav{position:sticky;top:100px;display:grid;border-top:1px solid rgba(255,255,255,.16)}
.step62-service-tab{appearance:none;border:0;border-bottom:1px solid rgba(255,255,255,.16);background:transparent;color:#8d8e8a;text-align:left;padding:22px 0;font:inherit;font-size:clamp(1.35rem,2.2vw,2rem);font-weight:800;cursor:pointer;transition:color .25s ease,padding-left .25s ease}
.step62-service-tab:hover,.step62-service-tab.is-active{color:#fff;padding-left:8px}
.step62-service-panel{min-height:650px}
.step62-service-panel[hidden]{display:none!important}
.step62-panel-copy{display:grid;grid-template-columns:minmax(0,1fr) minmax(260px,.72fr);gap:28px;align-items:end;margin-bottom:26px}
.step62-panel-kicker{grid-column:1/-1;margin:0 0 -12px;color:#aaa59f;font-size:.74rem;font-weight:800;letter-spacing:.14em}
.step62-panel-copy h3{margin:0;font-size:clamp(2rem,4.4vw,4.4rem);line-height:.92;letter-spacing:-.04em;max-width:12ch}
.step62-panel-copy>p:last-of-type{margin:0;color:#aaa9a4;line-height:1.7}

/* Website devices */
.step62-device-switch{grid-column:1/-1;display:flex;gap:18px;margin-top:4px;border-bottom:1px solid rgba(255,255,255,.14)}
.step62-device-switch button,.step62-system-menu button{appearance:none;border:0;background:transparent;color:#8d8e89;padding:10px 0 12px;font:inherit;font-weight:700;cursor:pointer;border-bottom:2px solid transparent}
.step62-device-switch button.is-active,.step62-system-menu button.is-active{color:#fff;border-color:#fff}
.step62-live-device{display:grid;place-items:center;min-height:560px;padding:28px;background:#e8e1d3;overflow:hidden}
.step62-live-device[hidden]{display:none!important}
.step62-live-device-shell{position:relative;background:#1a1a19;box-shadow:0 30px 80px rgba(0,0,0,.35);overflow:hidden}
.step62-live-device-shell--desktop{width:min(94%,900px);border-radius:20px;padding:10px}
.step62-live-device-shell--tablet{width:min(62%,620px);aspect-ratio:4/3;border-radius:32px;padding:14px}
.step62-live-device-shell--mobile{width:min(34%,340px);aspect-ratio:9/18;border-radius:38px;padding:12px}
.step62-live-device-top{height:34px;display:flex;align-items:center;gap:6px;padding:0 8px;color:#c6c1b7;font-size:.7rem}
.step62-live-device-top span{width:7px;height:7px;border-radius:50%;background:#6a6862}.step62-live-device-top b{margin-left:8px;font-weight:600}
.step62-live-device-screen{position:relative;width:100%;aspect-ratio:16/10;background-size:cover;background-position:center top;overflow:hidden;border-radius:11px}
.step62-live-device-shell--tablet .step62-live-device-screen{height:100%;aspect-ratio:auto;border-radius:20px}
.step62-live-device-shell--mobile .step62-live-device-screen{height:100%;aspect-ratio:auto;border-radius:28px}
.step62-live-device-screen iframe{position:absolute;inset:0;width:100%;height:100%;border:0;background:transparent}

/* Brands */
.step62-brand-stage{display:grid;grid-template-columns:1fr 1fr;gap:22px}
.step62-brand-piece{background:#ece7dd;color:#1a1916;padding:22px;min-height:520px}
.step62-brand-labels{display:flex;justify-content:space-between;gap:12px;padding-bottom:14px;border-bottom:1px solid rgba(0,0,0,.16);font-size:.72rem;font-weight:800;letter-spacing:.08em}
.step62-brand-change{display:grid;grid-template-columns:.7fr 1.3fr;gap:18px;align-items:stretch;margin-top:26px}
.step62-brand-old{display:flex;flex-direction:column;justify-content:center;min-height:330px;padding:24px;border:1px solid rgba(0,0,0,.18);font-family:Georgia,serif;font-size:clamp(2rem,4vw,4rem);line-height:.9;text-align:center;color:#5d5144}
.step62-brand-old small{font-size:.9rem;line-height:1.3;font-family:inherit;margin-top:16px}
.step62-brand-old--image{padding:0;background:#f7f4ed;overflow:hidden}
.step62-brand-old--image img{display:block;width:100%;height:100%;object-fit:cover;object-position:center}

.step62-brand-now{min-height:330px;overflow:hidden}.step62-brand-now img{width:100%;height:100%;object-fit:cover;display:block}
.step62-brand-note{margin:18px 0 0;color:#6c645a;font-size:.78rem;line-height:1.55}
.step62-brand-praxis-grid{display:grid;gap:18px;margin-top:26px}.step62-brand-praxis-grid img{width:100%;display:block;background:#fff}.step62-brand-praxis-grid img:first-child{max-height:290px;object-fit:cover}

/* Systems */
.step62-system-stage{background:#e8ebeb;color:#151918;padding:28px;min-height:510px}
.step62-system-menu{display:flex;flex-wrap:wrap;gap:24px;border-bottom:1px solid rgba(0,0,0,.16);margin-bottom:34px}
.step62-system-menu button{color:#6c7472;border-color:transparent}.step62-system-menu button.is-active{color:#111;border-color:#111}
.step62-system-panel[hidden]{display:none!important}.step62-system-panel h4{margin:0 0 10px;font-size:clamp(2rem,4vw,4rem);letter-spacing:-.04em}.step62-system-panel>p{max-width:55ch;margin:0 0 36px;color:#5a6461;line-height:1.65}
.step62-system-flow{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));border-top:1px solid rgba(0,0,0,.15);border-bottom:1px solid rgba(0,0,0,.15)}
.step62-system-flow span{min-height:130px;display:flex;align-items:flex-end;padding:16px 12px;border-right:1px solid rgba(0,0,0,.15);font-weight:750}.step62-system-flow span:last-child{border-right:0}

/* Care */
.step62-care-tags{grid-column:1/-1;display:flex;flex-wrap:wrap;gap:9px;margin-top:4px}.step62-care-tags span{border:1px solid rgba(255,255,255,.22);padding:8px 12px;border-radius:999px;font-size:.8rem;color:#c8c4bb}
.step62-care-stage{position:relative;min-height:600px;background:#ece7dd;color:#171614;padding:28px;overflow:hidden}
.step62-care-shot{position:absolute;margin:0;overflow:hidden;background:#111;box-shadow:0 24px 55px rgba(0,0,0,.18)}
.step62-care-shot img{width:100%;height:100%;object-fit:cover;display:block}.step62-care-shot figcaption{position:absolute;left:12px;bottom:12px;background:rgba(20,20,20,.75);color:#fff;padding:8px 10px;font-size:.72rem}
.step62-care-shot--skiclub{left:6%;top:7%;width:52%;height:72%;transform:rotate(-2deg)}.step62-care-shot--dornach{right:6%;bottom:7%;width:43%;height:60%;transform:rotate(2deg)}
.step62-care-special{position:absolute;right:7%;top:7%;width:34%;padding:18px;background:#fff;border:1px solid rgba(0,0,0,.12);box-shadow:0 16px 36px rgba(0,0,0,.08)}.step62-care-special strong{font-size:1.25rem}.step62-care-special p{margin:8px 0 0;color:#655e54;line-height:1.5}


/* Testimonials */
.step62-testimonials{
  background:#eceae6;
  color:#161513;
  padding:clamp(5rem,8vw,7rem) 0;
  cursor:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='40' height='40' viewBox='0 0 40 40'%3E%3Ctext x='20' y='28' text-anchor='middle' font-size='24'%3E%F0%9F%A5%B0%3C/text%3E%3C/svg%3E") 20 20, auto
}
.step62-testimonials .step62-wrap{width:min(1360px,calc(100% - 48px))}
.step62-testimonials *{cursor:inherit}
.step62-testimonials button,.step62-testimonials a{cursor:pointer}
.step62-testimonials-head{
  display:grid;
  grid-template-columns:minmax(0,1fr) minmax(340px,.62fr);
  gap:26px;
  align-items:end;
  margin-bottom:40px
}
.step62-testimonials-head .step62-eyebrow{grid-column:1/-1;margin-bottom:-10px}
.step62-testimonials-head>p:last-child{margin:0;max-width:56ch}
.step62-testimonial-slider{
  display:grid;
  grid-template-columns:auto minmax(0,1fr) auto;
  gap:clamp(18px,2.4vw,34px);
  align-items:center
}
.step62-testimonial-arrow{
  width:68px;
  height:68px;
  border:0;
  background:transparent;
  color:#050505;
  display:grid;
  place-items:center;
  font-size:78px;
  line-height:1;
  border-radius:999px;
  padding:0;
  transition:transform .22s ease,opacity .22s ease
}
.step62-testimonial-arrow:hover{transform:scale(1.07)}
.step62-testimonial-arrow[disabled]{opacity:.18;pointer-events:none}
.step62-testimonial-stage{min-width:0;text-align:center}
.step62-testimonial-copy{display:none}
.step62-testimonial-viewport{
  width:100%;
  max-width:none;
  overflow:hidden;
  margin:0 auto
}
.step62-testimonial-track{
  display:flex;
  width:100%;
  align-items:stretch;
  transition:transform .68s cubic-bezier(.22,1,.36,1);
  will-change:transform
}
.step62-testimonial-page{
  min-width:100%;
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:clamp(18px,2.1vw,30px);
  align-items:start;
  padding:12px 4px 18px
}
.step62-testimonial-slide{
  min-width:0;
  padding:0;
  display:block;
  opacity:0;
  transform:translateY(32px) scale(.985);
  transition:
    opacity .5s ease,
    transform .72s cubic-bezier(.22,1,.36,1)
}
.step62-testimonial-page.is-visible .step62-testimonial-slide{opacity:1;transform:none}
.step62-testimonial-page.is-visible .step62-testimonial-slide:nth-child(1){transition-delay:.04s}
.step62-testimonial-page.is-visible .step62-testimonial-slide:nth-child(2){transition-delay:.16s}
.step62-testimonial-page.is-visible .step62-testimonial-slide:nth-child(3){transition-delay:.28s}
.step62-testimonial-figure{
  margin:0;
  width:100%;
  padding:14px;
  border-radius:32px;
  background:linear-gradient(180deg,rgba(255,255,255,.88),rgba(255,255,255,.64));
  box-shadow:0 24px 54px rgba(31,25,20,.11),inset 0 1px 0 rgba(255,255,255,.76);
  transition:transform .28s ease,box-shadow .28s ease
}
.step62-testimonial-slide:hover .step62-testimonial-figure{
  transform:translateY(-6px);
  box-shadow:0 30px 58px rgba(31,25,20,.14),inset 0 1px 0 rgba(255,255,255,.76)
}
.step62-testimonial-figure img{
  display:block;
  width:100%;
  height:auto;
  border-radius:24px;
  box-shadow:0 18px 34px rgba(29,22,18,.14);
  filter:contrast(1.015) saturate(1.01);
  image-rendering:auto
}
.step62-testimonial-slide--demo .step62-testimonial-figure{position:relative;overflow:hidden}
.step62-testimonial-slide--demo .step62-testimonial-figure::before{
  content:"";
  position:absolute;
  inset:10px;
  border-radius:24px;
  pointer-events:none;
  opacity:.9
}
.step62-testimonial-slide--demo-a .step62-testimonial-figure{
  background:linear-gradient(180deg,rgba(255,251,243,.96),rgba(244,239,231,.86));
}
.step62-testimonial-slide--demo-a .step62-testimonial-figure::before{
  border:1px solid rgba(188,169,128,.28)
}
.step62-testimonial-slide--demo-b .step62-testimonial-figure{
  background:linear-gradient(180deg,rgba(255,255,255,.96),rgba(240,236,228,.88));
}
.step62-testimonial-slide--demo-b .step62-testimonial-figure::before{
  box-shadow:inset 0 0 0 1px rgba(124,139,114,.22)
}
.step62-testimonial-slide--demo-c .step62-testimonial-figure{
  background:linear-gradient(180deg,rgba(249,247,242,.96),rgba(235,231,225,.90));
}
.step62-testimonial-slide--demo-c .step62-testimonial-figure::before{
  box-shadow:inset 0 0 0 1px rgba(55,50,44,.12),0 0 0 1px rgba(255,255,255,.34)
}
.step62-testimonial-nav{
  display:grid;
  justify-items:center;
  gap:20px;
  margin-top:26px
}
.step62-testimonial-dots{
  display:flex;
  gap:10px;
  align-items:center;
  justify-content:center
}
.step62-testimonial-dots button{
  width:14px;
  height:14px;
  border-radius:999px;
  border:0;
  background:rgba(0,0,0,.18);
  padding:0;
  transition:transform .2s ease,background .2s ease
}
.step62-testimonial-dots button.is-active{
  background:#050505;
  transform:scale(1.04)
}
.step62-testimonial-cta{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  padding:1rem 2.5rem;
  border-radius:999px;
  background:#f7f4ee;
  border:2px solid #101010;
  color:#101010;
  text-decoration:none;
  font-family:'Montserrat',system-ui,sans-serif;
  font-size:clamp(1rem,1.4vw,1.2rem);
  font-weight:800;
  letter-spacing:-.025em;
  box-shadow:0 6px 0 #101010;
  transition:transform .2s ease,box-shadow .2s ease
}
.step62-testimonial-cta:hover{transform:translateY(-2px);box-shadow:0 9px 0 #101010}

@media(max-width:980px){
  .step62-service-layout{grid-template-columns:1fr}.step62-service-nav{position:relative;top:auto;grid-template-columns:repeat(4,1fr)}
  .step62-service-tab{padding:14px 8px;font-size:1rem;text-align:center;border-right:1px solid rgba(255,255,255,.14)}
  .step62-panel-copy,.step62-testimonials-head{grid-template-columns:1fr}.step62-brand-stage{grid-template-columns:1fr}
  .step62-testimonial-slider{grid-template-columns:1fr}
  .step62-testimonial-arrow{display:none}
  .step62-testimonial-page{grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}
  .step62-process-chapter,.step62-process-chapter--reverse{grid-template-columns:1fr}.step62-process-chapter--reverse .step62-process-copy,.step62-process-chapter--reverse .step62-process-media{order:initial}
  .step62-testimonial-quote{font-size:clamp(1.55rem,9vw,2.15rem)}.step62-testimonial-name{font-size:clamp(1.25rem,6vw,1.65rem)}.step62-testimonial-role{font-size:1rem}
  .step62-testimonial-figure{padding:12px;border-radius:26px;width:min(100%,98vw)}.step62-testimonial-figure img{border-radius:20px}
  .step62-testimonial-nav{gap:22px}
  .step62-testimonial-cta{padding:1rem 1.8rem;font-size:1.05rem;width:min(100%,320px)}
  .step62-system-flow{grid-template-columns:1fr}.step62-system-flow span{min-height:72px;border-right:0;border-bottom:1px solid rgba(0,0,0,.12)}
}
@media(max-width:640px){

  .step62-wrap{width:min(100% - 26px,1180px)}.step62-testimonials .step62-wrap{width:min(100% - 26px,1360px)}.step62-service-nav{grid-template-columns:1fr 1fr}
  .step62-live-device{min-height:430px;padding:14px}.step62-live-device-shell--desktop{width:100%}.step62-live-device-shell--tablet{width:86%}.step62-live-device-shell--mobile{width:58%}
  .step62-brand-change{grid-template-columns:1fr}.step62-care-stage{min-height:720px}.step62-care-shot--skiclub{width:72%;height:48%}.step62-care-shot--dornach{width:62%;height:42%;bottom:6%}.step62-care-special{width:56%;right:4%}

  .step62-testimonial-page{grid-template-columns:1fr;gap:18px}
  .step62-testimonial-figure{padding:9px;border-radius:22px}
  .step62-testimonial-figure img{border-radius:16px}
}


/* STEP62O · Header wie Zwetschke reduziert: nur MENÜ sichtbar */
.step62-minimal-head .brand,
.step62-minimal-head .nav,
.step62-minimal-head .head-in > .btn,
.step62-minimal-head .progress{
  display:none!important;
}
.step62-minimal-head-in{
  justify-content:flex-end!important;
  min-height:72px;
}
.step62-menu-only{
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
  width:auto!important;
  height:auto!important;
  min-width:0!important;
  padding:10px 0 10px 18px!important;
  border:0!important;
  background:transparent!important;
  box-shadow:none!important;
  color:inherit!important;
  font:inherit!important;
  font-size:.86rem!important;
  font-weight:800!important;
  letter-spacing:.12em!important;
  line-height:1!important;
  text-transform:uppercase!important;
}
.step62-menu-only::before{content:"MENÜ"}
.step62-menu-only i{display:none!important}
.step62-minimal-drawer-links{
  display:flex;
  flex-direction:column;
  align-items:flex-start;
  gap:0;
}
.step62-minimal-drawer-links a{
  width:100%;
}
@media(max-width:720px){
  .step62-minimal-head-in{min-height:64px}
  .step62-menu-only{font-size:.8rem!important}
}


/* STEP62P · Floating Leiste auf MENÜ reduzieren */
.step62-minimal-head{display:none!important;}
.rail--menu-only{
  position:fixed;
  left:50%;
  bottom:22px;
  transform:translateX(-50%);
  z-index:1200;
  display:flex;
  align-items:center;
  justify-content:center;
  padding:8px;
  border-radius:999px;
  background:#111;
  border:2px solid #111;
  box-shadow:0 16px 36px rgba(0,0,0,.22);
  min-width:0;
}
.rail--menu-only .rail-menu-toggle{
  appearance:none;
  border:2px solid #111;
  background:#d4f31c;
  color:#111;
  min-width:188px;
  height:62px;
  padding:0 26px;
  border-radius:999px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:16px;
  font-size:.96rem;
  font-weight:900;
  letter-spacing:.16em;
  text-transform:uppercase;
  cursor:pointer;
  box-shadow:inset 0 0 0 2px rgba(255,255,255,.22);
  transition:transform .22s ease, box-shadow .22s ease, background .22s ease;
}
.rail--menu-only .rail-menu-toggle:hover{transform:translateY(-1px)}
.rail-menu-icon,
.rail-menu-icon::before,
.rail-menu-icon::after{
  display:block;
  width:15px;
  height:2px;
  border-radius:999px;
  background:currentColor;
  content:'';
}
.rail-menu-icon{position:relative}
.rail-menu-icon::before{position:absolute;top:-5px;left:0}
.rail-menu-icon::after{position:absolute;top:5px;left:0}
.rail-menu-panel{
  position:absolute;
  left:50%;
  bottom:calc(100% + 14px);
  transform:translate(-50%,18px);
  width:min(340px,82vw);
  padding:18px;
  border-radius:34px;
  background:#d4f31c;
  border:3px solid #111;
  box-shadow:0 22px 50px rgba(0,0,0,.22);
  display:flex;
  flex-direction:column;
  gap:8px;
  opacity:0;
  pointer-events:none;
  transition:opacity .24s ease, transform .24s ease;
}
.rail--menu-only.is-open .rail-menu-panel{
  opacity:1;
  pointer-events:auto;
  transform:translate(-50%,0);
}
.rail-menu-panel a{
  display:flex;
  align-items:center;
  justify-content:center;
  min-height:62px;
  padding:0 18px;
  border-radius:999px;
  color:#111;
  text-decoration:none;
  text-transform:uppercase;
  font-size:1.02rem;
  font-weight:900;
  letter-spacing:.06em;
  transition:background .2s ease, color .2s ease, transform .2s ease;
}
.rail-menu-panel a:hover{background:rgba(17,17,17,.08);transform:translateY(-1px)}
.rail-menu-panel a.is-current{
  background:#111;
  color:#fff;
}
@media (max-width:720px){
  .rail--menu-only{bottom:16px;padding:7px}
  .rail--menu-only .rail-menu-toggle{min-width:172px;height:58px;padding:0 22px;font-size:.88rem}
  .rail-menu-panel{width:min(320px,88vw);padding:15px;border-radius:28px}
  .rail-menu-panel a{min-height:58px;font-size:.94rem}
}


/* STEP62Q · Nur dicker Comic-Menübalken + größeres Comic-Menü */
.step62-menu-only{display:none!important;}
.rail--menu-only{
  padding:10px;
  border-radius:999px;
  background:#171717;
  border:0;
  box-shadow:0 0 0 3px #171717, -5px 5px 0 #c85a2d, 0 16px 34px rgba(0,0,0,.25);
}
.rail--menu-only .rail-menu-toggle{
  min-width:232px;
  height:68px;
  padding:0 30px;
  border:3px solid #171717;
  border-radius:999px;
  background:#e6f76c;
  color:#111;
  font-family:Impact, Haettenschweiler, 'Arial Black', 'Franklin Gothic Heavy', sans-serif;
  font-size:1.14rem;
  font-weight:900;
  letter-spacing:.14em;
  text-transform:uppercase;
  box-shadow:inset 0 0 0 2px rgba(255,255,255,.28);
}
.rail--menu-only .rail-menu-toggle:hover{
  transform:translateY(-2px) scale(1.01);
}
.rail-menu-icon,
.rail-menu-icon::before,
.rail-menu-icon::after{
  width:16px;
  height:2.6px;
}
.rail-menu-icon::before{top:-5.5px}
.rail-menu-icon::after{top:5.5px}
.rail-menu-panel{
  width:min(390px,86vw);
  padding:20px 18px;
  border-radius:34px;
  background:#d9f51f;
  border:3px solid #171717;
  box-shadow:0 0 0 3px #171717, -5px 5px 0 #c85a2d, 0 24px 44px rgba(0,0,0,.24);
}
.rail-menu-panel a{
  min-height:72px;
  border-radius:28px;
  font-family:Impact, Haettenschweiler, 'Arial Black', 'Franklin Gothic Heavy', sans-serif;
  font-size:1.46rem;
  letter-spacing:.03em;
  line-height:1;
}
.rail-menu-panel a.is-current{
  background:#111;
  color:#fff;
}
.rail-menu-panel a:hover{
  background:rgba(17,17,17,.1);
  transform:translateY(-2px) scale(1.01);
}
@media (max-width:720px){
  .rail--menu-only{padding:9px}
  .rail--menu-only .rail-menu-toggle{min-width:210px;height:64px;font-size:1.02rem;padding:0 26px}
  .rail-menu-panel{width:min(350px,90vw);padding:18px 16px;border-radius:30px}
  .rail-menu-panel a{min-height:66px;font-size:1.28rem}
}


/* STEP62R · Zwetschke-orientiert: nur der kompakte rechte MENÜ-Pill, ohne schwarzen Außenrand */
.rail--menu-only{
  padding:0!important;
  background:transparent!important;
  border:0!important;
  box-shadow:none!important;
  border-radius:999px!important;
}
.rail--menu-only .rail-menu-toggle{
  min-width:150px!important;
  height:58px!important;
  padding:0 24px!important;
  gap:14px!important;
  background:#d7f51f!important;
  color:#111!important;
  border:0!important;
  border-radius:999px!important;
  box-shadow:0 8px 20px rgba(0,0,0,.14)!important;
  font-family:Arial, Helvetica, sans-serif!important;
  font-size:.98rem!important;
  font-weight:900!important;
  letter-spacing:.11em!important;
  text-transform:uppercase!important;
}
.rail--menu-only .rail-menu-toggle:hover{
  transform:translateY(-2px)!important;
  box-shadow:0 11px 24px rgba(0,0,0,.16)!important;
}
.rail-menu-icon,
.rail-menu-icon::before,
.rail-menu-icon::after{
  width:16px!important;
  height:2px!important;
  border-radius:999px!important;
  background:#111!important;
}
.rail-menu-icon::before{top:-5px!important}
.rail-menu-icon::after{top:5px!important}
.rail-menu-panel{
  bottom:calc(100% + 12px)!important;
  width:min(360px,86vw)!important;
  padding:18px 16px!important;
  border-radius:30px!important;
  background:#d7f51f!important;
  border:0!important;
  box-shadow:0 18px 40px rgba(0,0,0,.18)!important;
}
.rail-menu-panel a{
  min-height:64px!important;
  font-family:Arial Black, Arial, Helvetica, sans-serif!important;
  font-size:1.25rem!important;
  letter-spacing:.02em!important;
  border-radius:999px!important;
}
.rail-menu-panel a.is-current{
  background:#111!important;
  color:#fff!important;
}
@media(max-width:720px){
  .rail--menu-only .rail-menu-toggle{
    min-width:138px!important;
    height:54px!important;
    padding:0 22px!important;
    font-size:.9rem!important;
  }
  .rail-menu-panel{width:min(330px,90vw)!important;padding:16px 14px!important}
  .rail-menu-panel a{min-height:60px!important;font-size:1.12rem!important}
}


/* STEP62U · Bubbly Menü + originales Share-Menü 1:1 aus share-menu.zip */
.rail--menu-with-share{
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  gap:12px!important;
  overflow:visible!important;
}
.rail-menu-anchor{position:relative;z-index:3}
.rail--menu-with-share .rail-menu-toggle{
  min-width:206px!important;
  height:66px!important;
  padding:0 30px!important;
  gap:15px!important;
  font-family:"Baloo 2",Arial,sans-serif!important;
  font-size:1.28rem!important;
  font-weight:800!important;
  letter-spacing:.075em!important;
  box-shadow:0 10px 24px rgba(0,0,0,.14)!important;
}
.rail--menu-with-share .rail-menu-panel{
  left:50%!important;
  transform:translate(-50%,18px)!important;
  width:min(370px,86vw)!important;
  font-family:"Baloo 2",Arial,sans-serif!important;
}
.rail--menu-with-share.is-open .rail-menu-panel{
  transform:translate(-50%,0)!important;
}
.rail--menu-with-share .rail-menu-panel a{
  font-family:"Baloo 2",Arial,sans-serif!important;
  font-size:1.34rem!important;
  font-weight:800!important;
}
.rail-share-slot{
  position:relative;
  width:66px;
  height:66px;
  flex:0 0 66px;
  overflow:visible;
  z-index:2;
}
/* Das eigentliche .share bleibt unverändert; nur sein Mittelpunkt wird neben MENÜ positioniert. */
.rail-share-slot .share{
  position:absolute;
  left:50%;
  top:50%;
  transform:translate(-50%,-50%);
  z-index:1;
}
@media(max-width:720px){
  .rail--menu-with-share{gap:9px!important}
  .rail--menu-with-share .rail-menu-toggle{min-width:174px!important;height:60px!important;padding:0 24px!important;font-size:1.12rem!important}
  .rail-share-slot{width:60px;height:60px;flex-basis:60px}
}


/* STEP62V · Dock hoeher wie Referenz, damit das originale Share-Raster komplett im Viewport bleibt */
.rail--menu-with-share{
  bottom:clamp(92px,11vh,128px)!important;
  overflow:visible!important;
}
.rail--menu-with-share .rail-menu-anchor,
.rail--menu-with-share .rail-share-slot,
.rail--menu-with-share .share{
  overflow:visible!important;
}
.rail--menu-with-share .rail-menu-panel{
  bottom:calc(100% + 18px)!important;
}
/* Das Share-Menue bleibt 1:1 aus share-menu.zip; nur die Position des gesamten Docks wird angehoben. */
@media(max-width:720px){
  .rail--menu-with-share{
    bottom:clamp(78px,10vh,104px)!important;
  }
}
@media(max-height:700px){
  .rail--menu-with-share{
    bottom:72px!important;
  }
}


/* STEP62W · Menü höher + Bubble-Typo + beweglicher Scroll/Highlight-Pill wie Referenz */
.rail--menu-with-share{
  bottom:clamp(150px,18vh,195px)!important;
  overflow:visible!important;
}
.rail--menu-with-share .rail-menu-toggle{
  min-width:232px!important;
  height:74px!important;
  padding:0 34px!important;
  gap:17px!important;
  background:#d7f51f!important;
  font-family:"Titan One","Baloo 2","Arial Black",sans-serif!important;
  font-size:1.38rem!important;
  font-weight:400!important;
  letter-spacing:.07em!important;
  line-height:1!important;
  text-shadow:.45px 0 0 currentColor,-.45px 0 0 currentColor,0 .45px 0 currentColor,0 -.45px 0 currentColor!important;
}
.rail--menu-with-share .rail-menu-icon,
.rail--menu-with-share .rail-menu-icon::before,
.rail--menu-with-share .rail-menu-icon::after{
  width:19px!important;
  height:3px!important;
}
.rail--menu-with-share .rail-menu-icon::before{top:-6px!important}
.rail--menu-with-share .rail-menu-icon::after{top:6px!important}
.rail-share-slot{
  width:74px!important;
  height:74px!important;
  flex:0 0 74px!important;
}
.rail-menu-panel{
  bottom:calc(100% + 20px)!important;
  width:min(390px,88vw)!important;
  padding:18px 16px!important;
  border-radius:38px!important;
  background:#d7f51f!important;
  box-shadow:0 22px 46px rgba(0,0,0,.20)!important;
  gap:4px!important;
  overflow:hidden!important;
  isolation:isolate!important;
}
.rail-menu-highlight{
  position:absolute;
  z-index:0;
  left:16px;
  right:16px;
  top:0;
  height:var(--menu-h,70px);
  transform:translateY(var(--menu-y,18px));
  border-radius:999px;
  background:#111;
  box-shadow:0 7px 0 rgba(0,0,0,.10);
  transition:transform .34s cubic-bezier(.22,1,.36,1),height .34s cubic-bezier(.22,1,.36,1);
  pointer-events:none;
}
.rail-menu-highlight.is-instant{transition:none!important}
.rail-menu-panel a{
  position:relative!important;
  z-index:1!important;
  min-height:70px!important;
  padding:0 24px!important;
  border-radius:999px!important;
  background:transparent!important;
  color:#111!important;
  font-family:"Titan One","Baloo 2","Arial Black",sans-serif!important;
  font-size:1.58rem!important;
  font-weight:400!important;
  letter-spacing:.025em!important;
  line-height:1!important;
  text-shadow:.35px 0 0 currentColor,-.35px 0 0 currentColor,0 .35px 0 currentColor,0 -.35px 0 currentColor!important;
  transition:color .18s ease,transform .2s ease!important;
}
.rail-menu-panel a.is-current{background:transparent!important;color:#111!important}
.rail-menu-panel a.is-highlighted{color:#d7f51f!important;transform:scale(1.02)!important}
.rail-menu-panel a:hover{background:transparent!important}
.rail-menu-panel::after{
  content:"SCROLL / HOVER";
  position:absolute;
  right:17px;
  bottom:8px;
  z-index:2;
  font-family:"Baloo 2",Arial,sans-serif;
  font-size:.6rem;
  font-weight:800;
  letter-spacing:.14em;
  color:rgba(17,17,17,.42);
}
@media(max-width:720px){
  .rail--menu-with-share{bottom:clamp(120px,16vh,150px)!important}
  .rail--menu-with-share .rail-menu-toggle{min-width:198px!important;height:68px!important;padding:0 28px!important;font-size:1.22rem!important}
  .rail-share-slot{width:68px!important;height:68px!important;flex-basis:68px!important}
  .rail-menu-panel{width:min(350px,91vw)!important;padding:15px 13px 18px!important;border-radius:32px!important}
  .rail-menu-highlight{left:13px;right:13px}
  .rail-menu-panel a{min-height:64px!important;font-size:1.35rem!important}
}
@media(max-height:700px){
  .rail--menu-with-share{bottom:120px!important}
  .rail-menu-panel a{min-height:58px!important;font-size:1.25rem!important}
  .rail-menu-panel{padding-top:13px!important;padding-bottom:16px!important}
}


/* STEP62X · Dock nochmals höher + Coiny als kräftige Bubble-Schrift */
.rail--menu-with-share{
  bottom:clamp(235px,28vh,315px)!important;
}
.rail--menu-with-share .rail-menu-toggle{
  min-width:244px!important;
  height:78px!important;
  padding:0 36px!important;
  gap:18px!important;
  font-family:"Coiny","Titan One","Baloo 2",sans-serif!important;
  font-size:1.48rem!important;
  font-weight:400!important;
  letter-spacing:.055em!important;
  -webkit-text-stroke:.32px currentColor;
  text-shadow:.55px 0 0 currentColor,-.55px 0 0 currentColor,0 .55px 0 currentColor,0 -.55px 0 currentColor!important;
}
.rail-menu-panel a{
  font-family:"Coiny","Titan One","Baloo 2",sans-serif!important;
  font-size:1.64rem!important;
  letter-spacing:.015em!important;
  -webkit-text-stroke:.22px currentColor;
  text-shadow:.38px 0 0 currentColor,-.38px 0 0 currentColor,0 .38px 0 currentColor,0 -.38px 0 currentColor!important;
}
/* kleiner sichtbarer Scroll-Indikator rechts im Menü */
.rail-menu-panel::before{
  content:"";
  position:absolute;
  z-index:3;
  right:8px;
  top:22px;
  bottom:22px;
  width:4px;
  border-radius:99px;
  background:rgba(17,17,17,.13);
  pointer-events:none;
}
.rail-menu-highlight::after{
  content:"";
  position:absolute;
  right:-10px;
  top:50%;
  width:6px;
  height:24px;
  border-radius:99px;
  background:#111;
  transform:translateY(-50%);
  box-shadow:0 0 0 3px #d7f51f;
  pointer-events:none;
}
@media(max-width:720px){
  .rail--menu-with-share{bottom:clamp(190px,24vh,240px)!important}
  .rail--menu-with-share .rail-menu-toggle{min-width:210px!important;height:70px!important;padding:0 30px!important;font-size:1.28rem!important}
  .rail-menu-panel a{font-size:1.4rem!important}
}
@media(max-height:700px){
  .rail--menu-with-share{bottom:205px!important}
}
@media(max-height:580px){
  .rail--menu-with-share{bottom:170px!important}
}


/* STEP62Y · Cooper Black Variante 4
   Cooper-Black-Look, zusätzlich verdickt und leicht runder skaliert. */
.rail--menu-with-share .rail-menu-toggle{
  font-family:"Cooper Black","Cooper Std Black","CooperBlackStd",Georgia,serif!important;
  font-weight:900!important;
  font-size:1.34rem!important;
  letter-spacing:-.01em!important;
  -webkit-text-stroke:1.3px currentColor;
  transform-origin:center center;
}
.rail--menu-with-share .rail-menu-toggle > span:last-child{
  display:inline-block;
  transform:scaleX(1.035) scaleY(1.04);
  transform-origin:center center;
}
.rail-menu-panel a{
  font-family:"Cooper Black","Cooper Std Black","CooperBlackStd",Georgia,serif!important;
  font-weight:900!important;
  letter-spacing:-.01em!important;
  -webkit-text-stroke:.75px currentColor;
}
.rail-menu-panel a > span,
.rail-menu-panel a{
  font-synthesis:weight style;
}
@media(max-width:720px){
  .rail--menu-with-share .rail-menu-toggle{
    font-size:1.24rem!important;
  }
  .rail-menu-panel a{
    font-size:1.34rem!important;
  }
}


/* ==================================================================
   STEP62Z · höheres Dock, fast transparente Hülle, Seitenthemen
   ================================================================== */
body[data-mn-page="home"]{
  --mn-menu-accent:#D8F024;
  --mn-menu-ink:#111;
}

/* deutlich höher: das 3x3 Share-Raster bleibt vollständig im Sichtbereich */
.rail--menu-with-share{
  bottom:clamp(340px,39vh,440px)!important;
  padding:8px!important;
  gap:10px!important;
  background:rgba(17,17,17,.065)!important;
  border:1px solid rgba(17,17,17,.10)!important;
  box-shadow:0 14px 34px rgba(0,0,0,.075)!important;
  -webkit-backdrop-filter:blur(9px);
  backdrop-filter:blur(9px);
  border-radius:999px!important;
}
.rail--menu-with-share .rail-menu-toggle{
  background:var(--mn-menu-accent,#D8F024)!important;
  color:var(--mn-menu-ink,#111)!important;
  box-shadow:0 8px 20px rgba(0,0,0,.10)!important;
}
.rail--menu-with-share .rail-menu-panel{
  background:var(--mn-menu-accent,#D8F024)!important;
  border:1px solid rgba(17,17,17,.10)!important;
  box-shadow:0 20px 42px rgba(0,0,0,.13)!important;
}
.rail-menu-panel a.is-highlighted{
  color:var(--mn-menu-accent,#D8F024)!important;
}
.rail-menu-highlight::after{
  box-shadow:0 0 0 3px var(--mn-menu-accent,#D8F024)!important;
}
.rail--menu-with-share .share{
  --lime:var(--mn-menu-accent,#D8F024)!important;
}

@media(max-width:720px){
  .rail--menu-with-share{
    bottom:clamp(255px,32vh,330px)!important;
    padding:6px!important;
  }
}
@media(max-height:700px){
  .rail--menu-with-share{bottom:270px!important}
}
@media(max-height:580px){
  .rail--menu-with-share{bottom:225px!important}
}

/* ==================================================================
   STEP62AA · Dock-Position Feinschliff
   Homepage: nochmals etwas höher.
   Unterseiten: separat in mn-subpages.css deutlich tiefer.
   ================================================================== */
body[data-mn-page="home"] .rail--menu-with-share{
  bottom:clamp(375px,43vh,475px)!important;
}
@media(max-width:720px){
  body[data-mn-page="home"] .rail--menu-with-share{
    bottom:clamp(285px,36vh,355px)!important;
  }
}
@media(max-height:700px){
  body[data-mn-page="home"] .rail--menu-with-share{bottom:300px!important}
}
@media(max-height:580px){
  body[data-mn-page="home"] .rail--menu-with-share{bottom:255px!important}
}


/* STEP62AB · Dock auf allen Seiten identisch tiefer
   Hauptseite und Unterseiten teilen jetzt dieselbe Position.
   Genug Abstand bleibt für das vollständig geöffnete Share-Menü. */
:root{
  --mn-dock-bottom: 34px;
}

.rail,
.rail--menu-only,
.rail--menu-share,
.rail--menu-with-share,
body.home .rail,
body.is-home .rail,
body[data-page="home"] .rail,
body.subpage .rail,
body.is-subpage .rail,
body[data-page] .rail{
  bottom: var(--mn-dock-bottom) !important;
}

/* Niedrige Viewports: nur so weit anheben, wie es für das Share-Raster nötig ist. */
@media (max-height: 820px){
  :root{ --mn-dock-bottom: 38px; }
}
@media (max-height: 720px){
  :root{ --mn-dock-bottom: 44px; }
}
@media (max-height: 640px){
  :root{ --mn-dock-bottom: 50px; }
}


/* STEP62AC · Dock nochmals weiter nach unten */
:root{
  --mn-dock-bottom: 16px;
}

.rail,
.rail--menu-only,
.rail--menu-share,
.rail--menu-with-share,
body.home .rail,
body.is-home .rail,
body[data-page="home"] .rail,
body.subpage .rail,
body.is-subpage .rail,
body[data-page] .rail{
  bottom: var(--mn-dock-bottom) !important;
}

/* Nur bei sehr niedrigen Viewports leicht anheben,
   damit das vollständig geöffnete Share-Menü im Bild bleibt. */
@media (max-height: 820px){
  :root{ --mn-dock-bottom: 20px; }
}
@media (max-height: 720px){
  :root{ --mn-dock-bottom: 26px; }
}
@media (max-height: 640px){
  :root{ --mn-dock-bottom: 34px; }
}


/* STEP62AD · Share-Menü näher an den unteren Seitenrand
   Ziel: der lila markierte Abstand unter den Share-Kacheln verschwindet,
   die geöffneten Kacheln schließen fast mit dem Seitenrand ab bzw. liegen minimal darüber. */
:root{
  --mn-dock-bottom: 6px;
}

.rail,
.rail--menu-only,
.rail--menu-share,
.rail--menu-with-share,
body.home .rail,
body.is-home .rail,
body[data-page="home"] .rail,
body.subpage .rail,
body.is-subpage .rail,
body[data-page] .rail{
  bottom: var(--mn-dock-bottom) !important;
}

/* Auf kleineren Höhen nur so viel Sicherheitsabstand wie nötig */
@media (max-height: 820px){
  :root{ --mn-dock-bottom: 10px; }
}
@media (max-height: 720px){
  :root{ --mn-dock-bottom: 16px; }
}
@media (max-height: 640px){
  :root{ --mn-dock-bottom: 24px; }
}


/* STEP62AE · Dock final näher an den unteren Rand
   Das geöffnete Share-Raster soll unten bündig bzw. nur minimal oberhalb enden. */
:root{
  --mn-dock-bottom: 30px;
}
.rail,
.rail--menu-only,
.rail--menu-share,
.rail--menu-with-share,
body.home .rail,
body.is-home .rail,
body[data-page="home"] .rail,
body.subpage .rail,
body.is-subpage .rail,
body[data-page] .rail{
  bottom: var(--mn-dock-bottom) !important;
}
@media (max-height: 700px){
  :root{ --mn-dock-bottom: 32px; }
}
@media (max-height: 580px){
  :root{ --mn-dock-bottom: 34px; }
}


/* STEP62AF · Feinkorrektur: Dock nur minimal höher als AE */
:root{
  --mn-dock-bottom: 36px;
}
.rail,
.rail--menu-only,
.rail--menu-share,
.rail--menu-with-share,
body.home .rail,
body.is-home .rail,
body[data-page="home"] .rail,
body.subpage .rail,
body.is-subpage .rail,
body[data-page] .rail{
  bottom: var(--mn-dock-bottom) !important;
}
@media (max-height: 700px){
  :root{ --mn-dock-bottom: 38px; }
}
@media (max-height: 580px){
  :root{ --mn-dock-bottom: 40px; }
}


/* STEP62AG · Dock nochmals leicht höher
   Nur ein kleiner weiterer Schritt gegenüber AF. */
:root{
  --mn-dock-bottom: 42px;
}
.rail,
.rail--menu-only,
.rail--menu-share,
.rail--menu-with-share,
body.home .rail,
body.is-home .rail,
body[data-page="home"] .rail,
body.subpage .rail,
body.is-subpage .rail,
body[data-page] .rail{
  bottom: var(--mn-dock-bottom) !important;
}
@media (max-height: 700px){
  :root{ --mn-dock-bottom: 44px; }
}
@media (max-height: 580px){
  :root{ --mn-dock-bottom: 46px; }
}


/* STEP62AH · letzte kleine Feinkorrektur: Dock nochmals minimal höher */
:root{
  --mn-dock-bottom: 46px;
}
.rail,
.rail--menu-only,
.rail--menu-share,
.rail--menu-with-share,
body.home .rail,
body.is-home .rail,
body[data-page="home"] .rail,
body.subpage .rail,
body.is-subpage .rail,
body[data-page] .rail{
  bottom: var(--mn-dock-bottom) !important;
}
@media (max-height: 700px){
  :root{ --mn-dock-bottom: 48px; }
}
@media (max-height: 580px){
  :root{ --mn-dock-bottom: 50px; }
}


/* STEP62AI · sichtbar, aber weiterhin fein höher als AH */
:root{
  --mn-dock-bottom: 54px;
}
.rail,
.rail--menu-only,
.rail--menu-share,
.rail--menu-with-share,
body.home .rail,
body.is-home .rail,
body[data-page="home"] .rail,
body.subpage .rail,
body.is-subpage .rail,
body[data-page] .rail{
  bottom: var(--mn-dock-bottom) !important;
}
@media (max-height: 700px){
  :root{ --mn-dock-bottom: 56px; }
}
@media (max-height: 580px){
  :root{ --mn-dock-bottom: 58px; }
}


/* STEP62AJ · Homepage-Dock exakt auf gleiche Position wie Unterseiten */
body[data-mn-page="home"] .rail--menu-with-share{bottom:54px!important;}
@media(max-height:700px){body[data-mn-page="home"] .rail--menu-with-share{bottom:56px!important;}}
@media(max-height:580px){body[data-mn-page="home"] .rail--menu-with-share{bottom:58px!important;}}


/* STEP62AL · Startseite Dock transparenter
   Schwarze Hülle vom Startseiten-Dock etwas leichter machen */
.rail.rail--menu-with-share{
  background: rgba(17,17,17,.14) !important;
  border-color: rgba(17,17,17,.08) !important;
  box-shadow: 0 10px 26px rgba(0,0,0,.10) !important;
  backdrop-filter: blur(10px) !important;
}
@media(max-width:720px){
  .rail.rail--menu-with-share{
    background: rgba(17,17,17,.12) !important;
  }
}


/* STEP62AM · Mobile Dock angleichen
   - Menübutton steht auf Home + Unterseiten exakt mittig
   - Share-Grid öffnet etwas weiter zur Seitenmitte
   - Verhalten auf Startseite und Unterseiten gleich */
@media (max-width: 720px){
  .rail--menu-with-share{
    justify-content:center !important;
    gap:10px !important;
  }
  .rail--menu-with-share::before{
    content:"";
    display:block;
    width:68px;
    height:1px;
    flex:0 0 68px;
  }
  .rail--menu-with-share .rail-menu-anchor{
    flex:0 0 auto;
  }
  .rail--menu-with-share .rail-share-slot{
    width:68px !important;
    height:68px !important;
    flex:0 0 68px !important;
    display:flex !important;
    align-items:center;
    justify-content:center;
  }
  .rail--menu-with-share .share{
    position:relative;
    transition:transform .28s cubic-bezier(.22,1,.36,1);
  }
  .rail--menu-with-share .share[data-open="true"]{
    transform:translateX(-26px);
  }
  .rail--menu-with-share .rail-menu-panel{
    left:50% !important;
    transform:translate(-50%, 18px) !important;
  }
  .rail--menu-with-share.is-open .rail-menu-panel{
    transform:translate(-50%, 0) !important;
  }
}
@media (max-width: 420px){
  .rail--menu-with-share::before{
    width:62px;
    flex-basis:62px;
  }
  .rail--menu-with-share .rail-share-slot{
    width:62px !important;
    height:62px !important;
    flex-basis:62px !important;
  }
  .rail--menu-with-share .share[data-open="true"]{
    transform:translateX(-22px);
  }
}


/* STEP62AN · Mobile: Leiste wieder klassisch MENÜ + SHARE nebeneinander.
   Nur das GEÖFFNETE Share-Raster fährt zur Seitenmitte.
   Das aufgeklappte Hauptmenü bleibt mittig zum Viewport. */
@media (max-width:720px){
  .rail--menu-with-share::before{
    content:none!important;
    display:none!important;
    width:0!important;
    flex:0 0 0!important;
  }

  .rail--menu-with-share{
    justify-content:center!important;
    gap:10px!important;
  }

  .rail--menu-with-share .rail-menu-anchor{
    flex:0 0 auto!important;
  }

  .rail--menu-with-share .rail-share-slot{
    position:relative!important;
    width:68px!important;
    height:68px!important;
    flex:0 0 68px!important;
    overflow:visible!important;
  }

  /* geschlossen: exakt alte Position direkt neben MENÜ */
  .rail--menu-with-share .rail-share-slot .share{
    position:absolute!important;
    left:50%!important;
    top:50%!important;
    transform:translate(-50%,-50%)!important;
    transition:transform .32s cubic-bezier(.22,1,.36,1)!important;
  }

  /* geöffnet: gesamtes 3x3 Raster Richtung Bildschirmmitte */
  .rail--menu-with-share .rail-share-slot .share[data-open="true"]{
    transform:translate(calc(-50% - 18px),-50%)!important;
  }

  /* Menü-Popup trotz nebeneinanderliegender Buttons exakt zur Webseite zentrieren */
  .rail--menu-with-share .rail-menu-panel{
    left:calc(50% + 39px)!important;
    transform:translate(-50%,18px)!important;
  }
  .rail--menu-with-share.is-open .rail-menu-panel{
    transform:translate(-50%,0)!important;
  }
}

@media (max-width:420px){
  .rail--menu-with-share .rail-share-slot{
    width:62px!important;
    height:62px!important;
    flex-basis:62px!important;
  }
  .rail--menu-with-share .rail-share-slot .share[data-open="true"]{
    transform:translate(calc(-50% - 24px),-50%)!important;
  }
  .rail--menu-with-share .rail-menu-panel{
    left:calc(50% + 36px)!important;
  }
}

@media (max-width:360px){
  .rail--menu-with-share .rail-share-slot .share[data-open="true"]{
    transform:translate(calc(-50% - 28px),-50%)!important;
  }
}


/* STEP62AP · Mobile Share-Fix auf ALLEN Seiten
   Geschlossen bleibt MENÜ + SHARE nebeneinander wie zuvor.
   Nur geöffnet wird das komplette Share-Raster gerade so weit
   zur Mitte gezogen, dass es im Viewport bleibt – der Share-Hub
   bleibt sichtbar rechts neben MENÜ und rutscht nicht darunter. */
@media (max-width:720px){
  .rail--menu-with-share .rail-share-slot .share[data-open="true"]{
    transform:translate(calc(-50% - 14px),-50%)!important;
  }
}
@media (max-width:420px){
  .rail--menu-with-share .rail-share-slot .share[data-open="true"]{
    transform:translate(calc(-50% - 20px),-50%)!important;
  }
}
@media (max-width:360px){
  .rail--menu-with-share .rail-share-slot .share[data-open="true"]{
    transform:translate(calc(-50% - 36px),-50%)!important;
  }
}


/* STEP62AQ · Share-Raster auf Mobile noch ein Stück weiter nach rechts.
   Gilt identisch für Startseite und Unterseiten. */
@media (max-width:720px){
  .rail--menu-with-share .rail-share-slot .share[data-open="true"]{
    transform:translate(calc(-50% - 8px),-50%)!important;
  }
}
@media (max-width:420px){
  .rail--menu-with-share .rail-share-slot .share[data-open="true"]{
    transform:translate(calc(-50% - 14px),-50%)!important;
  }
}
@media (max-width:360px){
  .rail--menu-with-share .rail-share-slot .share[data-open="true"]{
    transform:translate(calc(-50% - 24px),-50%)!important;
  }
}


/* STEP62AR · Startseite Mobile exakt wie Unterseiten
   Die alte .rail-Basis der Homepage wird auf Mobile vollständig neutralisiert.
   MENÜ + SHARE stehen wieder kompakt nebeneinander; nur das geöffnete
   Share-Raster rückt zur Bildschirmmitte. */
@media (max-width:720px){
  body[data-mn-page="home"] .rail.rail--menu-with-share{
    position:fixed!important;
    left:50%!important;
    right:auto!important;
    top:auto!important;
    bottom:54px!important;
    transform:translateX(-50%)!important;
    width:max-content!important;
    max-width:calc(100vw - 20px)!important;
    min-width:0!important;
    height:auto!important;
    min-height:0!important;
    display:inline-flex!important;
    flex-direction:row!important;
    align-items:center!important;
    justify-content:center!important;
    gap:10px!important;
    padding:6px!important;
    margin:0!important;
    overflow:visible!important;
    border-radius:999px!important;
    background:rgba(17,17,17,.065)!important;
    border:1px solid rgba(17,17,17,.10)!important;
    box-shadow:0 14px 34px rgba(0,0,0,.075)!important;
    -webkit-backdrop-filter:blur(9px)!important;
    backdrop-filter:blur(9px)!important;
  }

  body[data-mn-page="home"] .rail--menu-with-share .rail-menu-anchor{
    flex:0 0 auto!important;
  }

  body[data-mn-page="home"] .rail--menu-with-share .rail-menu-toggle{
    min-width:210px!important;
    width:auto!important;
    height:70px!important;
    padding:0 30px!important;
    flex:0 0 auto!important;
  }

  body[data-mn-page="home"] .rail--menu-with-share .rail-share-slot{
    position:relative!important;
    display:block!important;
    width:70px!important;
    height:70px!important;
    flex:0 0 70px!important;
    overflow:visible!important;
  }

  body[data-mn-page="home"] .rail--menu-with-share .rail-share-slot .share{
    position:absolute!important;
    left:50%!important;
    top:50%!important;
    transform:translate(-50%,-50%)!important;
  }

  body[data-mn-page="home"] .rail--menu-with-share .rail-share-slot .share[data-open="true"]{
    transform:translate(calc(-50% - 8px),-50%)!important;
  }

  body[data-mn-page="home"] .rail--menu-with-share .rail-menu-panel{
    left:calc(50% + 40px)!important;
    transform:translate(-50%,18px)!important;
  }
  body[data-mn-page="home"] .rail--menu-with-share.is-open .rail-menu-panel{
    transform:translate(-50%,0)!important;
  }
}

@media (max-width:420px){
  body[data-mn-page="home"] .rail.rail--menu-with-share{
    bottom:54px!important;
  }
  body[data-mn-page="home"] .rail--menu-with-share .rail-menu-toggle{
    min-width:210px!important;
    height:70px!important;
  }
  body[data-mn-page="home"] .rail--menu-with-share .rail-share-slot{
    width:70px!important;
    height:70px!important;
    flex-basis:70px!important;
  }
  body[data-mn-page="home"] .rail--menu-with-share .rail-share-slot .share[data-open="true"]{
    transform:translate(calc(-50% - 14px),-50%)!important;
  }
  body[data-mn-page="home"] .rail--menu-with-share .rail-menu-panel{
    left:calc(50% + 40px)!important;
  }
}

@media (max-width:360px){
  body[data-mn-page="home"] .rail--menu-with-share .rail-share-slot .share[data-open="true"]{
    transform:translate(calc(-50% - 24px),-50%)!important;
  }
}