/* MKM BlogHash v1.5 — curated featured Hero refinement. */
.mkm-curated-hero .mkm-curated-hero-card {
    position: relative;
    display: block;
    min-height: clamp(500px, 38vw, 610px);
    overflow: hidden;
    border-radius: var(--bloghash-radius);
    background: var(--bloghash-secondary);
}

.mkm-curated-hero .mkm-curated-hero-card .post-thumb {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    margin: 0;
    max-width: none;
    flex: none;
}

/* Darkest behind the text on the left; image opens toward the right. */
.mkm-curated-hero .mkm-curated-hero-card .post-thumb::after {
    content: "";
    position: absolute;
    inset: 0;
    z-index: 1;
    pointer-events: none;
    background: linear-gradient(90deg,
        rgba(17, 21, 48, .94) 0%,
        rgba(17, 21, 48, .84) 28%,
        rgba(17, 21, 48, .56) 48%,
        rgba(17, 21, 48, .18) 72%,
        rgba(17, 21, 48, .04) 100%);
}

.mkm-curated-hero .mkm-curated-hero-card .entry-image-link,
.mkm-curated-hero .mkm-curated-hero-card .entry-image-link img {
    display: block;
    width: 100%;
    height: 100%;
}

.mkm-curated-hero .mkm-curated-hero-card .entry-image-link img {
    object-fit: cover;
    object-position: center;
}

.mkm-curated-hero .mkm-curated-hero-card .bloghash-entry-content-wrapper {
    position: relative;
    z-index: 2;
    width: min(64%, 860px);
    min-height: clamp(500px, 38vw, 610px);
    margin: 0;
    padding: clamp(52px, 5vw, 78px);
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: flex-start;
    background: transparent;
    color: #fff;
}

.mkm-curated-hero .mkm-curated-hero-card .mkm-featured-eyebrow {
    margin: 0 0 1.2rem;
}
.mkm-curated-hero .mkm-curated-hero-card .mkm-featured-eyebrow span {
    color: var(--bloghash-primary);
    background: transparent;
    padding: 0;
    font-size: clamp(1.7rem, 1.25vw, 1.9rem);
    line-height: 1.25;
    font-weight: 700;
    letter-spacing: .05em;
    text-transform: uppercase;
}

.mkm-curated-hero .mkm-curated-hero-card .entry-title {
    margin: 0 0 1.5rem;
    max-width: 72rem;
    font-size: clamp(3.8rem, 3.25vw, 4.8rem);
    line-height: 1.08;
    font-weight: 700;
}
.mkm-curated-hero .mkm-curated-hero-card .entry-title a,
.mkm-curated-hero .mkm-curated-hero-card .entry-title a:hover,
.mkm-curated-hero .mkm-curated-hero-card .entry-title a:focus { color: #fff; }

.mkm-curated-hero .mkm-curated-hero-card .entry-summary {
    margin: 0 0 2.4rem;
    max-width: 72rem;
}
.mkm-curated-hero .mkm-curated-hero-card .entry-summary p {
    color: rgba(255,255,255,.96);
    font-size: clamp(1.9rem, 1.5vw, 2.1rem);
    line-height: 1.55;
    margin: 0;
}

.mkm-curated-hero .mkm-featured-actions {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 1.2rem;
    margin-top: .4rem;
}
.mkm-curated-hero .mkm-featured-actions .bloghash-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 5rem;
    padding: 1.3rem 2.3rem;
    border-radius: var(--bloghash-normal-radius);
    font-size: clamp(1.8rem, 1.25vw, 1.9rem);
    line-height: 1.2;
    font-weight: 700;
    transition: var(--bloghash-transition-primary);
}
.mkm-curated-hero .mkm-featured-actions .mkm-featured-primary-cta {
    color: #fff;
    background: var(--bloghash-primary) !important;
    border: .1rem solid var(--bloghash-primary) !important;
    text-decoration: none !important;
}
.mkm-curated-hero .mkm-featured-actions .mkm-featured-primary-cta:hover,
.mkm-curated-hero .mkm-featured-actions .mkm-featured-primary-cta:focus {
    color: #fff;
    filter: brightness(.94);
    transform: translateY(-1px);
}
.mkm-curated-hero .mkm-featured-actions .mkm-featured-secondary-cta {
    color: #fff;
    background: rgba(17,21,48,.28) !important;
    border: .1rem solid rgba(255,255,255,.86) !important;
    text-decoration: none !important;
}
.mkm-curated-hero .mkm-featured-actions .mkm-featured-secondary-cta:hover,
.mkm-curated-hero .mkm-featured-actions .mkm-featured-secondary-cta:focus {
    color: var(--bloghash-secondary);
    background: #fff;
    border-color: #fff;
    transform: translateY(-1px);
}

/* Curated slides should read as one clean panel, not a stacked card. */
.mkm-curated-hero .swiper-slide,
.mkm-curated-hero .mkm-curated-hero-article,
.mkm-curated-hero .mkm-curated-hero-card { background: transparent; }
.mkm-curated-hero .mkm-curated-hero-card::before,
.mkm-curated-hero .mkm-curated-hero-card::after { box-shadow: none !important; }


/* MKM v1.11 — align curated Hero with the same visual container width as
 * Featured Items and other homepage blocks. The stock Hero row/column keeps
 * grid gutters; Featured Items uses g-0. Remove those gutters only for the
 * curated Hero so its panel edges line up with the rest of the homepage. */
.mkm-curated-hero .bloghash-hero-container > .bloghash-flex-row {
    margin-left: 0;
    margin-right: 0;
}
.mkm-curated-hero .bloghash-hero-container > .bloghash-flex-row > .col-xs-12 {
    padding-left: 0;
    padding-right: 0;
}

/* Reusable Featured Items blocks: same BlogHash component, predictable spacing. */
.mkm-featured-block { margin-block: 3rem; }
.mkm-featured-block + .mkm-featured-block { margin-top: 3rem; }
.mkm-featured-block .bloghash-featured { margin: 0; }

/* Give additional featured links a slightly stronger interactive label while
 * retaining the original BlogHash visual language. */
.mkm-featured-block .bloghash-post-content .bloghash-btn {
    font-weight: 700;
    transition: var(--bloghash-transition-primary);
}
.mkm-featured-block .bloghash-post-item:hover .bloghash-post-content .bloghash-btn,
.mkm-featured-block .bloghash-post-content .bloghash-btn:focus {
    color: #fff;
    background: var(--bloghash-primary);
    border-color: var(--bloghash-primary);
}

@media only screen and (max-width: 960px) {
    .mkm-curated-hero .mkm-curated-hero-card,
    .mkm-curated-hero .mkm-curated-hero-card .bloghash-entry-content-wrapper { min-height: 560px; }
    .mkm-curated-hero .mkm-curated-hero-card .post-thumb::after {
        background: linear-gradient(0deg,
            rgba(17,21,48,.96) 0%,
            rgba(17,21,48,.82) 42%,
            rgba(17,21,48,.28) 76%,
            rgba(17,21,48,.05) 100%);
    }
    .mkm-curated-hero .mkm-curated-hero-card .bloghash-entry-content-wrapper {
        width: 100%;
        padding: 38px 34px;
        justify-content: flex-end;
    }
    .mkm-curated-hero .mkm-curated-hero-card .entry-title {
        font-size: clamp(3.2rem, 6.5vw, 4.2rem);
        max-width: 76rem;
    }
    .mkm-curated-hero .mkm-curated-hero-card .entry-summary { max-width: 76rem; }
}

@media only screen and (max-width: 599px) {
    .mkm-curated-hero .mkm-curated-hero-card,
    .mkm-curated-hero .mkm-curated-hero-card .bloghash-entry-content-wrapper {
        min-height: 540px;
    }
    .mkm-curated-hero .mkm-curated-hero-card .post-thumb::after {
        background: linear-gradient(0deg,
            rgba(17,21,48,.97) 0%,
            rgba(17,21,48,.91) 38%,
            rgba(17,21,48,.60) 64%,
            rgba(17,21,48,.15) 100%);
    }
    .mkm-curated-hero .mkm-curated-hero-card .bloghash-entry-content-wrapper {
        width: 100%;
        padding: 28px 20px;
        justify-content: flex-end;
        align-items: flex-start;
        text-align: left;
        margin: 0;
    }
    .mkm-curated-hero .mkm-curated-hero-card .mkm-featured-eyebrow { margin-bottom: 10px; }
    .mkm-curated-hero .mkm-curated-hero-card .mkm-featured-eyebrow span {
        font-size: 15px;
        line-height: 1.25;
    }
    .mkm-curated-hero .mkm-curated-hero-card .entry-title {
        font-size: clamp(28px, 8vw, 34px);
        line-height: 1.08;
        margin-bottom: 12px;
    }
    .mkm-curated-hero .mkm-curated-hero-card .entry-summary {
        margin-bottom: 18px;
        display: -webkit-box;
        -webkit-line-clamp: 4;
        -webkit-box-orient: vertical;
        overflow: hidden;
    }
    .mkm-curated-hero .mkm-curated-hero-card .entry-summary p {
        font-size: 17px;
        line-height: 1.45;
    }
    .mkm-curated-hero .mkm-featured-actions {
        width: 100%;
        display: grid;
        grid-template-columns: 1fr;
        gap: 10px;
        justify-content: stretch;
    }
    .mkm-curated-hero .mkm-featured-actions .bloghash-btn {
        width: 100%;
        min-height: 48px;
        padding: 12px 16px;
        font-size: 17px;
    }
}


/* MKM v1.6 — Posts You Might Like: editorial 2-column grid, up to 6 items. */
#pyml .mkm-pyml-grid > [class*="col-"] {
    flex: 0 0 50%;
    max-width: 50%;
}
#pyml .bloghash-post-item { height: 100%; }
#pyml .bloghash-post-thumb { aspect-ratio: 16 / 9; overflow: hidden; }
#pyml .bloghash-post-thumb .inner,
#pyml .bloghash-post-thumb img { width: 100%; height: 100%; }
#pyml .bloghash-post-thumb img { object-fit: cover; }
@media only screen and (max-width: 767px) {
    #pyml .mkm-pyml-grid > [class*="col-"] { flex-basis: 100%; max-width: 100%; }
}

/* MKM BlogHash v1.12 — exact desktop width alignment and robust mobile flow. */
/* Stock horizontal slider adds its own 14px inner gutter. That makes the Hero
 * visibly narrower than standard BlogHash card sections even inside the same
 * .bloghash-container. Curated Hero uses the container gutter only. */
#hero .mkm-curated-hero .bloghash-swiper.swiper {
    --bloghash-gutter: 0px;
    padding-left: 0 !important;
    padding-right: 0 !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
}

/* Boxed-separated BlogHash adds 5rem right padding / horizontal offsets to the
 * stock horizontal article. Those are appropriate for the stock 50/50 card,
 * not for the full-image curated Hero. */
@media screen and (min-width: 869px) {
    body.bloghash-layout__boxed-separated #hero .mkm-curated-hero .bloghash-article,
    body.bloghash-layout__boxed-separated.bloghash-blog-image-wrap.bloghash-blog-horizontal #hero .mkm-curated-hero .bloghash-article {
        padding-right: 0 !important;
        margin-left: 0 !important;
        margin-right: 0 !important;
    }
}

@media only screen and (max-width: 599px) {
    #hero .mkm-curated-hero .bloghash-swiper.swiper {
        overflow: visible;
    }
    .mkm-curated-hero .mkm-curated-hero-card {
        width: 100%;
        overflow: hidden;
    }
    .mkm-curated-hero .mkm-curated-hero-card .bloghash-entry-content-wrapper {
        max-width: 100%;
    }
    /* On small screens the overlay follows the reading direction vertically. */
    .mkm-curated-hero .mkm-curated-hero-card .post-thumb::after {
        background: linear-gradient(0deg,
            rgba(17,21,48,.97) 0%,
            rgba(17,21,48,.90) 43%,
            rgba(17,21,48,.52) 70%,
            rgba(17,21,48,.14) 100%) !important;
    }
    #hero .mkm-curated-hero .swiper-button-prev,
    #hero .mkm-curated-hero .swiper-button-next {
        width: 38px;
        height: 38px;
        --swiper-navigation-size: 14px;
    }
}


/* MKM BlogHash v1.13 — responsive containment fixes.
 * Desktop remains unchanged. Tablet and phone slides are content-driven so
 * long editorial copy cannot disappear below or outside the rounded panel. */
@media only screen and (min-width: 600px) and (max-width: 960px) {
    #hero .mkm-curated-hero .swiper-wrapper,
    #hero .mkm-curated-hero .swiper-slide,
    #hero .mkm-curated-hero .mkm-curated-hero-article,
    #hero .mkm-curated-hero .mkm-curated-hero-card {
        height: auto !important;
    }
    #hero .mkm-curated-hero .mkm-curated-hero-card {
        overflow: hidden !important;
    }
    #hero .mkm-curated-hero .mkm-featured-actions {
        row-gap: 12px;
    }
}

@media only screen and (max-width: 599px) {
    #hero .mkm-curated-hero .bloghash-swiper.swiper {
        overflow: hidden !important;
    }
    #hero .mkm-curated-hero .swiper-wrapper,
    #hero .mkm-curated-hero .swiper-slide,
    #hero .mkm-curated-hero .mkm-curated-hero-article,
    #hero .mkm-curated-hero .mkm-curated-hero-card {
        height: auto !important;
    }
    #hero .mkm-curated-hero .mkm-curated-hero-card {
        overflow: hidden !important;
    }
    #hero .mkm-curated-hero .mkm-featured-actions {
        position: static !important;
    }
    #hero .mkm-curated-hero .mkm-featured-actions .bloghash-btn {
        margin: 0 !important;
    }
}
