.blog-list,
.blog-article {
    max-width: 72rem;
    margin: 0 auto;
    padding: 2rem 1rem;
}

.blog-list-header,
.blog-article-header {
    max-width: 48rem;
    margin: 0 auto 2rem;
}

.blog-article-header h1,
.blog-list-header h1 {
    margin: 0 0 1rem;
    line-height: 1.12;
}

.blog-article-date,
.blog-article-date,.blog-card-date{font-style:italic}
.blog-card-date {
    color: #5f6368;
    font-size: .9rem;
}

.blog-article-description,
.blog-list-header p {
    font-size: 1.15rem;
    line-height: 1.55;
}

.blog-article-featured-image {
    max-width: 75rem;
    margin: 0 auto 2rem;
}

.blog-article-featured-image img,
.blog-card img {
    display: block;
    width: 100%;
    height: auto;
}

.blog-article-content {
    max-width: 48rem;
    margin: 0 auto;
    font-size: 1.08rem;
    line-height: 1.7;
}

.blog-article-content h2,
.blog-article-content h3,
.blog-article-content h4 {
    margin: 2.25rem 0 .75rem;
    line-height: 1.25;
}

.blog-article-faq {
    max-width: 48rem;
    margin: 2.5rem auto 0;
}

.blog-article-faq dt {
    margin-top: 1.25rem;
    font-weight: 700;
}

.blog-article-faq dd {
    margin: .4rem 0 0;
    line-height: 1.6;
}

.blog-article-content p,
.blog-article-content ul,
.blog-article-content ol,
.blog-article-content blockquote,
.blog-article-content pre {
    margin: 0 0 1.25rem;
}

.blog-article-content blockquote {
    padding: .75rem 1rem;
    border-inline-start: .25rem solid currentColor;
}

.blog-article-content img {
    max-width: 100%;
    height: auto;
}

.blog-table-scroll {
    margin: 1.5rem 0;
    overflow-x: auto;
}

.blog-table-scroll table {
    width: 100%;
    border-collapse: collapse;
}

.blog-table-scroll th,
.blog-table-scroll td {
    padding: .65rem .75rem;
    border: 1px solid #c8d0d8;
    text-align: left;
    vertical-align: top;
}

.blog-table-scroll th {
    background: #f1f4f6;
}

.blog-list-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(min(100%, 18rem), 1fr));
    gap: 1.25rem;
}

.blog-card {
    display: flex;
    flex-direction: column;
    overflow: hidden;
    border: 1px solid #d9dde3;
    border-radius: .5rem;
    background: #fff;
}

.blog-card-body {
    display: flex;
    flex: 1;
    flex-direction: column;
    padding: 1rem;
}

.blog-card h2 {
    margin: 0 0 .75rem;
    font-size: 1.25rem;
    line-height: 1.25;
}

.blog-card p {
    margin: 0 0 1rem;
    line-height: 1.5;
}

.blog-card-link {
    margin-top: auto;
    font-weight: 700;
}

.blog-article a,
.blog-list a {
    color: #0645ad;
    text-underline-offset: .15em;
}

.blog-article a:focus-visible,
.blog-list a:focus-visible {
    outline: .2rem solid #111;
    outline-offset: .2rem;
}

.blog-article-toc {
    max-width: 48rem;
    margin: 0 auto 2rem;
    padding: 1rem 1.25rem;
    border-inline-start: .3rem solid currentColor;
    background: #f4f6f8;
}

.blog-article-toc strong {
    display: block;
    margin-bottom: .5rem;
}

.blog-article-toc ol {
    margin: 0;
    padding-inline-start: 1.25rem;
}

.blog-article-toc .level-3 {
    margin-inline-start: 1rem;
}

.blog-article-content h2,
.blog-article-content h3 {
    scroll-margin-top: 5rem;
}

.blog-article-content strong {
    font-weight: 750;
}

@media (max-width: 40rem) {
    .blog-list,
    .blog-article {
        padding: 1.25rem .75rem;
    }

    .blog-article-content {
        font-size: 1rem;
    }
}

@media (prefers-reduced-motion: reduce) {
    *,
    *::before,
    *::after {
        scroll-behavior: auto !important;
        transition-duration: .01ms !important;
        animation-duration: .01ms !important;
        animation-iteration-count: 1 !important;
    }
}

.blog-article-toc {
    color: #20252a;
}
.blog-article-toc li {
    border: 0;
    padding: 0;
}
.blog-article-toc li a:link,
.blog-article-toc li a:visited {
    color: #0645ad;
}
.blog-article-toc li a:hover,
.blog-article-toc li a:active {
    color: #052c6d;
    background: transparent;
}
.blog-article-content h2 {
    color: #286f55;
}
.blog-card {
    display: flex;
    flex-direction: column;
    border: 1px solid #d9dde3;
    border-radius: .5rem;
    overflow: hidden;
    background: #fff;
}
.blog-card-image-link {
    display: block;
    height: 200px;
    overflow: hidden;
    background: #f0ede8;
}
.blog-card-image-link img,
.blog-card img {
    display: block;
    width: 100% !important;
    height: 100% !important;
    object-fit: cover !important;
    object-position: center !important;
}
.blog-card-body {
    display: flex;
    flex-direction: column;
    flex: 1;
    padding: 1rem;
}
.blog-card h2,
.blog-card h3 {
    min-height: 3.8rem;
    font-size: 1.15rem;
    line-height: 1.35;
    margin: 0 0 .75rem;
    font-weight: 700;
    border-bottom: none;
}
.blog-card h2 a,
.blog-card h3 a {
    color: #0645ad;
}
.home-infos-section {
    margin: 3.5rem 0;
    text-align: center;
}
.home-infos-heading {
    font-family: 'Montserrat', sans-serif;
    font-size: 1.7em;
    font-weight: 800;
    color: #8dbba9;
    margin-top: 2rem;
    margin-bottom: 1.5rem;
    text-align: center;
    border-bottom: 1px dotted gray;
    padding-bottom: .5rem;
}
.home-infos-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(min(100%, 18rem), 1fr));
    gap: 1.25rem;
    max-width: 100%;
    margin: 0 auto;
    text-align: left;
}
@media (min-width: 60rem) {
    .home-infos-grid {
        grid-template-columns: repeat(3, 1fr);
    }
}
.btn-infos-more {
    display: inline-block;
    padding: .75rem 2.25rem;
    font-size: 1.1rem;
    font-weight: 700;
    color: #fff !important;
    background-color: #924719;
    border: 2px solid #924719;
    border-radius: .35rem;
    text-decoration: none !important;
    transition: background-color .15s ease, border-color .15s ease, color .15s ease;
}
.btn-infos-more:hover,
.btn-infos-more:focus {
    background-color: #783611;
    border-color: #783611;
    color: #fff !important;
}
.blog-card-summary {
    height: 4.8rem;
    overflow: hidden;
    margin: 0;
    font-size: .95rem;
    line-height: 1.5;
    color: #444;
}
.blog-card-more {
    color: #0645ad;
    font-weight: 700;
    white-space: nowrap;
    text-decoration: underline;
}
.blog-card-more:hover,
.blog-card-more:active {
    color: #052c6d;
}
@media (max-width: 40rem) {
    .blog-list-header h1,
    .blog-article-header h1 {
        font-size: 1.75rem;
        line-height: 1.2;
    }
    .blog-card h2,
    .blog-card h3 {
        min-height: auto;
    }
}
