.header-blog {
    width: 100%;
    background: radial-gradient(circle, rgb(3, 62, 138) 17%, rgb(2, 30, 67) 82%);
}

.header-blog-logo {
    width: 300px;
    padding: 30px 0 0;
    margin-left: 100px;
}

.header-blog-logo img {
    display: block;
}

.header-category-buttons {
    display: flex;
    width: 90%;
    margin: 0 auto;
    align-items: baseline;
    gap: 2rem;
}

.category-button {
    padding: 20px;
    display: flex;
    justify-content: center;
    flex: 1;
}

.category-button a {
    display: flex;
    flex-direction: column;
    align-items: center;
}

.category-button a img {
    height: 150px;
    padding-right: 20px;
    width: auto;
}

.category-button a h2 {
    color: white;
    font-size: calc(1em + 1vw);
}

.post-full-container {
    color: #6b6b6b;
    margin-top: 50px;
}

.post-header-full-container {
    width: 100%;
}

.post-header-container {
    width: 75%;
    margin: 0 auto;
    display: flex;
}

.post-thumbnail {
    width: 50%;
    height: 300px;
    overflow: hidden;
    border-radius: 80px 0 0 0;
    margin: 0 -30px 0 0;
    display: flex;
    align-items: center;
}

.post-header {
    width: 60%;
    background: #E9E7E5;
    border-radius: 40px;
    margin: 50px 0 0 -40px;
    padding: 20px 50px;
}

.header-post-info {
    display: block;
}

.header-post-info h1 {
    color: #034B96;
}

.header-post-info p {
    display: block;
}

.header-meta-items {
    display: flex;
    align-items: center;
}

.header-post-meta {
    width: 50%;
    gap: 1rem;
    display: flex;
    flex-direction: column;
    margin-top: 10px;
}

.author-info {
    width: 50%;
    text-align: center;
    display: flex;
    flex-direction: column;
    justify-content: center;
}

.author-info img {
    width: 100px;
    border-radius: 75px;
    align-self: center;
}

.author-name {
    display: flex;
    align-items: baseline;
}

.author-name h3 {
    margin: 0 10px;
    color: #00A1E0;
    font-weight: 600;
    font-size: 1.3em;
}

.author-name img {
    width: 20px;
    filter: invert(16%) sepia(54%) saturate(4397%) hue-rotate(200deg) brightness(93%) contrast(98%);
    border-radius: 0;
}


.post-content {
    padding: 0 80px;
}

.post-content h1 {
    color: #034B96;
    font-size: 3.5em;
}

.post-content h1 img {
    width: 300px;
    margin: 0 auto;
}

.post-content h2 {
    color: #034B96;
    font-size: 2em;
    font-weight: 600;
    display: flex;
}

.post-content h2 img {
    width: 300px;
    margin: 0 auto;
}

.author-bio-bottom {
    background: #E9E7E5;
    margin: 20px 50px;
    padding: 30px;
    display: flex;
    justify-content: center;
    border-radius: 10px;
    border: 1px solid #5555;
}

.author-bottom-block {
    display: flex;
    align-items: center;
    justify-content: center;
}

.author-picture-bottom {
    width: 400px;
    border-radius: 50%;
    overflow: hidden;
    margin-right: 50px;
}

.author-info-bottom h2 {
    font-size: 2.5em;
}

.related-posts {
    padding: 30px 50px;
    text-align: center;
}

.related-posts h3 {
    color: black;
    font-size: 2em;
}

.related-posts ul {
    display: flex;
    gap: 3rem;
    flex-wrap: wrap;
    justify-content: center;
}

.related-posts ul li {
    width: 25%;
    display: flex;
    gap: 2rem;
}

.related-posts ul li a {
    display: flex;
}

.related-img {
    overflow: hidden;
    flex: 1;
    width: 150px;
    border-radius: 50px 0 0 0;
}

.related-text {
    flex: 1;
    text-align: left;
    margin-left: 10px;
    display: flex;
    flex-direction: column;
    color: #032D60;
    font-weight: 700;
}

.related-text span {
    color: #6b6b6b;
    font-size: 0.8em;
    font-weight: 400;
    margin-top: 20px; 
}