/*
 * BUHALTERIJA.COM
 * FINAL CONTENT SYSTEM
 *
 * Vienoda sistema:
 * - service.php
 * - article.php
 * - basic-page.php
 *
 * NELIEČIA:
 * - homepage
 * - contact module
 * - service/article katalogų kortelių
 * - SEO tekstų turinio
 */


/* ==========================================================
   1. BENDRAS TURINIO CONTAINER
   ========================================================== */

/*
 * SERVICE
 */
.content-section > .container.editorial-layout,

/*
 * ARTICLE
 */
.content-section > .container.article-shell,

/*
 * BASIC / KAINOS / INFO
 */
.content-section > .container.policy-layout {
    width: min(var(--container), calc(100% - 40px)) !important;
    max-width: var(--container) !important;

    margin-left: auto !important;
    margin-right: auto !important;

    padding-left: 0 !important;
    padding-right: 0 !important;
}

/* Homepage background rhythm: one neutral surface for all light sections. */
.hero,
.compact-services,
.articles-section,
.home-contact-section {
    background: #f1e9e2 !important;
}


/* ==========================================================
   2. SERVICE LAYOUT
   ========================================================== */

/*
 * Sidebar nebespaudžia pagrindinio turinio.
 */
.content-section > .container.editorial-layout {
    display: block !important;
}

.content-section > .container.editorial-layout > .editorial-body {
    width: 100% !important;
    max-width: none !important;

    margin: 0 !important;
}


/* ==========================================================
   3. ARTICLE LAYOUT
   ========================================================== */

.content-section > .container.article-shell {
    display: block !important;
}

.content-section > .container.article-shell > .editorial-body {
    width: 100% !important;
    max-width: none !important;

    margin: 0 !important;
}


/* ==========================================================
   4. BASIC / KAINOS LAYOUT
   ========================================================== */

.content-section > .container.policy-layout {
    display: block !important;
}

.content-section > .container.policy-layout > .editorial-body {
    width: 100% !important;
    max-width: none !important;

    margin: 0 !important;
}


/* ==========================================================
   5. BENDRA TYPOGRAFIJA
   ========================================================== */

.content-section .editorial-body {
    min-width: 0 !important;

    color: #514447 !important;

    font-size: 18px !important;
    line-height: 1.72 !important;
}


/*
 * Nebelieka senų 700 / 760 / 900px limitų.
 */
.content-section .editorial-body > h2,
.content-section .editorial-body > h3,
.content-section .editorial-body > h4,
.content-section .editorial-body > ul,
.content-section .editorial-body > ol,
.content-section .editorial-body > table,
.content-section .editorial-body > blockquote {
    width: 100% !important;
    max-width: none !important;
}


/*
 * Tekstui leidžiam beveik visą 1180px containerį,
 * bet nepadarom kilometrinių eilučių.
 */
.content-section .editorial-body > p {
    width: 100% !important;
    max-width: 1060px !important;

    margin: 0 0 24px !important;

    font-size: 18px !important;
    line-height: 1.72 !important;
}


/*
 * Pirma pastraipa nebesusiaurinta.
 */
.content-section .editorial-body > p:first-of-type {
    max-width: 1060px !important;

    font-size: 18px !important;
    line-height: 1.72 !important;
}


/* ==========================================================
   6. H2 / H3
   ========================================================== */

.content-section .editorial-body h2 {
    margin: 56px 0 18px !important;

    font-size: clamp(32px, 3vw, 42px) !important;
    line-height: 1.11 !important;

    letter-spacing: -.035em !important;

    scroll-margin-top: 110px;
}

.content-section .editorial-body h2:first-child {
    margin-top: 0 !important;
}

.content-section .editorial-body h3 {
    margin: 36px 0 13px !important;

    font-size: 24px !important;
    line-height: 1.25 !important;

    letter-spacing: -.02em !important;
}


/* ==========================================================
   7. NORMALŪS SĄRAŠAI
   ========================================================== */

.content-section .editorial-body ul,
.content-section .editorial-body ol {
    display: block !important;

    width: 100% !important;
    max-width: 1060px !important;

    margin: 18px 0 31px !important;

    padding-left: 24px !important;

    background: transparent !important;
}

.content-section .editorial-body ul {
    list-style: disc outside !important;
}

.content-section .editorial-body ol {
    list-style: decimal outside !important;

    counter-reset: none !important;
}

.content-section .editorial-body li {
    position: static !important;

    display: list-item !important;

    margin: 8px 0 !important;
    padding: 0 !important;

    color: #514447 !important;

    background: transparent !important;

    border: 0 !important;
    border-radius: 0 !important;

    box-shadow: none !important;

    font-size: 18px !important;
    line-height: 1.62 !important;
}


/*
 * Pašalinam senus:
 * ✓
 * 01
 * 02
 * pseudo badges.
 */
.content-section .editorial-body ul li::before,
.content-section .editorial-body ol li::before {
    display: none !important;

    content: none !important;
}

.content-section .editorial-body li::marker {
    color: var(--wine) !important;
}


/* ==========================================================
   8. TURINYS / TOC — SERVICE + BASIC
   ========================================================== */

.content-section .editorial-body > .content-index {
    display: grid !important;

    grid-template-columns:
        190px
        minmax(0,1fr) !important;

    width: 100% !important;
    max-width: none !important;

    margin: 0 0 58px !important;

    padding: 22px 0 !important;

    background: transparent !important;

    border: 0 !important;
    border-top: 1px solid rgba(33,25,27,.12) !important;
    border-bottom: 1px solid rgba(33,25,27,.12) !important;

    border-radius: 0 !important;
}

.content-section .content-index > span {
    grid-row: 1 / 40 !important;

    padding: 8px 28px 8px 0 !important;

    color: var(--ink) !important;

    font-size: 11px !important;
    font-weight: 800 !important;

    letter-spacing: .12em !important;
    text-transform: uppercase !important;
}

.content-section .content-index > a {
    display: block !important;

    padding: 10px 0 !important;

    color: var(--wine) !important;

    font-size: 14px !important;
    line-height: 1.4 !important;

    text-decoration: none !important;

    border: 0 !important;
    border-bottom: 1px solid rgba(33,25,27,.08) !important;
}

.content-section .content-index > a:last-child {
    border-bottom: 0 !important;
}


/* ==========================================================
   9. ARTICLE TOC
   ========================================================== */

.content-section .article-outline {
    width: 100% !important;
    max-width: none !important;

    margin: 0 0 52px !important;

    padding: 0 !important;

    background: transparent !important;

    border: 0 !important;
    border-top: 1px solid rgba(33,25,27,.12) !important;
    border-bottom: 1px solid rgba(33,25,27,.12) !important;

    border-radius: 0 !important;
}

.content-section .article-outline summary {
    padding: 18px 0 !important;

    color: var(--ink);

    font-size: 14px;
    font-weight: 750;

    cursor: pointer;
}

.content-section .article-outline nav {
    padding: 0 0 20px !important;
}


/* ==========================================================
   10. ARTICLE IMAGE
   ========================================================== */

.content-section .article-featured-image {
    width: 100% !important;
    max-width: none !important;

    margin: 0 0 46px !important;
}

.content-section .article-featured-image img {
    width: 100% !important;
    height: auto !important;

    border-radius: 8px !important;
}


/* ==========================================================
   11. BLOCKQUOTE
   ========================================================== */

.content-section .editorial-body blockquote {
    max-width: 1060px !important;

    margin: 32px 0 !important;

    padding: 4px 0 4px 22px !important;

    background: transparent !important;

    border: 0 !important;
    border-left: 3px solid var(--wine) !important;

    border-radius: 0 !important;
}


/* ==========================================================
   12. TABLES
   ========================================================== */

.content-section .editorial-body table {
    margin: 30px 0 38px !important;

    border-collapse: collapse !important;

    font-size: 15px !important;
}

.content-section .editorial-body th,
.content-section .editorial-body td {
    padding: 14px 16px !important;

    text-align: left !important;

    border-bottom: 1px solid var(--line) !important;
}


/* ==========================================================
   13. SERVICE SIDEBAR -> APAČIA
   ========================================================== */

.content-section > .container.editorial-layout > .editorial-aside {
    position: static !important;

    display: grid !important;

    grid-template-columns:
        minmax(0,1.15fr)
        minmax(300px,.85fr) !important;

    gap: 24px !important;

    width: 100% !important;
    max-width: none !important;

    margin: 64px 0 0 !important;

    padding: 40px 0 0 !important;

    border-top: 1px solid var(--line) !important;
}

.content-section > .container.editorial-layout > .editorial-aside .aside-card,
.content-section > .container.editorial-layout > .editorial-aside .aside-links {
    width: 100% !important;
    max-width: none !important;
}


/* ==========================================================
   14. INLINE ARTICLE CTA
   ========================================================== */

.content-section .inline-cta {
    width: 100% !important;
    max-width: none !important;

    margin: 58px 0 !important;
}


/* ==========================================================
   15. SOURCES
   ========================================================== */

.content-section .sources-panel {
    width: 100% !important;
    max-width: none !important;

    margin-top: 54px !important;
}


/* ==========================================================
   TABLET
   ========================================================== */

@media(max-width:900px) {

    .content-section > .container.editorial-layout > .editorial-aside {
        grid-template-columns: 1fr !important;
    }

}


/* ==========================================================
   MOBILE
   ========================================================== */

@media(max-width:620px) {

    .content-section > .container.editorial-layout,
    .content-section > .container.article-shell,
    .content-section > .container.policy-layout {
        width: min(100% - 28px, var(--container)) !important;
    }

    .content-section .editorial-body {
        font-size: 16px !important;
        line-height: 1.7 !important;
    }

    .content-section .editorial-body > p,
    .content-section .editorial-body li {
        font-size: 16px !important;
        line-height: 1.7 !important;
    }

    .content-section .editorial-body h2 {
        margin-top: 46px !important;

        font-size: 29px !important;
    }

    .content-section .editorial-body > .content-index {
        grid-template-columns: 1fr !important;

        margin-bottom: 40px !important;
    }

    .content-section .content-index > span {
        grid-row: auto !important;

        padding: 0 0 12px !important;
    }

}