/* Desktop companion stories remain fixed while the main hero rotates. */
.adc-headline-static { display:grid;grid-template-columns:repeat(4,minmax(0,1fr));padding:6px 5px 0;background:#fff; }
.adc-headline-static .media-item { min-width:0; }
.adc-headline-static .media-box { padding:4px 5px 10px; }
.adc-headline-static .media-image { aspect-ratio:16/9;overflow:hidden;position:relative;border-radius:0; }
.adc-headline-static .media-image img { display:block;width:100%;height:100%;object-fit:cover;border-radius:0; }
.adc-headline-static .media-title { font-size:13px;margin:0;font-weight:600;line-height:1.5;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:3;overflow:hidden; }
.adc-headline-static .media-text { padding:10px 0 0;min-height:54px; }
.adc-headline-static .media-title a { color:#444;text-decoration:none; }

/* Preserve the photo brightness; shade only the lower title area. */
.widget.headline .headline-big .media-text {
    background:linear-gradient(to bottom,transparent 0%,transparent 45%,rgba(0,0,0,.10) 60%,rgba(0,0,0,.48) 80%,rgba(0,0,0,.80) 100%);
}

/* The lower grid has its own palette, independent of the hero instance palette. */
html body .widget.headline .adc-headline-static[data-adc-grid-colors] { background-color:var(--adc-grid-bg)!important; }
html body .widget.headline .adc-headline-static[data-adc-grid-colors] .media-text { background-color:var(--adc-grid-title-bg)!important; }
html body .widget.headline .adc-headline-static[data-adc-grid-colors] .media-title,
html body .widget.headline .adc-headline-static[data-adc-grid-colors] .media-title a { color:var(--adc-grid-title)!important; }