#page-header, .elementor-page-title {
    display: grid;
    align-items: center;
    grid-template-columns: 1fr auto auto;
    gap: 16px
}

body:not(.woocommerce) #page-header, body:not(.woocommerce) .elementor-page-title {
    padding: 16px 20px;
    box-sizing: border-box;
    background: var(--gray-100);
    border-radius: 16px
}

#page-content {
    position: relative
}

.content-area:not(.content-area-empty) #page-content {
    background-color: var(--gray-100);
    border-radius: 16px;
    width: 100%;
    padding: 24px;
    box-sizing: border-box
}

.wp-block-image .aligncenter > figcaption, .wp-block-image .alignleft > figcaption, .wp-block-image .alignright > figcaption, .wp-block-image.aligncenter > figcaption, .wp-block-image.alignleft > figcaption, .wp-block-image.alignright > figcaption {
    display: block;
    width: 100%;
    margin-top: 0
}

.post-meta {
    padding-inline: 12px;
    border-inline-end: 1px solid var(--gray-200);
    display: flex;
    gap: 8px;
    align-items: center;
    color: var(--text-200)
}

    .post-meta a {
        color: inherit
    }

        .post-meta a:hover {
            color: var(--primary-100)
        }

    .post-meta.post-date {
        align-items: flex-start
    }

    .post-meta:first-child {
        padding-inline-start: 0
    }

    .post-meta:last-child {
        padding-inline-end: 0;
        border: 0
    }

.post-meta-wrap {
    display: grid;
    grid-template-columns: repeat(4,auto);
    align-items: center;
    margin-inline-start: auto
}

.post-meta.post-views {
    margin-top: 0
}

.post-meta .post-views-texts, .post-meta-value, .post-meta-value a {
    font-size: .875rem
}

#post-share-wrap {
    position: relative;
    grid-column: -1
}

    #post-share-wrap::before {
        content: "";
        position: absolute;
        top: 100%;
        height: 12px;
        width: 100%
    }

    #post-share-wrap:focus #post-share-btn::after, #post-share-wrap:focus-within #post-share-btn::after, #post-share-wrap:hover #post-share-btn::after {
        opacity: 1
    }

    #post-share-wrap:focus #post-share-body, #post-share-wrap:focus-within #post-share-body, #post-share-wrap:hover #post-share-body {
        visibility: visible;
        opacity: 1
    }

#post-share-btn {
    position: relative;
    color: #fff;
    background: var(--primary-100);
    display: flex;
    padding: 12px;
    border-radius: 12px;
    cursor: pointer
}

#post-share-body {
    visibility: hidden;
    opacity: 0;
    position: absolute;
    inset-inline-end: 0;
    z-index: 10;
    width: max-content;
    min-width: 300px;
    box-sizing: border-box;
    background: #fff;
    border-radius: 12px;
    border: 1px solid var(--primary-100);
    margin-top: 12px;
    padding: 12px 16px;
    will-change: opacity,visibility;
    transition: .2s ease-in-out;
    transition-property: opacity,visibility
}

#post-share-items {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    margin-bottom: 16px
}

#post-share-shortlink {
    direction: ltr;
    width: 100%;
    box-sizing: border-box;
    padding: 0;
    border-radius: 0
}

#post-share-shortlink-wrap {
    display: flex;
    align-items: center;
    gap: 6px;
    padding: 4px;
    background: var(--input-bg);
    border-radius: 6px
}

#post-share-copy {
    background: #fff;
    border-radius: 6px;
    display: flex;
    padding: 4px;
    cursor: pointer
}

#post-share-copy-tick {
    display: none
}

.post-share-item {
    color: var(--text-300)
}

    .post-share-item:hover {
        color: var(--primary-100)
    }

#post-content {
    row-gap: 40px
}

.content-area:not(.content-area-empty) .entry-content .post-thumbnail {
    position: relative;
    margin-bottom: 56px
}

    .content-area:not(.content-area-empty) .entry-content .post-thumbnail a {
        position: relative;
        z-index: 1
    }

.content-area:not(.content-area-empty) .entry-content figure:not(.post-thumbnail):has(img:not(.emoji)) {
    margin-bottom: 2em
}

.content-area:not(.content-area-empty) .entry-content p:not(:last-child) {
    margin-bottom: 1em
}

.content-area:not(.content-area-empty) .entry-content ol, .content-area:not(.content-area-empty) .entry-content ul {
    margin-bottom: 24px;
    list-style: none
}

.content-area:not(.content-area-empty) .entry-content li {
    margin-bottom: .5em;
    position: relative
}

    .content-area:not(.content-area-empty) .entry-content li:last-child {
        margin-bottom: 0
    }

.content-area:not(.content-area-empty) .entry-content h1, .content-area:not(.content-area-empty) .entry-content h2, .content-area:not(.content-area-empty) .entry-content h3, .content-area:not(.content-area-empty) .entry-content h4, .content-area:not(.content-area-empty) .entry-content h5, .content-area:not(.content-area-empty) .entry-content h6 {
    margin-bottom: 16px
}

.content-area:not(.content-area-empty) .entry-content img:not(.emoji) {
    margin-bottom: 16px;
    border-radius: 16px
}

.content-area:not(.content-area-empty) .entry-content .aligncenter {
    display: block;
    margin-inline: auto
}

.content-area:not(.content-area-empty) .entry-content .alignleft {
    display: block;
    margin-right: auto
}

.content-area:not(.content-area-empty) .entry-content .alignright {
    display: block;
    margin-left: auto
}

.content-area:not(.content-area-empty) .entry-content .wp-caption {
    max-width: 100%
}

.content-area:not(.content-area-empty) .entry-content #post-terms-wrap {
    margin-top: 28px
}

.content-area:not(.content-area-empty) .entry-content #post-categories:not(:last-child) {
    padding-bottom: 8px;
    margin-bottom: 12px;
    border-bottom: 1px solid var(--text-100)
}

.content-area:not(.content-area-empty) .entry-content .post-terms {
    display: flex;
    flex-wrap: wrap;
    font-size: .875rem
}

    .content-area:not(.content-area-empty) .entry-content .post-terms a:not(:hover) {
        color: var(--text-300)
    }

.content-area:not(.content-area-empty) .entry-content .post-term-title {
    margin-inline-end: 12px;
    color: var(--text-300);
    font-weight: 500
}

.content-area:not(.content-area-empty) .entry-content .post-term-separator {
    margin-inline: 2px 8px
}

.content-area:not(.content-area-empty) .entry-content #post-tags {
    gap: 8px
}

    .content-area:not(.content-area-empty) .entry-content #post-tags .post-term-title {
        margin-inline-end: 4px
    }

    .content-area:not(.content-area-empty) .entry-content #post-tags a {
        padding: 0 12px;
        border-radius: 12px;
        background: #fff;
        color: var(--text-200)
    }

        .content-area:not(.content-area-empty) .entry-content #post-tags a:hover {
            background: var(--secondary-100);
            color: #fff
        }

.content-area:not(.content-area-empty) .entry-content:not(.disable-image-style) .post-thumbnail img {
    width: calc(100% - 10px)
}

.content-area:not(.content-area-empty) .entry-content:not(.disable-image-style) figure:not(.post-thumbnail):has(img:not(.emoji)), .content-area:not(.content-area-empty) .entry-content:not(.disable-image-style) p:has(img:not(.emoji)) {
    width: fit-content
}

.content-area:not(.content-area-empty) .entry-content:not(.disable-image-style) .post-thumbnail, .content-area:not(.content-area-empty) .entry-content:not(.disable-image-style) figure:not(.post-thumbnail), .content-area:not(.content-area-empty) .entry-content:not(.disable-image-style) p {
    position: relative
}

    .content-area:not(.content-area-empty) .entry-content:not(.disable-image-style) .post-thumbnail img:not(.emoji), .content-area:not(.content-area-empty) .entry-content:not(.disable-image-style) figure:not(.post-thumbnail) img:not(.emoji), .content-area:not(.content-area-empty) .entry-content:not(.disable-image-style) p img:not(.emoji) {
        position: relative;
        transform: translate(10px,10px);
        margin-bottom: 0;
        z-index: 1
    }

    .content-area:not(.content-area-empty) .entry-content:not(.disable-image-style) .post-thumbnail:has(img:not(.emoji))::after, .content-area:not(.content-area-empty) .entry-content:not(.disable-image-style) figure:not(.post-thumbnail):has(img:not(.emoji))::after, .content-area:not(.content-area-empty) .entry-content:not(.disable-image-style) p:has(img:not(.emoji))::after {
        content: "";
        border-radius: 16px;
        border: 4px solid var(--primary-100);
        position: absolute;
        inset: 0;
        inset-inline: -10px 24px
    }

    .content-area:not(.content-area-empty) .entry-content:not(.disable-image-style) p:has(img:not(.emoji))::after {
        inset-inline-end: 14px;
        bottom: 24px
    }

blockquote {
    background: var(--primary-100-20);
    border-radius: 12px;
    padding: 36px 28px;
    color: var(--secondary-100);
    position: relative;
    margin-block: 36px;
    font-size: .875rem
}

    blockquote p:last-child {
        margin-bottom: 0
    }

    blockquote::after, blockquote::before {
        position: absolute;
        color: var(--primary-100);
        font-family: newweb !important;
        font-size: 2.875rem;
        line-height: 1
    }

    blockquote::before {
        content: "";
        top: -26px;
        inset-inline-end: 24px
    }

    blockquote::after {
        content: "";
        bottom: -12px;
        inset-inline-start: 24px
    }

.single-section {
    border: 1px solid var(--gray-200);
    border-radius: 24px;
    padding: 24px;
    box-sizing: border-box;
    background: #fff;
    display: flex;
    flex-direction: column;
    gap: 16px
}

.end-posts {
    margin-top: 16px
}

.end-posts-wrap {
    display: flex;
    flex-direction: column;
    gap: 16px;
    margin-top: 72px
}

.end-posts-head {
    display: flex;
    gap: 16px
}

    .end-posts-head .section-title-wrap {
        margin-inline-end: auto
    }

    .end-posts-head .button {
        margin: 0
    }

.end-posts-footer {
    display: none
}

body:not(.elementor-editor-active) .content-area:not(.content-area-empty) .entry-content ol, body:not(.elementor-editor-active) .content-area:not(.content-area-empty) .entry-content ul:not(.list-items) {
    margin-bottom: 24px;
    list-style: none
}

body:not(.elementor-editor-active) .content-area:not(.content-area-empty) .entry-content ul:not(.list-items) {
    padding-inline: 16px
}

body:not(.elementor-editor-active) .content-area:not(.content-area-empty) .entry-content ol {
    counter-reset: newweb-counter
}

    body:not(.elementor-editor-active) .content-area:not(.content-area-empty) .entry-content ol[start] {
        counter-reset: auto
    }

    body:not(.elementor-editor-active) .content-area:not(.content-area-empty) .entry-content ol li {
        counter-increment: newweb-counter;
        color: var(--secondary-200)
    }

        body:not(.elementor-editor-active) .content-area:not(.content-area-empty) .entry-content ol li::before {
            content: counter(newweb-counter);
            color: #fff;
            min-width: 36px;
            min-height: 36px;
            line-height: 1;
            margin-inline-end: 12px;
            background: var(--secondary-100)
        }

body:not(.elementor-editor-active) .content-area:not(.content-area-empty) .entry-content ul:not(.list-items) li {
    color: var(--secondary-200);
    background: #fff;
    border-radius: 8px;
    padding: 12px 26px
}

    body:not(.elementor-editor-active) .content-area:not(.content-area-empty) .entry-content ul:not(.list-items) li::before {
        content: "";
        font-family: newweb !important;
        font-size: .625rem;
        color: #fff;
        width: 25px;
        height: 25px;
        background: var(--primary-100);
        position: absolute;
        inset-inline-start: 0;
        transform: translateX(-50%);
        padding-bottom: 4px
    }

body:not(.elementor-editor-active) .content-area:not(.content-area-empty) .entry-content li:not(.list-item) {
    margin-bottom: 16px;
    position: relative;
    box-sizing: border-box
}

    body:not(.elementor-editor-active) .content-area:not(.content-area-empty) .entry-content li:not(.list-item)::before {
        border-radius: 8px;
        display: inline-flex;
        align-items: center;
        justify-content: center;
        box-sizing: border-box
    }

    body:not(.elementor-editor-active) .content-area:not(.content-area-empty) .entry-content li:not(.list-item) > :is(p,strong):first-child {
        display: inline-block;
        margin: 0
    }

@media screen and (max-width:1023px) {
    #page-header, .elementor-page-title {
        padding: 12px;
        gap: 8px
    }

    #page-title, #post-title {
        font-size: 1rem
    }
}

@media screen and (max-width:767px) {
    #page-header, .elementor-page-title {
        display: flex
    }
}

@media screen and (max-width:480px) {
    .post-meta {
        border: 0;
        padding: 0
    }

    .post-meta-wrap {
        display: flex;
        flex-wrap: wrap;
        margin: auto;
        gap: 16px
    }

    #post-share-wrap {
        margin-inline-start: auto
    }

    blockquote {
        padding: 24px 12px
    }

    .end-posts-head .button {
        display: none
    }

    .end-posts-footer {
        display: flex;
        align-content: center
    }
}