
/* breadcrumb */
.breadcrumb {padding-block: 15px; background: #F8F8FA;}
.breadcrumb ul {margin: 0; padding: 0;}
.breadcrumb li {list-style-type: none; display: inline;}
.breadcrumb li:not(:first-child):before {content: "/";}
.breadcrumb li :where(a, span) {text-decoration: none; line-height: 1.2; color: #343a40;}
.breadcrumb li a:hover {color: var(--clr-red-dk); transition: var(--transition);}

/* page_content */
.page_content {padding: 15px 0 20px; --clr-text: #343a40; --clr-link: #007bff; --clr-link-dk: #0056b3; --clr-post-title: #343a40; --clr-border: #f0f1f4;}
.page_content .columns {display: grid; grid-template-columns: 63.7% 1fr; gap: 30px; transition: var(--transition);}
.page_content .content :where(h1, h2):first-child {color: var(--clr-red-dk); font-size: var(--fs-24); font-weight: var(--fw-700); margin-bottom: 8px;}
.page_content .content p {color: var(--clr-text); margin-bottom: 14px; font-size: var(--fs-15);}
.page_content .content h2 {color: var(--clr-text); font-size: var(--fs-28); font-weight: var(--fw-500);}
.page_content .posts .title {background-color: var(--clr-post-title); border-bottom: 3px solid var(--clr-red-dk); padding: 10px; margin-bottom: 8px;}
.page_content .posts .title > * {color: #fff; font-size: var(--fs-16); font-weight: var(--fw-700);}
.page_content .posts ul li {padding: 10px; border-bottom: 1px solid var(--clr-border);}
.page_content .posts li a {color: var(--clr-link); line-height: 1.5; transition: var(--transition);}
/* .sidebar {position: sticky; top: 82px; height: fit-content;} */
.page_content .posts li a:hover {color: var(--clr-link-dk);}

/* Media Query*/

@media only screen and (width <= 1200px) {
.about .columns {grid-template-columns: 60% 1fr;}
}
@media only screen and (width <= 991px) {
.page_content .columns {grid-template-columns: 1fr; gap: 20px;}
.page_content .quote-form {max-width: 560px; margin-inline: auto;}
}

