/* Sensus Communis | mf-sym.css
   Mentor & Fellowship: zwei Zeichen statt Illustration (Startseite, Annual Forum, Fellows & Team).
   Mond ueber dem Horizont und die aufgehende Sonne, nebeneinander, die Horizontlinien auf einer
   Hoehe. Auf dem Handy untereinander, der Mond ueber der Sonne. */
.mf-sym {
  display: flex;
  align-items: flex-end;
  justify-content: center;
  gap: clamp(28px, 6vw, 84px);
  max-width: 900px;
  margin: 38px auto 10px;
}
.mf-sym img {
  display: block;
  width: calc(50% - clamp(14px, 3vw, 42px));
  height: auto;
}
@media (max-width: 720px) {
  .mf-sym { flex-direction: column; align-items: center; gap: 34px; margin-top: 30px; }
  .mf-sym img { width: min(86%, 360px); }
}
/* beim Aufklappen ruhig einblenden, wie zuvor das Bild */
.ff-js .format-feature .ff-body__in > .mf-sym { opacity: 0; transition: opacity .25s ease; }
.ff-js .format-feature.is-open .ff-body__in > .mf-sym { opacity: 1; transition: opacity 1.1s ease .25s; }
@media (prefers-reduced-motion: reduce) {
  .ff-js .format-feature .ff-body__in > .mf-sym { transition: none; }
}

/* Annual Forum und Team: Zeichen erscheinen ruhig, sobald sie ins Bild kommen (mf-sym.js) */
.mf-sym.mfs-armed { opacity: 0; transform: translate3d(0, 10px, 0); }
.mf-sym.mfs-armed.mfs-in { opacity: 1; transform: none; transition: opacity 1.2s ease, transform 1.4s cubic-bezier(.16,1,.3,1); }
.ff-gen .mf-sym { margin-top: 30px; margin-bottom: 4px; }