/* =============================================================================
 * News / Blog styles (scoped: home "News & Updates" block, /news/ listing,
 * single post). Loaded only on those views by conexi_child_news_assets().
 *
 * The home news area is the theme's own widgets, so we only refine them; the
 * single-post rules tidy the in-post images the parent theme never styled for
 * wide content. Brand yellow: #FFC000, ink: #111111 (matches the theme).
 * ========================================================================== */

/* ---------- Home page: theme "News & Updates" block ------------------------ */
/* This area is the theme's own widgets across two Elementor top-sections:
 *   .blog-style-one.one   → conexi_h1_blog_title  (the "News & Updates" heading)
 *   .blog-style-one.two   → conexi_blog_left      (1 featured post — LEFT column)
 *   .blog-style-one.three → conexi_blog_right     (recent-posts list — RIGHT col)
 * The featured + list widgets live in a 50/50 Elementor row, but each wraps its
 * output in a full-width Bootstrap `.container` (max-width ~1140px, centred),
 * which overflows the 50% column and overlaps its neighbour. Two things fix it:
 *   1. make each widget's `.container` fill its OWN column, and
 *   2. collapse the theme's 105/120px per-section padding into one cohesive band.
 * Scoped to the home page (body.home). */
.home .blog-style-one > .container {
    max-width: 100%;
    padding-left: 15px;
    padding-right: 15px;
}
.home .blog-style-one.one {
    padding: 96px 0 0;
}
.home .blog-style-one.two,
.home .blog-style-one.three {
    padding: 34px 0 60px;
}
.home .blog-style-one .block-title {
    margin-bottom: 6px;
}
/* Top-align the featured card and the list column. */
.home .elementor-widget-conexi_blog_left,
.home .elementor-widget-conexi_blog_right {
    align-self: flex-start;
}

/* Featured post (conexi_blog_left) — controlled image height, rounded corners,
   subtle lift on hover; the theme card is kept intact, just refined. */
.home .blog-style-one.two .single-blog-style-one {
    background-color: #ffffff;
    border-radius: 12px;
    overflow: hidden;
    box-shadow: 0 14px 44px rgba(17, 17, 17, .09);
    transition: transform .4s ease, box-shadow .4s ease;
}
.home .blog-style-one.two .single-blog-style-one:hover {
    transform: translateY(-5px);
    box-shadow: 0 22px 54px rgba(17, 17, 17, .15);
}
.home .blog-style-one.two .image-block,
.home .blog-style-one.two .inner-block {
    overflow: hidden;
}
.home .blog-style-one.two .inner-block {
    max-height: 340px;
}
.home .blog-style-one.two .inner-block > img {
    width: 100%;
    height: 340px;
    object-fit: cover;
    transition: transform .6s ease;
}
.home .blog-style-one.two .single-blog-style-one:hover .inner-block > img {
    transform: scale(1.04);
}
.home .blog-style-one.two .text-block {
    padding: 26px 30px 30px;
}

/* Recent-posts list (conexi_blog_right) — a vertical list of horizontal cards in
   the right column. Its first card repeats the featured post (both widgets order
   newest-first and the list doesn't exclude it), so hide that duplicate. */
.home .blog-style-one.three .blog-style-two-row > [class*="col-"]:first-child {
    display: none;
}
.home .blog-style-one.three .single-blog-style-two {
    box-shadow: 0 10px 30px rgba(17, 17, 17, .06);
    transition: transform .4s ease, box-shadow .4s ease;
}
.home .blog-style-one.three .single-blog-style-two:hover {
    transform: translateY(-4px);
    box-shadow: 0 16px 40px rgba(17, 17, 17, .12);
}

/* Stack the news band on tablet / mobile, where Elementor collapses the 50/50
   columns to full width. */
@media (max-width: 991px) {
    .home .blog-style-one.one {
        padding-top: 64px;
    }
    .home .blog-style-one.two,
    .home .blog-style-one.three {
        padding: 22px 0 40px;
    }
    .home .blog-style-one.two .inner-block,
    .home .blog-style-one.two .inner-block > img {
        max-height: 300px;
        height: 300px;
    }
}

/* ---------- Single post: in-content images & readability ------------------- */
/* The parent theme never styles wide images inside .single-blog-style-one, so
   large photos overflow. Constrain them and give the article comfortable rhythm. */
.single-blog-details-page .single-blog-style-one .text img {
    max-width: 100%;
    height: auto;
    border-radius: 10px;
}

.goys-news-figure {
    margin: 34px 0;
    text-align: center;
}

.goys-news-figure .goys-news-figimg {
    max-width: 100%;
    height: auto;
    border-radius: 12px;
    box-shadow: 0 14px 40px rgba(17, 17, 17, .12);
}

.goys-news-figure figcaption {
    margin-top: 12px;
    font-size: 13.5px;
    color: #8a8a8a;
    font-style: italic;
}

.single-blog-details-page .single-blog-style-one .text h2 {
    font-size: 26px;
    letter-spacing: -.02em;
    margin: 38px 0 16px;
    color: #111111;
}

.single-blog-details-page .single-blog-style-one .text p,
.single-blog-details-page .single-blog-style-one .text li {
    line-height: 1.8;
    color: #4d4d4d;
}

.single-blog-details-page .single-blog-style-one .text ul {
    margin: 0 0 22px;
    padding-left: 22px;
    list-style: disc;
}

.single-blog-details-page .single-blog-style-one .text ul li {
    margin-bottom: 12px;
}

.goys-news-lead {
    font-size: 19px;
    line-height: 1.75;
    color: #2b2b2b !important;
    font-weight: 500;
}

.goys-news-figure a,
.single-blog-details-page .text a {
    color: #b8860b;
    text-decoration: underline;
    text-underline-offset: 2px;
}

.single-blog-details-page .text a:hover {
    color: #FFC000;
}

.goys-news-signoff {
    margin-top: 26px;
    padding-top: 20px;
    border-top: 1px solid #ececec;
    font-size: 17px;
}

/* ---------- Responsive (single post) --------------------------------------- */
@media (max-width: 767px) {
    .single-blog-details-page .single-blog-style-one .text h2 {
        font-size: 22px;
    }
}
