要在HTML中重叠这样的内容，您需要打破文档的正常流程。一种方法是使用position: absolute，您可以将其与z-index结合使用以强制分层。在您的场景中，简单的版本如下所示：

#caja{
    display: flex;
}

.citas_totales{
    flex: 1;
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    
}

.citas{
  padding: 10px;
  background-color: antiquewhite;
  margin: 30px;
  padding-bottom: 20px;
  position: relative;

}


.fotos_citas{
    width: 200px;
}

details{
  position: absolute;
  margin-left: -10px;
  padding-left: 10px;
  box-sizing: border-box;
  width: 100%;
  background-color: antiquewhite;
  z-index: 1000;
  
}

<section id="caja">
<form action="#" id="filtros" class="prueba">
                <h2>Estado Civil</h2>
                <input type="checkbox" id="soltero" name="soltero" value="Soltero" class="estado_civil">
                <label for="soltero">Soltero</label><br>
                <input type="checkbox" id="casado" name="casado" value="Casado" class="estado_civil">
                <label for="casado">Casado</label><br>
                <input type="checkbox" id="divorciado" name="divorciado" value="Divorciado" class="estado_civil">
                <label for="divorciado">Divorciado</label><br>
                <input type="checkbox" id="otros" name="otros" value="Otros" class="estado_civil">
                <label for="otros">Otros</label><br>
                <h2>Edad</h2>
                <div data-role="rangeslider">
                    <label for="edad_minima">Minima:</label>
                    <input type="range" name="edad_minima" id="edad_minima" value="200" min="18" max="50"><br>
                    <label for="edad_maxima">Maxima:</label>
                    <input type="range" name="edad_maxima" id="edad_maxima" value="800" min="18" max="50">
                </div>
                <h2>Fumador</h2>
                <input type="checkbox" id="afirmativo" name="afirmativo" value="Si">
                <label for="afirmativo">Si</label><br>
                <input type="checkbox" id="negativo" name="negativo" value="No">
                <label for="negativo">No</label><br>
                <h2>Ciudad</h2>
            </form>
<article class="citas_totales">
            <article class="citas">
                <img src="https://i.vgy.me/9mb1ts.jpg" alt="" class="fotos_citas">
                <details class="detalles1">
                    <summary>Jenna</summary>
                    <ul>
                        <li>23 años</li>
                        <li>1,63 m</li>
                        <li>Pelo negro</li>
                    </ul>
                </details>
            </article>
            <article class="citas">
                <img src="https://i.vgy.me/9mb1ts.jpg" alt="" class="fotos_citas">
                <details class="detalles1">
                    <summary>Jenna</summary>
                    <ul>
                        <li>23 años</li>
                        <li>1,63 m</li>
                        <li>Pelo negro</li>
                    </ul>
                </details>
            </article>
            <article class="citas">
                <img src="https://i.vgy.me/9mb1ts.jpg" alt="" class="fotos_citas">
                <details class="detalles1">
                    <summary>Jenna</summary>
                    <ul>
                        <li>23 años</li>
                        <li>1,63 m</li>
                        <li>Pelo negro</li>
                    </ul>
                </details>
            </article>
            <article class="citas">
                <img src="https://i.vgy.me/9mb1ts.jpg" alt="" class="fotos_citas">
                <details class="detalles1">
                    <summary>Jenna</summary>
                    <ul>
                        <li>23 años</li>
                        <li>1,63 m</li>
                        <li>Pelo negro</li>
                    </ul>
                </details>
            </article>
            <article class="citas">
                <img src="https://i.vgy.me/9mb1ts.jpg" alt="" class="fotos_citas">
                <details class="detalles1">
                    <summary>Jenna</summary>
                    <ul>
                        <li>23 años</li>
                        <li>1,63 m</li>
                        <li>Pelo negro</li>
                    </ul>
                </details>
            </article>
            <article class="citas">
                <img src="https://i.vgy.me/9mb1ts.jpg" alt="" class="fotos_citas">
                <details class="detalles1">
                    <summary>Jenna</summary>
                    <ul>
                        <li>23 años</li>
                        <li>1,63 m</li>
                        <li>Pelo negro</li>
                    </ul>
                </details>
            </article>
</article>
</section>

取决于你最终的产品是什么样子，从长远来看，这可能是也可能不是一个很好的解决方案--position: absolute有时很难维护，手动设置z-index也有点可疑，但对于低到中等复杂度的应用程序，这仍然可以很好地工作。