/* Brand Story / Editorial Feature */

.hb-story { display: grid; grid-template-columns: 1fr; gap: clamp(28px, 5vw, 80px); align-items: center; }
@media (min-width: 900px) {
    .hb-story { grid-template-columns: 1fr 1fr; }
    .hb-story--image_right .hb-story__media { order: 2; }
}
.hb-story--noimg { grid-template-columns: 1fr; max-width: 62ch; margin-inline: auto; text-align: center; }

.hb-story__media { position: relative; min-width: 0; }
.hb-story__frame {
    position: relative;
    aspect-ratio: var(--hb-ed-ratio, 4/5);
    overflow: hidden;
    background: var(--_surface);
    border-radius: var(--hb-radius, 4px);
}
.hb-story__img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }

/* Editorial: a second, smaller image overlaps the first */
.hb-story--editorial .hb-story__media { padding-bottom: 14%; }
.hb-story--editorial .hb-story__frame:first-child { width: 82%; }
.hb-story__frame--second {
    position: absolute;
    right: 0;
    bottom: 0;
    aspect-ratio: 1 / 1;
    border: clamp(4px, .8vw, 10px) solid var(--hb-sec-bg, var(--_bg));
    box-sizing: content-box;
    width: calc(46% - 2 * clamp(4px, .8vw, 10px));
}

.hb-story__body { min-width: 0; }
.hb-story__title { font-size: calc(var(--hb-head-scale, 1) * clamp(1.8rem, 1rem + 2.6vw, 3.2rem)); margin-bottom: 1rem; }
.hb-story__text { max-width: 52ch; font-size: 1.05rem; line-height: 1.8; color: var(--_muted); }
.hb-story--noimg .hb-story__text { margin-inline: auto; }
.hb-story__text p { margin: 0 0 1.1em; }
.hb-story__text p:last-child { margin-bottom: 0; }
.hb-story__text a { color: inherit; text-decoration: underline; text-underline-offset: 3px; }
.hb-story--noimg .hb-actions { justify-content: center; }