.noshow {display: none;}
.upload_progress {
    position: fixed;
    top:0;
    left:0;
    width:100%;
    height: 10px;
    background: linear-gradient(-45deg, #ee7752, #23a6d5, #23d5ab);
    background-size: 400% 400%;
    animation: gradient 3s ease infinite;
    z-index:211111;
    color:#fff;
    text-align: center;
    line-height: 50px;
    display: none;
}
.upload_progress span:after {
    content: '.';
    animation: loading 1s ease alternate infinite;
}
@keyframes loading {
    60%  { text-shadow: 0.35em 0 0 currentColor; }
    100% { text-shadow: 0.35em 0 0 currentColor, 0.75em 0 0 currentColor; }
}
@keyframes gradient {
    0% {
        background-position: 0% 50%;
    }
    50% {
        background-position: 100% 50%;
    }
    100% {
        background-position: 0% 50%;
    }
}
.post blockquote, .blockquote {
    display: block;
    font: italic 400 24px/36px Georgia;
    margin: 0 0 40px;
    padding-left: 6.5rem;
    background: url("../img/blockquote.svg") no-repeat 0 0;
}
.post p {
    margin: 0 0 20px 0;
}
.post ul {
    margin: 0 0 20px 0;
}
.main__section .news-preview-wrap {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
}
.main__section .news-preview-wrap .news-preview {
    padding: 0 10px 0 0;
}
.news-preview-wrap {
    row-gap: 32px;
}
.upload_progress {
    position: fixed;
    top:0;
    left:0;
    width:100%;
    height: 50px;
    background: linear-gradient(-45deg, #ee7752, #23a6d5, #23d5ab);
    background-size: 400% 400%;
    animation: gradient 3s ease infinite;
    z-index:211111;
    color:#fff;
    text-align: center;
    line-height: 50px;
    display: none;
}
.upload_progress span:after {
    content: '.';
    animation: loading 1s ease alternate infinite;
}
@keyframes loading {
    60%  { text-shadow: 0.35em 0 0 currentColor; }
    100% { text-shadow: 0.35em 0 0 currentColor, 0.75em 0 0 currentColor; }
}
@keyframes gradient {
    0% {
        background-position: 0% 50%;
    }
    50% {
        background-position: 100% 50%;
    }
    100% {
        background-position: 0% 50%;
    }
}

/*
.tag-group .tag {
}

.tag-group .tag:nth-child(n+4) {
    display: none;
}
.tag-group .tag:nth-child(3) {
}
.tag-group .tag.showall {
    display: block!important;
}
    */
.tag-group .tag.is-active {
    order: -1;
    display: block;
}
.tag-group .tag.is-active.noshow {
    display: none;
}
.tag-group .tag-button-more {
    order: -1;
}
.tag-group .tags_clear {
    order: -3;
    color:#fff;
    cursor:pointer;
    display: none;
    background: url("../img/Frame 133.svg") no-repeat center center;
}
.tag-group:has(.is-active) .tags_clear {
    display: block!important;
}
.tag-group .tag:nth-child(3+n) {
    background: #fff;
}
@media (max-width: 650px) {
    .article-preview {
        margin-bottom:30px;
    }
    .main__section .news-preview-wrap {
        padding:0 15px;
        display: block;
    }
    .main__section .news-preview-wrap .news-preview{
        width:100%;
        margin-bottom:20px;
    }
    .main__section .news-preview-wrap .news-preview:last-child{
        margin-bottom:0;
    }
    .main__section .news-preview-wrap .news-preview__header {
        margin-bottom: 6px;
    }
}

/* Medical editorial theme */
:root {
    --medical-teal: #087f8c;
    --medical-teal-dark: #075d68;
    --medical-blue: #2563a6;
    --medical-coral: #e45d68;
    --medical-ink: #17313a;
    --medical-muted: #60757d;
    --medical-line: #d9e7e9;
    --medical-surface: #eef7f7;
    --color-link: var(--medical-teal);
    --color-link-h: var(--medical-blue);
    --dark: var(--medical-ink);
    --gray-l: var(--medical-surface);
}

body {
    color: var(--medical-ink);
    background: #fbfdfd;
}

h1, h2, .heading-1, .heading-2 {
    text-transform: none;
    letter-spacing: 0;
}

.header.styled {
    background: #fff;
    border-bottom: 1px solid var(--medical-line);
}

.styled:after {
    height: 4px;
    background: linear-gradient(90deg, var(--medical-teal) 0 48%, var(--medical-blue) 48% 82%, var(--medical-coral) 82%);
}

.medical-logo {
    display: inline-flex;
    align-items: center;
    gap: 11px;
    color: var(--medical-ink);
}

.medical-logo:hover { color: var(--medical-teal); }

.medical-logo__mark {
    display: grid;
    place-items: center;
    width: 44px;
    aspect-ratio: 1;
    border-radius: 50%;
    color: #fff;
    background: var(--medical-teal);
    font: 500 34px/1 var(--font-main);
}

.medical-logo__text { display: grid; }
.medical-logo__text strong { font: 600 20px/1.1 var(--font-sec); }
.medical-logo__text small { margin-top: 3px; color: var(--medical-muted); font-size: 11px; }
.header__logo { max-width: none; }
.header__note { color: var(--medical-muted); font-size: 14px; }

.nav-list { text-transform: none; font-weight: 500; }
.nav-list .is-current { color: var(--medical-teal); }

.main { background: linear-gradient(180deg, var(--medical-surface) 0, #fbfdfd 150px); }
.caption-box {
    background: var(--medical-teal-dark);
    border-radius: 4px;
    text-transform: none;
    font-weight: 500;
}

.article-preview {
    width: 100%;
    max-width: 100%;
    min-width: 0;
    padding: 18px;
    border: 1px solid var(--medical-line);
    border-left: 4px solid var(--medical-teal);
    border-radius: 6px;
    background: #fff;
    box-shadow: 0 8px 24px rgba(23, 49, 58, .06);
}

.grid__main,
.article-preview-wrap,
.article-preview__body {
    min-width: 0;
}

.article-preview__media { aspect-ratio: 13 / 8; }
.article-preview__media .media, .article-preview__media img { width: 100%; height: 100%; object-fit: cover; }
.article-preview__content { color: var(--medical-muted); }
.article-preview__footer { padding-top: 12px; border-top: 1px solid var(--medical-line); }
.news-preview { padding-left: 14px; border-left: 2px solid var(--medical-line); }
.news-preview__time, .time, .tags-line { color: var(--medical-muted); }

.tag { border: 1px solid var(--medical-line); background: #fff; color: var(--medical-teal-dark); }
.tag-button:hover { background: var(--medical-surface); color: var(--medical-teal-dark); }
.tag-button:after { background: var(--medical-teal); }

.button { border-color: var(--medical-teal); color: var(--medical-teal-dark); text-transform: none; font-weight: 500; }
.button:before { background: var(--medical-teal); }

.health-note {
    padding: 18px 14px;
    border: 1px solid var(--medical-line);
    border-top: 4px solid var(--medical-coral);
    border-radius: 6px;
    background: #fff;
    color: var(--medical-muted);
    font-size: 14px;
    line-height: 1.5;
}
.health-note__icon {
    display: grid;
    place-items: center;
    width: 30px;
    height: 30px;
    margin-bottom: 12px;
    border-radius: 50%;
    color: #fff;
    background: var(--medical-coral);
    font-weight: 700;
}
.health-note strong { color: var(--medical-ink); }
.health-note p { margin: 6px 0 0; }

.post { font-size: 18px; line-height: 1.75; }
.post img { border: 1px solid var(--medical-line); border-radius: 6px; }
.post blockquote, .blockquote {
    padding: 24px 28px;
    border-left: 4px solid var(--medical-teal);
    background: var(--medical-surface);
    color: var(--medical-teal-dark);
}
.post-info { justify-content: flex-start; }
.main__section.styled { background: var(--medical-surface); }

@media (max-width: 650px) {
    .grid__main {
        width: 100%;
        padding-right: 4px;
    }

    .grid__main .article-preview-wrap {
        width: 100%;
    }

    .grid__main .article-preview {
        overflow: hidden;
    }
}

.footer { background: var(--medical-ink); color: #dce9eb; }
.footer .nav-list, .footer .medical-logo { color: #fff; }
.footer .medical-logo__mark { background: var(--medical-coral); }
.footer .medical-logo__text small, .footer__mission, .copy { color: #a9c0c5; }
.footer .tag { border-color: #48616a; background: transparent; color: #dce9eb; }

.pagination ul li.active a {
    background: var(--medical-teal);
    border-color: var(--medical-teal);
    color: #fff !important;
}

.pagination ul li:not(.active) a:hover,
.pagination-btn:hover,
.pagination-btn:active,
.pagination-btn:focus {
    color: var(--medical-teal-dark);
    background: var(--medical-surface);
    border-color: var(--medical-line);
}

.pagination ul li a:focus,
.pagination ul li a:active {
    color: var(--medical-teal-dark);
}

@media (max-width: 56.25rem) {
    .header__content { background: #fff; }
    .header__note { border-top: 1px solid var(--medical-line); }
}

@media (max-width: 40.625rem) {
    .article-preview { padding: 14px; }
    .article-preview__col { margin-bottom: 16px; }
    .medical-logo__mark { width: 38px; font-size: 29px; }
    .medical-logo__text strong { font-size: 18px; }
    .header__note { font-size: 12px; }
    .post { font-size: 17px; line-height: 1.65; }
}
