How to overwrite a block with an included file - twig

Question

i would like to override/extend a block from the layout.twig from an included twig file.
How can I achieve this?
The reason for this is that I have outsourced some elements into different twig files in order to be able to use them over and over again.
These twig files should be expanded in layout.twig.
I tried different solutions:
The embed tag only overwrites blocks within the included file.
The use tag does not allow the parent block to be extended in layout.twig.
Also [https://github.com/rybakit/twig-deferred-extension] did not have the desired effect.
layout.twig
<div style="color:red;">
{% block content %}
<h1>content: layout</h1>
{% endblock %}
</div>
<div style="color:blue;">
{% block morecontent %}
<h1>morecontent: layout</h1>
{% endblock %}
</div>
content.twig
{% extends "layout.twig" %}
{% block content %}
<h1>content: content</h1>
{% include "include.twig" %}
{% include "include2.twig" %}
{% endblock %}
include.twig
<h1>content: include</h1>
{% block morecontent %}
<h1>morecontent: include</h1>
{% endblock %}
include2.twig
<h1>content: include2</h1>
{% block morecontent %}
<h1>morecontent: include2</h1>
{% endblock %}
This way, the "morecontent" of the included files will be put directly after the content.
<div style="color:red;">
<h1>content: content</h1>
<h1>content: include</h1>
<h1>morecontent: include</h1>
<h1>content: include2</h1>
<h1>morecontent: include2</h1>
</div>
<div style="color:blue;">
<h1>morecontent: layout</h1>
</div>
But I want them to be inside the morecontent Block of the layout.twig
<div style="color:red;">
<h1>content: content</h1>
<h1>content: include</h1>
<h1>content: include2</h1>
</div>
<div style="color:blue;">
<h1>morecontent: layout</h1>
<h1>morecontent: include</h1>
<h1>morecontent: include2</h1>
</div>