/* TABLE OF CONTENTS
------------------------------------------------------------/
1.0     Global & Utilities
1.1         Project Variables
1.2         Theme
1.3         Typography
1.4         Spacing
1.5         Globals 
1.6         Utilities
2.0     Core Components
2.1         Logo
2.2         Buttons
2.3         Social Icons
3.0     Layout & Structure
4.0     Headers
5.0     Menus & Navigation
6.0     Footer
7.0     Sidebars
8.0     Core Templates
8.1         Index Template
8.2         Page Template
8.3         Single Post Template
8.4         Front Page Template
8.5         Home Template
8.6         404 Template
8.7         Search Template
9.0     Blocks
10.0    3rd Party Styling
9999    Here be Dragons

/// END TABLE OF CONTENTS * */
/* * 1.0 Global & Utilities
------------------------------------------------------------ */
/* * 1.1 Project Variables
------------------------------------------------------------ */
:root {
    /* BACKGROUND COLORS */
    /* BASE TEXT */
    /* TYPOGRAPHY */
    /* HEADINGS */
    /* ANCHOR TEXT */
    /* HEADINGS */
    /* VIEWPORT SIZES */
    --layout-max-width: 1440px;
    --layout-content-width: 1280px;

    /* Default Page Padding in REM */
    --page-padding-max: clamp(20px, calc(5.56vw - 0px), 80px);
    --page-padding-min: clamp(20px, calc(5.56vw - 0px), 80px);

    /* Default Section Spacing in REM */
    --section-spacing-top: 2rem;
    --section-spacing-bottomr: 2rem;
}

/* Make sticky header work with admin bar 

body.admin-bar .header {
    margin-top: 32px !important;
} */
/* * 1.3 Typography
------------------------------------------------------------ */
/* LIBRE STYLES */
.libre-display {
    color: var(--text_dark);
    font-family: "Libre Caslon Text";
    font-size: 32px;
    font-weight: 700;
    line-height: 40px;
}

.libre-heading-heading-L {
    color: var(--text_mid);
    font-family: "Libre Caslon Text";
    font-size: 30px;
    font-weight: 600;
    line-height: 40px;
}

.libre-heading-heading {
    color: var(--text_dark);
    font-family: "Libre Caslon Text";
    font-size: 24px;
    font-weight: 600;
    line-height: 32px;
}

.libre-heading-title-small {
    color: var(--text_dark);
    font-family: "Libre Caslon Text";
    font-size: 18px;
    font-weight: 700;
    line-height: 24px;
    margin-top: 0;
    margin-bottom: 0;
}

.libre-heading-title-small-dark {
    color: var(--text_dark);
    font-family: "Libre Caslon Text";
    font-size: 18px;
    font-weight: 700;
    line-height: 24px;
    margin-top: 0;
    margin-bottom: 0;
}

/* NOTO STYLES */
.noto-body-xl {
    color: var(--text_light);
    font-family: "Noto Sans";
    font-size: 20px;
    font-weight: 500;
    line-height: 32px;
}

.noto-body {
    color: var(--text_mid);
    font-family: "Noto Sans";
    font-size: 16px;
    font-weight: 500;
    line-height: 24px;
    border-style: none;
    border-width: 0px;
}

.noto-body-caption {
    color: var(--text_mid);
    font-family: "Noto Sans";
    font-size: 14px;
    font-weight: 500;
    line-height: 20px;
}

.noto-search-button {
    color: var(--text_light);
    overflow: hidden;
    font-family: "Noto Sans";
    font-size: 20px;
    font-weight: 500;
    line-height: 32px;
}

/* RUBIK STYLES */
.rubik-tag-category {
    color: var(--text_dark);
    font-family: Rubik;
    font-size: 20px;
    font-weight: 500;
    line-height: 32px;
    letter-spacing: 0.8px;
    text-transform: uppercase;
    margin-bottom: 16px;
}

.header__main-menu {
    color: var(--text_dark);
    font-family: Rubik;
    font-size: 16px;
    font-weight: 500;
    line-height: 20px;
    letter-spacing: 1.2px;
    text-transform: uppercase;
}

.rubik-tag-menu-mobile {
    color: var(--text_dark);
    font-family: Rubik;
    font-size: 16px;
    font-weight: 500;
    line-height: 24px;
    letter-spacing: 1.2px;
    text-transform: uppercase;
}

.rubik-tag {
    color: var(--text_mid);
    font-family: Rubik;
    font-size: 14px;
    font-weight: 500;
    line-height: 20px;
    letter-spacing: 1.2px;
    text-transform: uppercase;
    text-decoration: none;
}

.rubik-footer-desc {
    color: #ffffff;
    font-family: Rubik;
    font-size: 13px;
    font-weight: 400;
    line-height: 18.2px;
    margin: 0;
}

.rubik-footer-list {
    list-style-type: none;
    font-size: 13px;
    font-family: 'Rubik', sans-serif;
    font-weight: 500;
    line-height: 13px;
}

.rubik-tag-sponsored {
    color: rgba(117, 117, 117, 0.60);
    font-family: Rubik;
    font-size: 12px;
    font-weight: 400;
    line-height: 20px;
    letter-spacing: 1.2px;
    text-transform: uppercase;
}

/* DM SERIF STYLES */
.dm-serif-title {
    font-family: "DM Serif Display";
    font-size: 18px;
    font-weight: 400;
    line-height: 22.4px;
    margin: 0;
}

.dm-serif-title-sm {
    font-family: "DM Serif Display";
    font-size: 16px;
    font-weight: 400;
    line-height: 21.6px;
    margin: 0;
}

/* ******** LINKS ********** */
.libre-display a {
    color: var(--link_dark);
    text-decoration: none;
}

.libre-display a:hover {
    text-decoration-line: underline;
}

/* .libre-heading-heading a {
    color: var(--link_dark);
} */
.libre-heading-heading:hover {
    text-decoration-line: underline;
}

.libre-heading-title-small a {
    color: var(--link_dark);
}

.libre-heading-title-small:hover {
    text-decoration-line: underline;
}

.noto-body a {
    color: var(--link_light);
    text-decoration: none;
}

.noto-body-caption a {
    color: var(--text_dark);
}

.noto-body a:hover {
    text-decoration-line: underline !important;
    text-decoration-color: #247E9E;
}

.rubik-tag a {
    color: var(--link_dark);
    text-decoration: none;
}

.rubik-tag a:hover {
    text-decoration-line: underline !important;
}

.rubik-footer-list a {
    text-decoration: none;
    color: #ffffff;
}

.card-meta-div .meta-author:hover {
    text-decoration: underline;
}

/* Cards */
/* Headings */

.stock-market-ticker-stockdio-plugin iframe {
    width: 100% !important;
    height: 30px !important;
}

.top-menu {
    background-color: var(--background-color-light);
}

.bottom-menu {
    border-top: 1px solid var(--lines);
    border-bottom: 1px solid var(--lines);
    background: #F9F9F9;
}

.header__layout-grid {
    display: grid;
    grid-template-columns: fit-content(30%) 1fr;
    grid-template-rows: auto auto;
    grid-template-areas: 'logo mobile-menu' 'main-menu main-menu';
    padding-top: 1rem;
    padding-bottom: 1rem;
    column-gap: 1rem;
    row-gap: 0.5rem;
}

.header__main-bott-menu nav {
    display: none;
}

.site-header nav ul {
    padding: 0;
}

.site-header nav li {
    list-style-type: none;
}

.site-header nav a {
    text-decoration: none;
}

.header__main-menu {
    grid-area: main-menu;
    display: flex;
    align-items: center;
    justify-content: flex-start;
    position: relative;
}

.main-menu__list {
    display: flex;
    flex-direction: column;
    gap: 2rem;
}

.header__main-menu a {
    color: var(--text_dark);
}

.header__main-menu a:hover {
    color: var(--text-dark);
}

.header__mobile-menu {
    grid-area: mobile-menu;
    display: flex;
    align-items: center;
    justify-content: flex-end;
}

.mobile-menu__trigger {
    display: block;
    color: var(--dark);
    padding: 0.5rem 0.75rem;
    border-radius: 0.25rem;
    background-color: var(--background-color-light);
}

.mobile-menu__trigger-lines {
    display: block;
    border: 0;
    border-bottom: 2px solid currentColor;
    width: 1.5rem;
    margin: 0.25rem 0;
}

/* 768px and larger screen sizes */
@media (min-width:768px){
    .header__layout-grid {
        display: grid;
        grid-template-columns: fit-content(30%) 1fr auto;
        grid-template-rows: auto;
        grid-template-areas: 'logo main-menu mobile-menu';
        padding-top: 1rem;
        padding-bottom: 1rem;
        gap: 1rem;
    }

    .header__main-menu nav {
        display: flex;
        padding: unset;
        box-shadow: unset;
        background-color: unset;
    }

    .header__main-menu {
        display: flex;
    }

    .main-menu__list {
        flex-direction: row;
        gap: 24px;
    }

    .header__mobile-menu {
        display: none;
    }
}

/* * 1.4 Spacing
------------------------------------------------------------ */
.layout__x-padding {
    padding-right: var(--page-padding-max);
    padding-left: var(--page-padding-max);
}

.layout__constrained {
    max-width: var(--layout-max-width);
    margin-left: auto;
    margin-right: auto;
}

/* * 1.5 Globals
------------------------------------------------------------ */
html {
    /* font-size: 100%;
    scroll-padding-top: 10rem; */
    scroll-behavior: smooth;
}

[id] {
    scroll-margin-top: 0rem;
}

button,
[role="buton"] {
    cursor: pointer;
    border-radius: 120px;
    border: 1px solid #dddddd;
    padding: 16px 24px;
    width: 100%;
    max-width: 276px;
    background: var(--link_light);
    color: #ffffff;
    font-family: 'Noto Sans', sans-serif;
    font-size: 16px;
    font-weight: 500;
    transition: background-color .3s ease-in-out;
}

img {
    width: 100%;
    height: auto;
}

/* Prevents the picture element from taking up additional height */
picture > img {
    /* display: block; */
    width: 100%;
}

figure {
    margin: 1em 0;

    /* Extra wide images within figure tags don't overflow the content area. */
}

table {
    margin: 0 0 1.5em;
    width: 100%;
}

/* Unstyle all <a> links */
a {
    color: inherit;
    text-decoration: none !important;
}

/* * 2.3 Social Icons
------------------------------------------------------------ */
.part__socialicons ul {
    display: flex;
    flex-direction: row;
    align-items: center;
    padding: 0;
    gap: 0.5rem;
}

.part__socialicons li {
    list-style-type: none;
}

.part__socialicons a {
    padding: 0.5rem;
    display: flex;
    flex-direction: row;
}

.part__socialicons svg {
    height: auto;
    width: 1.5rem;
}

/* * 3.0 Layout & Structure
------------------------------------------------------------ */
.layout-grid__header-content-sidebar {
    display: grid;
    padding-top: 2rem;
    padding-bottom: 2rem;
    grid-template-columns: 1fr;
    grid-template-rows: auto auto auto;
    grid-template-areas: 'header' 'content' 'sidebar';
    gap: 1rem;
}

@media (min-width:768px) {
    .layout-grid__header-content-sidebar {
        display: grid;
        grid-template-columns: 1fr minmax(30%, 25rem);
        grid-template-rows: auto auto;
        grid-template-areas: 'header header' 'content sidebar';
        column-gap: 5rem;
        row-gap: 1rem;
    }
}

.header-content-sidebar__header {
    grid-area: header;
}

.header-content-sidebar__sidebar {
    grid-area: sidebar;
}

.layout-grid__content-sidebar {
    display: grid;
    padding-top: 2rem;
    padding-bottom: 2rem;
    grid-template-columns: 1fr;
    grid-template-rows: auto auto;
    grid-template-areas: 'content' 'sidebar';
    gap: 1rem;
}

@media (min-width:768px) {
    .layout-grid__content-sidebar {
        display: grid;
        grid-template-columns: 1fr minmax(30%, 25rem);
        grid-template-rows: auto;
        grid-template-areas: 'content sidebar';
        column-gap: 5rem;
        row-gap: 1rem;
    }
}

.content-sidebar__content {
    grid-area: content;
}

.content-sidebar__sidebar {
    grid-area: sidebar;
}

.layout__single-container {
    padding-top: 2rem;
    margin-bottom: 2rem;
}

/* * 6.0 Footer
------------------------------------------------------------ */
.site-footer {
    background-color: #000000;
    color: #ffffff;
    padding: 48px 20px;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: column;
    width: 100%;
}

.footer__grid {
    width: 100%;

    /* max-width: var(--layout-content-width); */
    display: grid;
    grid-template-columns: 1fr;
    grid-template-rows: auto auto auto auto;
    gap: 24px;
}

.footer-item-site-info {
    color: #ffffff;
    font-family: Rubik;
    font-size: 14px;
    font-weight: 400;
    line-height: 20px;
    letter-spacing: 1.2px;
    margin: 0;
    margin-top: clamp(0px, calc(4.56vw - 0px), 40px);
}

.footer-item-title {
    color: #ffffff !important;
}

@media (min-width:992px) {
    .footer__grid {
        display: grid;
        grid-template-columns: 1.3fr 1fr 1fr 1fr 1fr;
        grid-template-rows: auto auto auto;
        gap: 48px;
    }

    .footer-item-site-info {
        max-width: 246px;
    }
}

.footer__logo {
    display: flex;
    align-items: center;
    flex-direction: column;
    grid-area: logo;
}

.footer__contact {
    display: flex;
    align-items: center;
    flex-direction: column;
    grid-area: contact;
}

@media (min-width:768px) {
    .footer__contact {
        align-items: flex-end;
    }

    .footer__contact div {
        align-items: flex-start;
    }

    .footer__social {
        align-items: flex-end;
    }
}

.footer__contact div {
    display: flex;
    flex-direction: column;
    align-items: center;
}

.footer__social {
    display: flex;
    flex-direction: column;
    align-items: center;
    grid-area: social;
}

.footer__copyright {
    display: flex;
    flex-direction: row;
    justify-content: center;
    flex-wrap: nowrap;
    grid-area: copyright;
}

/* * 8.0 Core Templates
/* * 8.1 Index Template
------------------------------------------------------------ */
.index-page .title-section {
    padding-top: 16px;
    padding-bottom: 16px;
}

.index-page .grid {
    display: grid;
    grid-template-columns: 1fr;
    padding-bottom: 16px;
}

.index-page .grid .card {
    padding: 16px 0;
    border-bottom: 1px solid #dddddd;
}

@media (min-width:1024px) {
    .index-page .title-section {
        padding-top: 32px;
        padding-bottom: 32px;
    }

    .index-page .grid {
        display: grid;
        grid-template-columns: 1fr 1fr 1fr 1fr;
        row-gap: 32px;
        column-gap: 32px;
        padding: 32px 0;
    }

    .index-page .grid .card {
        padding-top: 0;
        border: none;
    }
}

.article-card__wrapper ul {
    padding: 0;
    display: flex;
    flex-direction: column;
    gap: 2rem;
}

.article-card__wrapper > ul > li {
    list-style-type: none;
}

.article-card {
    display: flex;
    flex-direction: row;
    align-items: center;
    gap: 1rem;
}

.article-card div {
    display: flex;
    flex: 1;
    flex-direction: column;
}

.article-card .post-header__categories {
    flex-direction: row;
}

.article-card__image-wrapper {
    max-width: 30%;
}

.article-card img {
    aspect-ratio: 4/3;
    object-fit: cover;
    object-position: 50% 50%;
}

.pagination a {
    font-family: "Avenir Next Cyr";
    color: var(--Mono-8-Shade, #888);
    font-size: 16px;
    font-style: normal;
    font-weight: 450;
    line-height: 24px;
    text-decoration: none;
    width: 40px;
    height: 40px;
    padding: 8px 16px;
    border-radius: 4px;
    border: 1.5px solid #bbbbbb;
}

.pagination .page-item.active a {
    background-color: #347E9E;
    color: white;
    border: none;
}

.pagination {
    color: var(--Colour-Link-Dark, #025585);
    font-weight: 700;
    font-family: 'Libre Caslon Text', serif;
}

.pagination nav {
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: flex-start;
    column-gap: 16px;
}

.pagination ul {
    flex-direction: row;
    gap: 8px;
}

.pagination ul .next {
    display: flex;
}

.pagination ul .prev {
    display: flex;
}

.pagination nav ul {
    display: flex;
    justify-content: normal;
    align-content: normal;
    align-items: flex-start;
}

.pagination ul li {
    display: flex;
    align-items: center;
}

.page-numbers {
    display: flex;
    align-items: center;
    border: none;
    background: none;
    padding: 10px;
    text-align: left;
    cursor: pointer;
    list-style-type: none;
    height: 40px;
    height: 40px;
    padding: 4px 20px;
    border-radius: 4px;
    border: 2px solid var(--Mono-B-Shade, #BBB);
    background: var(--Mono-White, #FFF);
}

/* Current */
.pagination ul .current {
    cursor: auto;
}

.current {
    border-radius: 4px;
    border: 2px solid var(--Colour-Link-Light, #347E9E);
    background: var(--Colour-Background, #EFF6FF);
}

/* Dots */
.pagination ul .dots {
    cursor: auto;
}

.dots {
    border-radius: 0px;
    border: none;
    background: none;
}

/* * 7.0 Sidebars
------------------------------------------------------------ */
.sidebar__innerwrapper {
    display: flex;
    flex-direction: column;
    gap: 2rem;
    align-items: flex-end;
}

.sidebar__content-wrapper {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 2rem;
}

.sidebar__category-wrapper {
    display: flex;
    flex-direction: column;
}

.sidebar__category-wrapper h2 {
    margin-top: 0;
}

.sidebar__tag-wrapper {
    display: flex;
    flex-direction: column;
}

.sidebar__tag-wrapper h2 {
    margin-top: 0;
}

/* ** END SETUP ** */
/* * 1.2 Theme (Anything specific to this theme) */
.b2b-card__wrapper ul {
    list-style-type: none;
}

.b2b-main-bloggrid {
    display: grid;
    grid-template-columns: 1fr 1fr 1fr;
    grid-template-rows: auto auto;
}

.b2b-home-articles {
    border-bottom: 1px solid #dddddd;
}

@media (min-width: 1024px){
    .b2b-home-articles {
        display: grid;
        grid-template-columns: minmax(296px, 2fr) minmax(296px, 1fr) minmax(296px, 1fr);
        grid-template-rows: auto 1fr;
        grid-template-areas: 'featured featured-2 latest-news' 'featured featured-3 latest-news';
        grid-area: featured;
        padding-bottom: 32px;
    }
}

/* Use media queries based on the total width of the columns */
@media screen and (max-width: calc(296px * 3 + 32px)) {
    /* 3 columns * 296px min width + 32px gap (16px * 2) */
    .b2b-home-articles {
        grid-template-columns: 1fr;

        /* Collapse to one column */
        grid-gap: 16px;

        /* Maintain consistent gap between elements */
    }

    /* Ensure all divs inside .b2b-home-articles stack properly */
    .b2b-home-articles {
        grid-column: 1 / -1;

        /* Make each grid item span the full width */
        display: block;
        width: 100%;

        /* Ensure each item takes full width on mobile */
        margin: 0;

        /* Reset margins */
    }

    /* Ensure images maintain aspect ratio and scale properly */
    .b2b-home-articles img {
        width: 100%;
        height: auto;

        /* Keep the aspect ratio of images */
        object-fit: cover;
    }

    /* Adjust any other layout elements as needed */
    .b2b-home-articles h2,
    .b2b-home-articles h3,
    .b2b-home-articles p {
        width: 100%;

        /* Make text blocks take full width */
    }
}

.b2b-home-article {
    width: 100%;
    object-fit: cover;
}

.b2b-home-articles-featured-1 {
    grid-area: featured;
    border-bottom: 1px solid #dddddd;
    padding-bottom: 16px;
}

@media (min-width: 1024px) {
    .b2b-home-articles-featured-1 {
        padding: 0 16px 0 0;
        border-right: 1px solid #dddddd;
        border-bottom: none;
    }
}

.b2b-home-articles-featured-2 {
    grid-area: featured-2;
}

.b2b-home-articles-featured-3 {
    grid-area: featured-3;
    border-bottom: 1px solid #dddddd;

    /* padding: 16px 0; */
}

.b2b-home-articles-featured-3 > div {
    padding-bottom: 16px;
    padding-top: 16px;
    /* border-bottom: 1px solid #dddddd; */
}

.b2b-home-articles-featured-3 > div:nth-child(2) {
    border: none;
    padding: 4px 0 16px 0;
}

.b2b-articles-side-card .title-div {
    height: 100%;
    display: block;
    overflow: hidden;
}

.b2b-articles-side-card .title {
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    overflow: hidden;
    text-overflow: ellipsis;
    max-height: 4.5em;
    word-break: break-word;
}

@media (min-width: 1024px) {
    .b2b-home-articles-featured-3 {
        padding: 0 16px;
        border-right: 1px solid #dddddd;
        border-bottom: none;
    }

    .b2b-home-articles-featured-3 > div {
        padding-top: 0;
    }

    .b2b-home-articles-featured-3 > div:nth-child(2) {
        padding: 4px 0 0 0;
    }

    .b2b-latest-news .title-div {
        padding-left: 16px;
    }

    .b2b-articles-side-card {
        padding-left: 16px;
    }
}

.b2b-home-articles-featured-3 > div:nth-child(2) img {
    display: none;
}

.b2b-home-articles a {
    text-decoration: none;
}

.b2b-home-articles a :hover {
    text-decoration: underline;
}

b2b-home-article-heading-small {
    margin-top: 0;
    margin-bottom: 0;
    text-decoration: none;
}

/* .b2b-articles-side-card:last-child {
    border: 0px !important;
} */
/* ===================================
Category Snippet 3 Col w/Ad Section
=================================== */
.category-snippet-2col-with-Ad-card:first-child {
    padding-top: 0 !important;
}

.category-snippet-2col-with-Ad-card:last-child {
    border: 0 !important;
}

/* to reduce fontsize on card title */
.category-snippet-2col-with-Ad-card:nth-child(2) h2 {
    font-size: 18px;
    line-height: 24px;
}

.category-snippet-2col-with-Ad-card:last-child h2 {
    font-size: 18px;
    line-height: 24px;
}

/* to hide the image on the card */
.category-snippet-2col-with-Ad-card:nth-child(2) .card-img-div {
    display: none;
}

.category-snippet-2col-with-Ad-card:last-child .card-img-div {
    display: none;
}

/* to hide the category  on the card */
.category-snippet-2col-with-Ad-card:nth-child(2) .card-category-div {
    display: none;
}

.category-snippet-2col-with-Ad-card:last-child .card-category-div {
    display: none;
}

/* to hide the excerpt on the card */
.category-snippet-2col-with-Ad-card:nth-child(2) p {
    display: none;
}

.category-snippet-2col-with-Ad-card:last-child p {
    display: none;
}

/* Grid Styles */
/* 3 Column and 1 Ad Section */
.col-4-grid-post-and-ad-section {
    padding: 16px 0;
    border-bottom: 1px solid #dddddd;
}

.col-4-grid-post-and-ad-section .col-1 > div {
    padding-bottom: 24px;
    border-bottom-width: 1px;
    border-bottom-color: #dddddd;
}

@media (min-width: 1024px){
    .col-4-grid-post-and-ad-section .col-2 {
        width: 100%;
        padding-left: 16px;
    }

    .col-4-grid-post-and-ad-section {
        padding: 32px 0;
        display: grid;
        grid-template-columns: 3fr 1fr;
    }

    .col-4-grid-post-and-ad-section .col-1 {
        display: grid;
        grid-template-columns: 1fr 1fr 1fr;
    }

    .col-4-grid-post-and-ad-section .col-1 > div {
        padding: 0 16px;
        border-right: 1px solid #dddddd;
    }
}

/* 4 Column Grid Section */
.col-4-grid-section {
    padding-top: 16px;
    padding-bottom: 16px;
    border-bottom: 1px solid #dddddd;
}

@media (min-width: 1024px) {
    .col-4-grid-section {
        display: grid;
        grid-template-columns: 1fr 1fr 1fr 1fr;
        padding-top: 32px;
        padding-bottom: 32px;
        flex-direction: row;
    }
}

.category-template-container .col-4-grid-section > col-1 {
    padding-top: 16px;
    padding-bottom: 16px;
    border-bottom: 1px solid #dddddd;
}

@media (min-width: 1024px) {
    .category-template-container .col-4-grid-section > div {
        border-right: 1px solid #dddddd;
        padding: 0px 16px;
    }
}

/* ============ Utility Classes ============= */
.remove-padding-top:first-child {
    padding-top: 0 !important;
}

.remove-padding-left:first-child {
    padding-left: 0 !important;
}

.category-template-container .col-4-grid-section > .col {
    padding-top: 16px !important;
    padding-bottom: 16px;
}

.remove-padding-bottom:last-child {
    padding-bottom: 0 !important;
}

.remove-border-bottom:last-child {
    border: 0 !important;
}

.remove-border-right:last-child {
    border: 0 !important;
}

/* ============ ENDOF Utility Classes ============= */
/* ============ Single Post Styles ============= */
.single_post {
    display: grid;
    grid-template-columns: 3fr 1fr;
    grid-template-rows: auto;
    grid-template-areas: 'main sidebar';
    column-gap: 5rem;
}

.post-body {
    padding-left: var(--page-padding-max);
    padding-right: var(--page-padding-max);
}

.post-data {
    grid-area: main;
}

.layout__single-container .single-post-section .author-div {
    display: flex;
    align-items: center;
}

.related-posts {
    margin-top: 20px;
    grid-area: sidebar;
}

.single-post-section h2 {
    margin-top: 24px;
}

.article-content ul {
    list-style: disc !important;
    margin-left: 1.5em;
    margin-bottom: 1em;
}

.article-content ol {
    list-style: decimal !important;
    margin-left: 1.5em;
    margin-bottom: 1em;
}

.article-content li {
    margin-bottom: 0.5em;
}

/* media queries */
@media (max-width: 992px){
    .single_post {
        display: block;
    }

    .single-post-section {
        margin-bottom: 32px;
    }

    .layout__single-container .single-post-section .author-div {
        flex-direction: column;
        align-items: flex-start;
        row-gap: 16px;
    }
}

/* ============ ENDOF Single Post Styles ============= */
.rubik-tag {
    display: block;
    margin-bottom: 8px;
}

.list-numbers {
    list-style: none;
    padding: 0;
    margin: 0;
}

.list-item {
    display: flex;
    align-items: flex-start;

    /* Align number and title in one line */
    padding: 15px 0;

    /* Adds padding for spacing */
    border-bottom: 1px solid #DDD;

    /* Bottom border for divider */
}

.list-item:last-child {
    /* Remove border from the last item */
    border-bottom: none;
}

.list-number {
    color: #347E9E;
    font-family: "Libre Caslon Text";
    font-size: 18px;
    font-weight: 700;
    margin-right: 15px;

    /* Space between number and title */
    flex-shrink: 0;

    /* Prevent the number from shrinking */
}

.libre-heading-title-small-dark a {
    color: inherit;
    text-decoration: none;
}

.libre-heading-title-small-dark:hover {
    text-decoration: underline !important;
}

.article-content {
    color: var(--text_mid);
    font-family: "Noto Sans";
    font-size: 16px;
    font-weight: 500;
    line-height: 24px;
}

.article-content p {
    margin-top: 15px;
    margin-bottom: 15px;
}

.article-content h1,
h2,
h3,
h4,
h5,
h6 {
    color: var(--text-dark);

    /* margin-top: 15px */
}

.article-content a {
    color: var(--link_light);
    font-weight: 600;
    text-decoration-line: none;
}