/* ==========================================================================
   BLOG ASPOL
   ========================================================================== */

.aspol-blog {
    --aspol-blog-bg: #f5f4f2;
    --aspol-blog-text: #2c3e50;
    --aspol-blog-text-soft: #5f6c77;
    --aspol-blog-text-muted: #7f8c8d;
    --aspol-blog-number: #8b98a3;
    --aspol-blog-accent: #3498db;
    --aspol-blog-accent-hover: #2980b9;
    --aspol-blog-border: #d7dee4;
    --aspol-blog-surface: #f3f5f6;
    --aspol-blog-white: #ffffff;
    --aspol-blog-font: "Helvetica Neue", Helvetica, Arial, sans-serif;
    --aspol-blog-transition: 0.2s ease;
    color: var(--aspol-blog-text);
    font-family: var(--aspol-blog-font);
}

.aspol-blog .container {
    max-width: 1200px;
}

.aspol-blog-shell,
.aspol-single-article {
    max-width: 980px;
    margin: 0 auto;
}

.aspol-blog-header,
.aspol-single-header {
    padding: 14.4rem 0 4.8rem;
}

.aspol-single-header {
    max-width: 81.4rem;
    margin-left: auto;
    margin-right: auto;
    text-align: center;
}

.aspol-single-back {
    display: flex;
    justify-content: flex-start;
    width: 100%;
    margin-bottom: 2.2rem;
}

.aspol-single-back-link {
    display: inline-flex;
    align-items: center;
    gap: 0.6rem;
    padding: 0.85rem 1.4rem;
    color: var(--aspol-blog-text);
    background: transparent;
    border: 1px solid var(--aspol-blog-border);
    border-radius: 0.4rem;
    font-family: var(--aspol-blog-font);
    font-size: 1.35rem;
    font-weight: 500;
    line-height: 1.4;
    letter-spacing: 0.04em;
    text-decoration: none;
    transition: color var(--aspol-blog-transition), border-color var(--aspol-blog-transition), background-color var(--aspol-blog-transition);
}

.aspol-single-back-link::before {
    content: "\2190";
    font-size: 1.15em;
    line-height: 1;
}

.aspol-single-back-link:hover,
.aspol-single-back-link:focus {
    color: var(--aspol-blog-accent);
    background-color: var(--aspol-blog-surface);
    border-color: var(--aspol-blog-accent);
}

.aspol-blog-kicker {
    display: inline-block;
    margin-bottom: 1.4rem;
    color: var(--aspol-blog-text-muted);
    font-family: var(--aspol-blog-font);
    font-size: 1.2rem;
    font-weight: 500;
    letter-spacing: 0.18em;
    line-height: 1.4;
    text-transform: uppercase;
}

.aspol-blog-title,
.aspol-single-title {
    margin: 0;
    color: var(--aspol-blog-text);
    font-family: var(--aspol-blog-font);
    font-weight: 700;
    letter-spacing: -0.02em;
    line-height: 1.05;
    text-wrap: balance;
}

.aspol-blog-title {
    max-width: 13ch;
    font-size: clamp(3.8rem, 4vw, 5.4rem);
}

.aspol-single-title {
    max-width: 100%;
    margin-left: auto;
    margin-right: auto;
    text-align: center;
    font-size: clamp(3.9rem, 4.6vw, 5.8rem);
    line-height: 1.08;
    text-wrap: normal;
}

.aspol-blog-intro {
    max-width: 62rem;
    margin: 2rem 0 0;
    color: var(--aspol-blog-text-soft);
    font-family: var(--aspol-blog-font);
    font-size: 1.85rem;
    line-height: 1.78;
}

.aspol-blog-list {
    border-top: 1px solid var(--aspol-blog-border);
}

.aspol-blog-item {
    margin: 0;
    padding: 0;
    border-bottom: 1px solid var(--aspol-blog-border);
    transition: background-color var(--aspol-blog-transition);
}

.aspol-blog-item-grid {
    display: grid;
    grid-template-columns: 7rem minmax(0, 1fr);
    gap: 2.2rem;
    align-items: start;
    padding: 3.2rem 0 3rem;
}

.aspol-blog-number {
    color: var(--aspol-blog-number);
    font-family: var(--aspol-blog-font);
    font-size: 2rem;
    font-weight: 500;
    letter-spacing: 0.04em;
    line-height: 1;
    padding-top: 0.4rem;
    transition: color var(--aspol-blog-transition);
}

.aspol-blog-item-content {
    min-width: 0;
}

.aspol-blog-item-title {
    margin: 0;
    max-width: 18ch;
    font-family: var(--aspol-blog-font);
    font-size: clamp(2.8rem, 3vw, 3.6rem);
    font-weight: 700;
    letter-spacing: -0.02em;
    line-height: 1.12;
}

.aspol-blog-item-title a {
    color: var(--aspol-blog-text);
    text-decoration: none;
    transition: color var(--aspol-blog-transition);
}

.aspol-blog-item:hover .aspol-blog-number,
.aspol-blog-item:focus-within .aspol-blog-number {
    color: var(--aspol-blog-accent);
}

.aspol-blog-item-title a:hover,
.aspol-blog-item-title a:focus,
.aspol-blog-item:hover .aspol-blog-item-title a,
.aspol-blog-item:focus-within .aspol-blog-item-title a {
    color: var(--aspol-blog-accent);
}

.aspol-blog-item-excerpt {
    max-width: 62rem;
    margin-top: 1.3rem;
    color: var(--aspol-blog-text-soft);
    font-size: 1.75rem;
    line-height: 1.78;
}

.aspol-blog-item-excerpt p:last-child {
    margin-bottom: 0;
}

.aspol-blog-empty {
    max-width: 68rem;
    padding: 4.8rem 0 7rem;
}

.aspol-blog-empty h2 {
    margin-bottom: 1.4rem;
}

.aspol-blog-empty p {
    color: var(--aspol-blog-text-soft);
    font-size: 1.8rem;
    line-height: 1.75;
}

.aspol-blog .posts-navigation {
    max-width: 980px;
    margin: 3.6rem auto 0;
    padding-top: 2rem;
    border-top: 1px solid var(--aspol-blog-border);
    text-align: left;
}

.aspol-blog .posts-navigation .nav-links {
    display: flex;
    justify-content: space-between;
    gap: 2rem;
}

.aspol-blog .posts-navigation .nav-previous,
.aspol-blog .posts-navigation .nav-next {
    flex: 1;
}

.aspol-blog .posts-navigation .nav-next {
    text-align: right;
}

.aspol-blog .posts-navigation .nav-links a {
    display: inline-block;
    max-width: none;
    padding: 0.8rem 0;
    background: transparent;
    color: var(--aspol-blog-text);
    font-family: var(--aspol-blog-font);
    font-size: 1.6rem;
    font-weight: 500;
    line-height: 1.5;
    border-radius: 0;
    border-bottom: 1px solid transparent;
    text-align: inherit;
    transition: color var(--aspol-blog-transition), border-color var(--aspol-blog-transition);
}

.aspol-blog .posts-navigation .nav-links a:hover,
.aspol-blog .posts-navigation .nav-links a:focus {
    background: transparent;
    color: var(--aspol-blog-accent);
    border-bottom-color: var(--aspol-blog-accent);
    transform: none;
}

.aspol-single-meta {
    margin-top: 1.8rem;
    color: var(--aspol-blog-text-muted);
    font-family: var(--aspol-blog-font);
    font-size: 1.35rem;
    font-weight: 500;
    letter-spacing: 0.04em;
    line-height: 1.5;
    text-align: center;
    text-transform: uppercase;
}

.aspol-entry-content {
    max-width: 74rem;
    margin: 0 auto;
    color: var(--aspol-blog-text);
    font-family: var(--aspol-blog-font);
}

.aspol-entry-content > *:first-child {
    margin-top: 0;
}

.aspol-entry-content > *:last-child {
    margin-bottom: 0;
}

.aspol-entry-content p,
.aspol-entry-content ul,
.aspol-entry-content ol,
.aspol-entry-content blockquote,
.aspol-entry-content table,
.aspol-entry-content .wp-block-table,
.aspol-entry-content .wp-block-image,
.aspol-entry-content .wp-block-embed,
.aspol-entry-content hr {
    margin-bottom: 2.8rem;
}

.aspol-entry-content h2,
.aspol-entry-content h3,
.aspol-entry-content h4 {
    margin-top: 5.2rem;
    margin-bottom: 1.8rem;
    color: var(--aspol-blog-text);
    font-family: var(--aspol-blog-font);
    font-weight: 700;
    letter-spacing: -0.02em;
    line-height: 1.14;
}

.aspol-entry-content h2 {
    font-size: clamp(3rem, 3.2vw, 3.8rem);
}

.aspol-entry-content h3 {
    font-size: clamp(2.3rem, 2.5vw, 2.9rem);
}

.aspol-entry-content h4 {
    font-size: 2rem;
}

.aspol-entry-content p,
.aspol-entry-content li {
    color: var(--aspol-blog-text);
    font-size: 1.85rem;
    line-height: 1.82;
}

.aspol-entry-content strong {
    color: var(--aspol-blog-text);
    font-weight: 700;
}

.aspol-entry-content em {
    color: inherit;
    font-style: italic;
}

.aspol-entry-content ul,
.aspol-entry-content ol {
    padding-left: 2.2rem;
}

.aspol-entry-content li + li {
    margin-top: 0.9rem;
}

.aspol-entry-content ul ul,
.aspol-entry-content ul ol,
.aspol-entry-content ol ul,
.aspol-entry-content ol ol {
    margin-top: 1rem;
    margin-bottom: 0;
}

.aspol-entry-content a {
    color: var(--aspol-blog-text);
    text-decoration: underline;
    text-decoration-color: rgba(44, 62, 80, 0.5);
    text-decoration-thickness: 1px;
    text-underline-offset: 0.2em;
    transition: color var(--aspol-blog-transition), text-decoration-color var(--aspol-blog-transition);
}

.aspol-entry-content a:hover,
.aspol-entry-content a:focus {
    color: var(--aspol-blog-accent);
    text-decoration-color: currentColor;
}

.aspol-entry-content img {
    max-width: 100%;
    height: auto;
}

.aspol-entry-content .wp-block-image img,
.aspol-entry-content .wp-block-table table,
.aspol-entry-content table {
    width: 100%;
}

.aspol-entry-content figure {
    margin-left: 0;
    margin-right: 0;
}

.aspol-entry-content figcaption {
    margin-top: 1rem;
    color: var(--aspol-blog-text-soft);
    font-size: 1.35rem;
    line-height: 1.65;
    text-align: left;
}

.aspol-entry-content .wp-block-table {
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
}

.aspol-entry-content table,
.aspol-entry-content .wp-block-table table {
    border-collapse: collapse;
    border: 1px solid var(--aspol-blog-border);
    background: var(--aspol-blog-white);
}

.aspol-entry-content thead {
    background: var(--aspol-blog-surface);
}

.aspol-entry-content th,
.aspol-entry-content td {
    padding: 1.5rem 1.6rem;
    border: 1px solid var(--aspol-blog-border);
    text-align: left;
    vertical-align: top;
    font-size: 1.65rem;
    line-height: 1.7;
}

.aspol-entry-content th {
    color: var(--aspol-blog-text);
    font-weight: 700;
}

.aspol-entry-content td {
    color: var(--aspol-blog-text-soft);
}

.aspol-entry-content blockquote {
    margin-left: 0;
    padding: 2rem 2.4rem 2rem 2.8rem;
    color: var(--aspol-blog-text-soft);
    border-left: 2px solid var(--aspol-blog-text);
    background: var(--aspol-blog-surface);
}

.aspol-entry-content blockquote p,
.aspol-entry-content blockquote li {
    color: inherit;
}

.aspol-entry-content blockquote p:last-child {
    margin-bottom: 0;
}

.aspol-entry-content hr {
    border: 0;
    border-top: 1px solid var(--aspol-blog-border);
}

.aspol-entry-content .page-links {
    margin: 4rem 0 0;
    padding-top: 2rem;
    border-top: 1px solid var(--aspol-blog-border);
    color: var(--aspol-blog-text-soft);
    font-size: 1.5rem;
    text-align: left;
}

.aspol-entry-content .page-links a {
    margin-left: 0.8rem;
}

@media (max-width: 900px) {
    .aspol-blog-header,
    .aspol-single-header {
        padding: 13rem 0 4rem;
    }

    .aspol-blog-title {
        max-width: 14ch;
    }

    .aspol-single-header {
        max-width: 79rem;
    }

    .aspol-single-title {
        font-size: clamp(3.8rem, 4.8vw, 5.2rem);
    }

    .aspol-blog-item-grid {
        grid-template-columns: 6rem minmax(0, 1fr);
        gap: 1.8rem;
    }
}

@media (max-width: 768px) {
    .aspol-blog-header,
    .aspol-single-header {
        padding: 12.4rem 0 3.2rem;
    }

    .aspol-blog-kicker {
        font-size: 1.15rem;
        letter-spacing: 0.16em;
    }

    .aspol-blog-title {
        font-size: 3.6rem;
    }

    .aspol-single-header {
        max-width: 100%;
        text-align: left;
    }

    .aspol-single-back {
        margin-bottom: 1.8rem;
    }

    .aspol-single-title {
        margin-left: 0;
        margin-right: 0;
        text-align: left;
        font-size: clamp(3.3rem, 10vw, 4.2rem);
    }

    .aspol-single-meta {
        text-align: left;
    }

    .aspol-blog-intro {
        margin-top: 1.8rem;
        font-size: 1.75rem;
    }

    .aspol-blog-item-grid {
        grid-template-columns: 5.2rem minmax(0, 1fr);
        gap: 1.4rem;
        padding: 2.4rem 0;
    }

    .aspol-blog-number {
        font-size: 1.75rem;
        padding-top: 0.3rem;
    }

    .aspol-blog-item-title {
        font-size: 2.7rem;
    }

    .aspol-blog-item-excerpt,
    .aspol-entry-content p,
    .aspol-entry-content li {
        font-size: 1.7rem;
    }

    .aspol-entry-content h2 {
        font-size: 2.8rem;
    }

    .aspol-entry-content h3 {
        font-size: 2.2rem;
    }

    .aspol-entry-content th,
    .aspol-entry-content td {
        font-size: 1.55rem;
    }

    .aspol-entry-content .wp-block-table table,
    .aspol-entry-content table {
        min-width: 56rem;
    }

    .aspol-blog .posts-navigation .nav-links {
        flex-direction: column;
    }

    .aspol-blog .posts-navigation .nav-next {
        text-align: left;
    }
}

@media (max-width: 540px) {
    .aspol-blog-header,
    .aspol-single-header {
        padding: 11.8rem 0 2.8rem;
    }

    .aspol-blog-title {
        max-width: none;
        font-size: 3.2rem;
    }

    .aspol-single-title {
        font-size: clamp(3.1rem, 9.6vw, 3.8rem);
    }

    .aspol-blog-intro {
        font-size: 1.65rem;
        line-height: 1.72;
    }

    .aspol-blog-item-grid {
        grid-template-columns: 4.4rem minmax(0, 1fr);
        gap: 1.2rem;
        padding: 2.1rem 0;
    }

    .aspol-blog-number {
        font-size: 1.6rem;
    }

    .aspol-blog-item-title {
        font-size: 2.4rem;
    }

    .aspol-blog-item-excerpt,
    .aspol-entry-content p,
    .aspol-entry-content li,
    .aspol-entry-content th,
    .aspol-entry-content td {
        font-size: 1.6rem;
    }

    .aspol-entry-content h2 {
        font-size: 2.5rem;
    }

    .aspol-entry-content h3 {
        font-size: 2rem;
    }

    .aspol-entry-content blockquote {
        padding: 1.8rem 1.8rem 1.8rem 2rem;
    }
}
