/* ==========================================================================
   OMG Blog — styles specific to post / archive pages
   Mirrors the main site's typography and inner-page banner pattern.
   ========================================================================== */

/* Inner-page hero banner ---------------------------------------------------- */
.omg-blog-hero {
    width: 100%;
    min-height: 360px;
    padding: 150px 70px 70px;
    background-size: cover;
    background-position: center;
    display: flex;
    align-items: flex-end;
    color: #fff;
    position: relative;
    margin-bottom: 0;
}
.omg-blog-hero-inner { max-width: 1480px; width: 100%; margin: 0 auto; }
.omg-blog-hero-title {
    color: #fff;
    font-family: Proxima_Nova_B, 'Proxima Nova', sans-serif;
    font-style: italic;
    font-size: clamp(28px, 4.5vw, 56px);
    line-height: 1.15;
    margin: 0 0 10px;
    text-shadow: 0 2px 12px rgba(0,0,0,.35);
}
.omg-blog-hero-subtitle {
    color: rgba(255,255,255,.88);
    font-family: Matter_M, 'Matter', system-ui, sans-serif;
    font-size: clamp(16px, 1.6vw, 20px);
    margin: 0;
}
@media (max-width: 991px) {
    .omg-blog-hero { padding: 120px 24px 40px; min-height: 280px; }
}
@media (max-width: 600px) {
    .omg-blog-hero { padding: 110px 18px 30px; min-height: 220px; }
}

/* Main wrapper & container -------------------------------------------------- */
.omg-blog-main {
    background: #fff;
    padding-bottom: 30px;
}
/* 3-column grid on archives; narrow reading width for single posts */
.omg-blog-main .site,
.omg-blog-main .ast-container,
.omg-blog-main #primary {
    max-width: 1280px;
    margin: 0 auto;
    padding: 40px 24px 0;
}
body.single-post .omg-blog-main #primary { max-width: 820px; }
@media (max-width: 600px) {
    .omg-blog-main .site,
    .omg-blog-main .ast-container,
    .omg-blog-main #primary { padding: 24px 16px 0; }
}

/* Hide Astra's default entry header on single posts (we use the hero) ------- */
.single-post .entry-header,
.single-post .ast-single-post-banner,
.single-post .post-thumb-img-content { display: none !important; }

/* Typography inside post content ------------------------------------------- */
.entry-content,
.omg-blog-main .entry-content {
    font-family: Matter_R, 'Matter', system-ui, -apple-system, sans-serif;
    color: #222;
    font-size: 1.3rem;
    line-height: 1.75;
    padding-top: 40px;
}
.omg-blog-main .entry-content p,
.omg-blog-main .entry-content li,
.omg-blog-main .entry-content blockquote {
    font-size: 1.6rem;
    line-height: 1.75;
}
.omg-blog-main .entry-content p { margin: 0 0 1.25em; }
.omg-blog-main .entry-content strong { font-weight: 600; color: #111; }
.omg-blog-main .entry-content em { color: #333; }
@media (max-width: 991px) {
    .omg-blog-main .entry-content,
    .omg-blog-main .entry-content p,
    .omg-blog-main .entry-content li,
    .omg-blog-main .entry-content blockquote { font-size: 1.18rem; }
}
@media (max-width: 600px) {
    .omg-blog-main .entry-content,
    .omg-blog-main .entry-content p,
    .omg-blog-main .entry-content li,
    .omg-blog-main .entry-content blockquote { font-size: 1.08rem; line-height: 1.7; }
}

.entry-content h2 {
    font-family: Proxima_Nova_B, 'Proxima Nova', sans-serif;
    font-size: clamp(28px, 3vw, 38px);
    color: #111;
    margin: 1.8em 0 .6em;
    line-height: 1.25;
    letter-spacing: .2px;
}
.entry-content h3 {
    font-family: Proxima_Nova_B, 'Proxima Nova', sans-serif;
    font-size: clamp(22px, 2.2vw, 28px);
    color: #1a1a1a;
    margin: 1.5em 0 .5em;
    line-height: 1.3;
}
.entry-content h2 + p,
.entry-content h3 + p { margin-top: 0; }

/* Links --------------------------------------------------------------------- */
.entry-content a {
    color: #8a6a3a;
    text-decoration: underline;
    text-underline-offset: 3px;
    text-decoration-thickness: 1px;
    transition: color .15s ease;
}
.entry-content a:hover,
.entry-content a:focus {
    color: #111;
    text-decoration-thickness: 2px;
}

/* Lists --------------------------------------------------------------------- */
.entry-content ul,
.entry-content ol {
    margin: 0 0 1.4em;
    padding-left: 1.4em;
}
.entry-content li {
    margin-bottom: .6em;
}
.entry-content ul > li::marker { color: #8a6a3a; }
.entry-content ol > li::marker { color: #8a6a3a; font-weight: 600; }

/* Blockquotes --------------------------------------------------------------- */
.entry-content blockquote {
    border-left: 3px solid #8a6a3a;
    margin: 1.5em 0;
    padding: .2em 1.2em;
    font-style: italic;
    color: #444;
    background: #fafaf7;
}

/* Images -------------------------------------------------------------------- */
.entry-content img {
    max-width: 100%;
    height: auto;
    border-radius: 6px;
    margin: 1em 0;
    display: block;
}

/* Meta row under hero (date, author) --------------------------------------- */
.omg-blog-main .entry-meta,
.omg-blog-main .posted-on,
.omg-blog-main .posted-by {
    font-family: Matter_R, 'Matter', system-ui, sans-serif;
    font-size: .92rem;
    color: #777;
    letter-spacing: .3px;
}
.omg-blog-main .entry-meta a { color: #555; text-decoration: none; }
.omg-blog-main .entry-meta a:hover { color: #8a6a3a; }

/* Post navigation (prev / next) -------------------------------------------- */
.post-navigation { margin: 3em 0 1em; }
.post-navigation a {
    font-family: Matter_M, 'Matter', system-ui, sans-serif;
    color: #111;
    text-decoration: none;
}

/* Hide elements that look out of place on blog pages ----------------------- */
.omg-blog-main .ast-author-details,
.omg-blog-main .ast-single-related-posts-container { display: none; }

/* Comments block — tone down Astra's default ------------------------------- */
.omg-blog-main #comments { margin-top: 2.5em; font-family: Matter_R, 'Matter', sans-serif; }
.omg-blog-main .comment-reply-title { font-family: Proxima_Nova_B, sans-serif; }
.omg-blog-main .submit {
    background: #111 !important;
    color: #fff !important;
    border: 0 !important;
    padding: .8em 1.6em !important;
    border-radius: 40px !important;
    font-family: Matter_B, sans-serif !important;
    letter-spacing: .5px;
}

/* Footer contact-us block — tighten spacing against post content ----------- */
.omg-blog-main + .contact-us,
body.single .contact-us { margin-top: 1.5em; }

/* Archive / blog index cards ----------------------------------------------- */
/* Grid: 3 per row on desktop, 2 on tablet, 1 on mobile */
.omg-blog-main .ast-blog-layout-4-grid .ast-row {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 32px 28px;
    margin: 0;
}
.omg-blog-main .ast-blog-layout-4-grid .ast-article-post {
    width: 100% !important;
    max-width: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
}
@media (max-width: 991px) {
    .omg-blog-main .ast-blog-layout-4-grid .ast-row { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 640px) {
    .omg-blog-main .ast-blog-layout-4-grid .ast-row { grid-template-columns: 1fr; }
}

.omg-blog-main .ast-article-post {
    border-bottom: none;
    background: #fff;
    border-radius: 8px;
    overflow: hidden;
    box-shadow: 0 2px 14px rgba(0,0,0,.05);
    display: flex;
    flex-direction: column;
    transition: transform .18s ease, box-shadow .18s ease;
}
.omg-blog-main .ast-article-post:hover {
    transform: translateY(-3px);
    box-shadow: 0 12px 36px rgba(0,0,0,.09);
}
.omg-blog-main .ast-article-post .blog-layout-4,
.omg-blog-main .ast-article-post .ast-article-inner {
    display: flex;
    flex-direction: column;
    height: 100%;
}
.omg-blog-main .ast-article-post .ast-blog-featured-section,
.omg-blog-main .ast-article-post .post-thumb-img-content,
.omg-blog-main .ast-article-post .post-thumb-img-content a {
    display: block;
    width: 100%;
}
.omg-blog-main .ast-article-post .post-thumb-img-content img {
    width: 100%;
    height: 220px;
    object-fit: cover;
    display: block;
    border-radius: 0;
}
.omg-blog-main .ast-article-post .post-content {
    padding: 20px 24px 26px;
    display: flex;
    flex-direction: column;
    flex: 1 1 auto;
}
@media (max-width: 991px) {
    .omg-blog-main .ast-article-post .post-thumb-img-content img { height: 200px; }
}
@media (max-width: 640px) {
    .omg-blog-main .ast-article-post .post-thumb-img-content img { height: 220px; }
    .omg-blog-main .ast-article-post .post-content { padding: 18px 20px 22px; }
}
.omg-blog-main .ast-article-post .cat-links a {
    font-family: Matter_M, 'Matter', system-ui, sans-serif;
    font-size: .78rem;
    color: #8a6a3a;
    text-transform: uppercase;
    letter-spacing: 1.2px;
    text-decoration: none;
    font-weight: 600;
}
.omg-blog-main .ast-article-post .entry-title,
.omg-blog-main .ast-article-post h2.entry-title,
.omg-blog-main .ast-article-post .wp-block-post-title {
    font-family: Proxima_Nova_B, 'Proxima Nova', sans-serif;
    font-size: clamp(19px, 1.55vw, 22px);
    line-height: 1.3;
    margin: .35em 0 .5em;
}
.omg-blog-main .ast-article-post .entry-title a,
.omg-blog-main .ast-article-post .wp-block-post-title a {
    font-family: inherit;
    font-size: inherit;
    color: #111;
    text-decoration: none;
}
.omg-blog-main .ast-article-post .entry-title a:hover,
.omg-blog-main .ast-article-post .wp-block-post-title a:hover { color: #8a6a3a; }
/* Card excerpt */
.omg-blog-main .ast-article-post .ast-excerpt-container {
    flex: 1 1 auto;
}
.omg-blog-main .ast-article-post .ast-excerpt-container p {
    font-family: Matter_R, 'Matter', system-ui, sans-serif;
    font-size: 1.6rem;
    line-height: 1.6;
    color: #333;
    margin: 0 0 .9em;
    display: -webkit-box;
    -webkit-line-clamp: 4;
    -webkit-box-orient: vertical;
    overflow: hidden;
}
@media (max-width: 991px) {
    .omg-blog-main .ast-article-post .ast-excerpt-container p { font-size: 1.05rem; }
}
/* Card meta row */
.omg-blog-main .ast-article-post .entry-meta {
    font-size: .82rem;
    color: #888;
    margin-bottom: .6em;
}
/* Read More link */
.omg-blog-main .ast-article-post .omg-read-more {
    display: inline-block;
    margin-top: .4em;
    font-family: Matter_B, 'Matter', system-ui, sans-serif;
    font-size: .95rem;
    color: #111;
    text-decoration: none;
    border-bottom: 2px solid #8a6a3a;
    padding-bottom: 2px;
    letter-spacing: .3px;
    transition: color .15s ease, border-color .15s ease, transform .15s ease;
}
.omg-blog-main .ast-article-post .omg-read-more:hover {
    color: #8a6a3a;
    transform: translateX(2px);
}
.omg-blog-main .ast-article-post .omg-read-more .omg-arrow {
    display: inline-block;
    margin-left: 6px;
    transition: transform .18s ease;
}
.omg-blog-main .ast-article-post .omg-read-more:hover .omg-arrow { transform: translateX(3px); }
/* Grid spacing */
.omg-blog-main .ast-row { gap: 28px 24px; }
@media (max-width: 991px) {
    .omg-blog-main .ast-article-post .post-thumb-img-content img { height: 200px; }
}
@media (max-width: 600px) {
    .omg-blog-main .ast-article-post .post-thumb-img-content img { height: 180px; }
    .omg-blog-main .ast-article-post .post-content { padding: 16px 18px 20px; }
}

/* Make sure the carousel/nav transparent state doesn't leak into blog pages */
body.single-post .navbar,
body.blog .navbar,
body.archive .navbar,
body.search .navbar,
body.error404 .navbar,
body.page .navbar { background-color: #2C2C2C !important; }