这可能是一个愚蠢的问题，但对齐项目，没有为我工作，但它一直是我的整个时间写代码。我不知道为什么输出不对齐我的div内的文本。只是寻找一点帮助，即使它是一个愚蠢的简单的答案。
代码如下：
html：

<div data-aos="fade-in" class="head">
            <p class="head-text">Top Artists and Songs of 2023<p>
        </div>

字符集
css：

@import url('https://fonts.googleapis.com/css2?family=M+PLUS+Rounded+1c:wght@300&display=swap');

body {
    background-color: #212121;
    font-family: 'M PLUS Rounded 1c', sans-serif;
    margin: 0;
}

.head {
    background-color: #111111;
    color: #1d8954;
    filter: brightness(150%);
    width: 100%;
    height: 75vh;
    margin:0;
    align-items: center;
    text-align: center;
}
.head-text {
    font-size: 5rem;
    margin:0;
}

型
对不起，长css标签，只是想添加一切的情况下，在开始模糊的东西可能会改变输出。
以下是输出（负输出是绿色文本未与垂直轴上的中心对齐）：
the problem is it's not vertically centered