:root{
  --ink:#111211;
  --cream:#f5f1e8;
  --paper:#fbf8f1;
  --line:rgba(17,18,17,.16);
  --accent:#D8F024;
  --accent-ink:#111211;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body.mn-subpage{
  --mn-menu-accent:var(--accent);
  --mn-menu-ink:var(--accent-ink);
  margin:0;
  background:var(--paper);
  color:var(--ink);
  font-family:Arial,Helvetica,sans-serif;
  overflow-x:hidden;
}
body.mn-subpage--arbeiten{--accent:#ef845f;--accent-ink:#111211}
body.mn-subpage--about{--accent:#f0bc49;--accent-ink:#111211}
body.mn-subpage--voices{--accent:#efb09b;--accent-ink:#111211}
body.mn-subpage--contact{--accent:#f7f5ef;--accent-ink:#111211;background:#111;color:#f7f5ef}
a{color:inherit}
.mn-topline{
  width:min(1500px,calc(100% - 44px));margin:0 auto;padding:26px 0 0;
  display:flex;justify-content:space-between;align-items:center;gap:24px;
  font-size:.76rem;font-weight:900;letter-spacing:.12em;text-transform:uppercase;
}
.mn-topline a{text-decoration:none}
.mn-topline__brand{display:flex;align-items:center;gap:10px}
.mn-topline__dot{width:14px;height:14px;border-radius:50%;background:var(--accent);border:2px solid currentColor}
.mn-subhero{
  width:min(1500px,calc(100% - 44px));
  margin:18px auto 0;
  min-height:72vh;
  border-radius:42px;
  background:var(--accent);
  color:var(--accent-ink);
  padding:clamp(34px,5vw,78px);
  display:grid;
  grid-template-columns:minmax(0,1.35fr) minmax(240px,.65fr);
  align-items:end;
  gap:40px;
  overflow:hidden;
  position:relative;
}
.mn-subhero::after{
  content:"";position:absolute;right:-10vw;top:-18vw;width:46vw;height:46vw;border-radius:50%;
  border:2px solid rgba(17,18,17,.14);box-shadow:0 0 0 42px rgba(17,18,17,.035),0 0 0 88px rgba(17,18,17,.025);pointer-events:none;
}
.mn-subhero__copy{position:relative;z-index:1}
.mn-kicker{margin:0 0 16px;font-size:.76rem;font-weight:900;letter-spacing:.18em;text-transform:uppercase}
.mn-subhero h1{
  margin:0;font-family:Arial Black,Arial,Helvetica,sans-serif;
  font-size:clamp(4.4rem,13.5vw,13rem);line-height:.76;letter-spacing:-.075em;text-transform:uppercase;
}
.mn-subhero__aside{position:relative;z-index:1;align-self:end;padding-bottom:.55vw}
.mn-subhero__aside p{margin:0;font-size:clamp(1.15rem,2.15vw,2rem);line-height:1.13;font-weight:800;letter-spacing:-.035em}
.mn-subhero__aside span{display:block;margin-top:24px;font-size:.76rem;font-weight:900;letter-spacing:.14em;text-transform:uppercase}
.mn-ticker{margin:22px 0 0;border-top:1px solid var(--line);border-bottom:1px solid var(--line);overflow:hidden;background:var(--paper)}
.mn-ticker__track{width:max-content;padding:14px 0;display:flex;gap:34px;animation:mnTicker 26s linear infinite;font-size:.8rem;font-weight:900;letter-spacing:.15em;text-transform:uppercase}
@keyframes mnTicker{to{transform:translateX(-50%)}}
.mn-section{width:min(1380px,calc(100% - 44px));margin:0 auto;padding:clamp(86px,11vw,170px) 0}
.mn-section--tight{padding-top:70px}
.mn-section-head{display:grid;grid-template-columns:minmax(0,.8fr) minmax(300px,1.2fr);gap:60px;align-items:start;margin-bottom:70px}
.mn-section-head h2{margin:0;font-family:Arial Black,Arial,sans-serif;font-size:clamp(3rem,7vw,7.5rem);line-height:.86;letter-spacing:-.065em;text-transform:uppercase}
.mn-section-head p{margin:8px 0 0;max-width:720px;font-size:clamp(1.1rem,1.8vw,1.55rem);line-height:1.4}
.mn-project-list{display:grid;gap:24px}
.mn-project{
  min-height:clamp(420px,62vw,760px);border-radius:34px;overflow:hidden;position:relative;background:#171717;color:#fff;text-decoration:none;
}
.mn-project:nth-child(even){margin-left:clamp(0px,10vw,150px)}
.mn-project:nth-child(3n){margin-right:clamp(0px,8vw,120px)}
.mn-project img{width:100%;height:100%;object-fit:cover;position:absolute;inset:0;transition:transform .8s cubic-bezier(.22,1,.36,1)}
.mn-project::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,transparent 30%,rgba(0,0,0,.82))}
.mn-project:hover img{transform:scale(1.035)}
.mn-project__copy{position:absolute;z-index:2;left:clamp(24px,4vw,58px);right:clamp(24px,4vw,58px);bottom:clamp(24px,4vw,52px);display:flex;justify-content:space-between;align-items:end;gap:28px}
.mn-project__copy p{margin:0 0 10px;font-size:.74rem;font-weight:900;letter-spacing:.15em;text-transform:uppercase}
.mn-project__copy h3{margin:0;max-width:900px;font-size:clamp(2.4rem,5vw,5.8rem);line-height:.9;letter-spacing:-.055em;text-transform:uppercase}
.mn-project__arrow{font-size:3rem;line-height:1}
.mn-project--type{background:var(--accent);color:var(--accent-ink);display:grid;place-items:center;padding:50px}
.mn-project--type::after{display:none}
.mn-project--type .mn-project__copy{position:relative;left:auto;right:auto;bottom:auto;width:100%}
.mn-editorial{display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);gap:clamp(34px,8vw,120px);align-items:start}
.mn-editorial__sticky{position:sticky;top:40px}
.mn-editorial__sticky h2{margin:0;font-family:Arial Black,Arial,sans-serif;font-size:clamp(3.2rem,7vw,7rem);line-height:.88;letter-spacing:-.06em;text-transform:uppercase}
.mn-editorial__flow{display:grid;gap:70px}
.mn-editorial__flow article{padding-top:24px;border-top:2px solid currentColor}
.mn-editorial__flow h3{margin:0 0 16px;font-size:clamp(1.8rem,3vw,3.2rem);line-height:1;letter-spacing:-.04em}
.mn-editorial__flow p{margin:0;font-size:clamp(1.05rem,1.55vw,1.35rem);line-height:1.55;max-width:760px}
.mn-image-break{width:min(1500px,calc(100% - 44px));height:min(74vw,780px);margin:0 auto;border-radius:38px;overflow:hidden;background:#ddd}
.mn-image-break img{width:100%;height:100%;object-fit:cover;display:block}
.mn-voices{display:grid;grid-template-columns:repeat(12,1fr);gap:20px;align-items:start}
.mn-voice{margin:0;grid-column:span 6;border-radius:28px;overflow:hidden;box-shadow:0 18px 50px rgba(0,0,0,.08)}
.mn-voice:nth-child(2){margin-top:100px}
.mn-voice:nth-child(3){grid-column:4/span 6;margin-top:36px}
.mn-voice img{width:100%;display:block}
.mn-contact-lines{display:grid;border-top:2px solid currentColor}
.mn-contact-line{display:grid;grid-template-columns:200px 1fr auto;gap:28px;align-items:center;padding:28px 0;border-bottom:2px solid currentColor;text-decoration:none}
.mn-contact-line small{font-weight:900;letter-spacing:.13em;text-transform:uppercase}
.mn-contact-line strong{font-size:clamp(1.6rem,4vw,4rem);line-height:1;letter-spacing:-.045em}
.mn-contact-line span{font-size:2rem}
.mn-contact-line:hover strong{font-style:italic}
.mn-big-cta{width:min(1500px,calc(100% - 44px));margin:0 auto 44px;border-radius:40px;background:var(--accent);color:var(--accent-ink);padding:clamp(38px,7vw,96px)}
.mn-big-cta h2{margin:0 0 34px;font-family:Arial Black,Arial,sans-serif;font-size:clamp(3.8rem,10vw,10rem);line-height:.82;letter-spacing:-.075em;text-transform:uppercase}
.mn-big-cta a{display:inline-flex;align-items:center;min-height:66px;padding:0 28px;border-radius:999px;background:#111;color:#fff;text-decoration:none;font-weight:900;letter-spacing:.06em;text-transform:uppercase}
.mn-footer{padding:34px 22px 150px;text-align:center;font-size:.74rem;font-weight:800;letter-spacing:.11em;text-transform:uppercase;opacity:.72}
body.mn-subpage--contact .mn-topline,body.mn-subpage--contact .mn-section{color:#f7f5ef}
body.mn-subpage--contact .mn-ticker{background:#111;border-color:rgba(247,245,239,.22)}
body.mn-subpage--contact .mn-ticker__track{color:#f7f5ef}

/* Floating Navigation – same behavior as homepage */
.rail--menu-with-share{
  position:fixed;left:50%;bottom:clamp(340px,39vh,440px);transform:translateX(-50%);z-index:1200;
  display:flex;align-items:center;justify-content:center;gap:10px;padding:8px;
  background:rgba(17,17,17,.065);border:1px solid rgba(17,17,17,.10);border-radius:999px;
  box-shadow:0 14px 34px rgba(0,0,0,.075);-webkit-backdrop-filter:blur(9px);backdrop-filter:blur(9px);overflow:visible;
}
.rail-menu-anchor{position:relative;z-index:3}
.rail-menu-toggle{
  min-width:244px;height:78px;padding:0 36px;border:0;border-radius:999px;background:var(--mn-menu-accent);color:var(--mn-menu-ink);
  display:inline-flex;align-items:center;justify-content:center;gap:18px;cursor:pointer;
  font-family:"Cooper Black","Cooper Std Black","CooperBlackStd",Georgia,serif;font-weight:900;font-size:1.34rem;letter-spacing:-.01em;
  -webkit-text-stroke:1.3px currentColor;box-shadow:0 8px 20px rgba(0,0,0,.10);
}
.rail-menu-toggle>span:last-child{display:inline-block;transform:scaleX(1.035) scaleY(1.04)}
.rail-menu-icon,.rail-menu-icon::before,.rail-menu-icon::after{display:block;width:19px;height:3px;border-radius:999px;background:currentColor;content:""}
.rail-menu-icon{position:relative}.rail-menu-icon::before{position:absolute;top:-6px;left:0}.rail-menu-icon::after{position:absolute;top:6px;left:0}
.rail-menu-panel{
  position:absolute;left:50%;bottom:calc(100% + 20px);transform:translate(-50%,18px);width:min(390px,88vw);padding:18px 16px;
  border-radius:38px;background:var(--mn-menu-accent);border:1px solid rgba(17,17,17,.10);box-shadow:0 20px 42px rgba(0,0,0,.13);
  display:flex;flex-direction:column;gap:4px;opacity:0;pointer-events:none;transition:opacity .24s ease,transform .24s ease;overflow:hidden;isolation:isolate;
}
.rail--menu-with-share.is-open .rail-menu-panel{opacity:1;pointer-events:auto;transform:translate(-50%,0)}
.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;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;z-index:1;min-height:70px;padding:0 24px;border-radius:999px;display:flex;align-items:center;justify-content:center;color:#111;text-decoration:none;text-transform:uppercase;font-family:"Cooper Black","Cooper Std Black","CooperBlackStd",Georgia,serif;font-size:1.58rem;font-weight:900;letter-spacing:-.01em;-webkit-text-stroke:.75px currentColor;transition:color .18s ease,transform .2s ease}
.rail-menu-panel a.is-highlighted{color:var(--mn-menu-accent);transform:scale(1.02)}
.rail-share-slot{position:relative;width:78px;height:78px;flex:0 0 78px;overflow:visible;z-index:2}
.rail-share-slot .share{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);z-index:1;--lime:var(--mn-menu-accent)}

@media(max-width:820px){
  .mn-topline,.mn-subhero,.mn-section,.mn-image-break,.mn-big-cta{width:min(100% - 24px,1500px)}
  .mn-subhero{min-height:66vh;border-radius:28px;grid-template-columns:1fr;align-content:end;padding:30px 24px}
  .mn-subhero h1{font-size:clamp(4rem,20vw,8rem)}
  .mn-section-head,.mn-editorial{grid-template-columns:1fr;gap:34px}
  .mn-editorial__sticky{position:static}
  .mn-project:nth-child(even),.mn-project:nth-child(3n){margin-left:0;margin-right:0}
  .mn-project{min-height:460px}
  .mn-project__copy{display:block}.mn-project__arrow{margin-top:16px}
  .mn-voices{display:grid;grid-template-columns:1fr}.mn-voice,.mn-voice:nth-child(2),.mn-voice:nth-child(3){grid-column:auto;margin:0}
  .mn-contact-line{grid-template-columns:1fr auto}.mn-contact-line small{grid-column:1/-1}
  .rail--menu-with-share{bottom:clamp(255px,32vh,330px);padding:6px}
  .rail-menu-toggle{min-width:210px;height:70px;padding:0 30px;font-size:1.24rem}
  .rail-share-slot{width:70px;height:70px;flex-basis:70px}
  .rail-menu-panel{width:min(350px,91vw);padding:15px 13px 18px;border-radius:32px}
  .rail-menu-highlight{left:13px;right:13px}.rail-menu-panel a{min-height:64px;font-size:1.34rem}
}
@media(max-height:700px){.rail--menu-with-share{bottom:270px}.rail-menu-panel a{min-height:58px;font-size:1.25rem}}
@media(max-height:580px){.rail--menu-with-share{bottom:225px}}

/* ==================================================================
   STEP62AA · Unterseiten-Dock nur so hoch wie für das 3×3-Share-Menü nötig.
   Das Raster ist 194px hoch; diese Position lässt unten bewusst Luft,
   ohne die Navigation unnötig weit in die Seite zu schieben.
   ================================================================== */
.mn-subpage .rail--menu-with-share{
  bottom:92px!important;
}
@media(max-width:820px){
  .mn-subpage .rail--menu-with-share{bottom:86px!important}
}
@media(max-height:700px){
  .mn-subpage .rail--menu-with-share{bottom:82px!important}
}
@media(max-height:580px){
  .mn-subpage .rail--menu-with-share{bottom:78px!important}
}


/* STEP62AE · Unterseiten: bisherigen 92/86/82/78px Override neutralisieren.
   Gleiche tiefe Position wie Startseite. */
.mn-subpage .rail--menu-with-share{
  bottom:30px!important;
}
@media(max-width:820px){
  .mn-subpage .rail--menu-with-share{bottom:30px!important}
}
@media(max-height:700px){
  .mn-subpage .rail--menu-with-share{bottom:32px!important}
}
@media(max-height:580px){
  .mn-subpage .rail--menu-with-share{bottom:34px!important}
}


/* STEP62AF · Unterseiten identisch: minimal höher */
.mn-subpage .rail--menu-with-share{
  bottom:36px!important;
}
@media(max-height:700px){
  .mn-subpage .rail--menu-with-share{bottom:38px!important}
}
@media(max-height:580px){
  .mn-subpage .rail--menu-with-share{bottom:40px!important}
}


/* STEP62AG · Unterseiten gleichziehen: ebenfalls leicht höher */
.mn-subpage .rail--menu-with-share{
  bottom:42px!important;
}
@media(max-height:700px){
  .mn-subpage .rail--menu-with-share{bottom:44px!important}
}
@media(max-height:580px){
  .mn-subpage .rail--menu-with-share{bottom:46px!important}
}


/* STEP62AH · Unterseiten identisch minimal höher */
.mn-subpage .rail--menu-with-share{
  bottom:46px!important;
}
@media(max-height:700px){
  .mn-subpage .rail--menu-with-share{bottom:48px!important}
}
@media(max-height:580px){
  .mn-subpage .rail--menu-with-share{bottom:50px!important}
}


/* STEP62AI · Unterseiten identisch höher */
.mn-subpage .rail--menu-with-share{
  bottom:54px!important;
}
@media(max-height:700px){
  .mn-subpage .rail--menu-with-share{bottom:56px!important}
}
@media(max-height:580px){
  .mn-subpage .rail--menu-with-share{bottom:58px!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% - 34px),-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% - 40px),-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% - 46px),-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;
  }
}