/* Full-width, progressively loaded category showcase. */
.hc-showcase { display: grid; gap: 2.2rem; padding-top: 2rem; }
.hc-section { --hc-accent: #2563eb; position: relative; min-width: 0; padding: clamp(1rem, 2.4vw, 1.65rem); border: 1px solid color-mix(in srgb, var(--hc-accent) 22%, #e6ebf3); border-radius: 1.25rem; background: #fff; box-shadow: 0 15px 38px rgba(15,23,42,.065); overflow: hidden; }
.hc-section::before { content: ''; position: absolute; inset: 0 0 auto; height: 5px; background: linear-gradient(90deg, var(--hc-accent), color-mix(in srgb, var(--hc-accent) 37%, #fff) 72%, transparent); }
.hc-heading { display: flex; justify-content: space-between; align-items: center; gap: 1rem; margin-bottom: 1.05rem; }
.hc-heading__identity { display: flex; align-items: center; gap: .8rem; min-width: 0; }
.hc-heading__icon { display: grid; place-items: center; flex: 0 0 45px; width: 45px; height: 45px; border-radius: .85rem; background: var(--hc-accent); color: #fff; font-size: 1.25rem; }
.hc-heading h2 { margin: .05rem 0 0; font-size: clamp(1.16rem, 2vw, 1.55rem); line-height: 1.2; color: #101b31; font-weight: 850; }
.hc-heading h2 span { margin-left: .15rem; color: var(--hc-accent); font-size: .78em; font-weight: 750; }
.hc-heading__link { display: inline-flex; align-items: center; gap: .45rem; flex: 0 0 auto; color: var(--hc-accent); font-size: .82rem; font-weight: 800; text-decoration: none; }
.hc-heading__link:hover, .hc-story h3 a:hover { color: var(--hc-accent); }
.hc-grid { display: grid; gap: .85rem; min-width: 0; }
.hc-story { position: relative; min-width: 0; overflow: hidden; background: #f8fafc; border: 1px solid #e7edf5; border-radius: 1rem; }
.hc-story__media { display: block; overflow: hidden; min-width: 0; background: #e9eef6; }
.hc-story__media img, .hc-story__media .img-placeholder { display: block; width: 100%; height: 100%; object-fit: cover; transition: transform .4s ease; }
.hc-story:hover .hc-story__media img { transform: scale(1.035); }
.hc-story__copy { position: relative; z-index: 1; min-width: 0; padding: 1rem; }
.hc-story__kicker { display: inline-block; font-size: .68rem; font-weight: 800; color: var(--hc-accent); }
.hc-story:not(:first-child) .hc-story__kicker { padding: .16rem .46rem; border-radius: .4rem; background: color-mix(in srgb, var(--hc-accent) 12%, #fff); }
.hc-story h3 { margin: .35rem 0; font-size: clamp(.92rem, 1.45vw, 1.08rem); font-weight: 800; line-height: 1.35; overflow-wrap: anywhere; }
.hc-story h3 a { color: #111d32; text-decoration: none; }
.hc-story p { margin: .5rem 0; font-size: .81rem; line-height: 1.55; color: #526175; }
.hc-story time { font-size: .72rem; color: #718096; }
.hc-empty { display: flex; align-items: center; gap: .65rem; color: #63748a; border: 1px dashed #cbd5e1; background: #f8fafc; border-radius: .85rem; padding: 1.15rem; }
.hc-empty i { color: var(--hc-accent); font-size: 1.25rem; }
.hc-load { display: flex; justify-content: center; padding: 1.25rem; }
.hc-load button { border-radius: 999px; padding: .65rem 1.4rem; font-weight: 750; }

/* Every layout uses photographs and balanced columns, including former lists. */
.hc-grid--spotlight { grid-template-columns: minmax(0, 1.35fr) minmax(0, 1fr); grid-template-rows: repeat(3, minmax(110px, auto)); }
.hc-grid--spotlight .hc-story:first-child { grid-row: 1 / 4; min-height: 365px; background: #0f172a; border: 0; }
.hc-grid--spotlight .hc-story:first-child .hc-story__media { position: absolute; inset: 0; }
.hc-grid--spotlight .hc-story:first-child .hc-story__copy { position: absolute; inset: auto 0 0; padding: 2rem 1.3rem 1.35rem; background: linear-gradient(transparent, rgba(3,8,20,.94)); }
.hc-grid--spotlight .hc-story:first-child h3 a, .hc-grid--spotlight .hc-story:first-child time { color: #fff; }
.hc-grid--spotlight .hc-story:first-child h3 { font-size: clamp(1.22rem, 2.5vw, 1.75rem); }
.hc-grid--spotlight .hc-story:first-child p { color: #e2e8f0; }
.hc-grid--spotlight .hc-story:not(:first-child) { display: grid; grid-template-columns: 37% minmax(0,1fr); }
.hc-grid--spotlight .hc-story:not(:first-child) .hc-story__media { height: 100%; }

.hc-grid--cards { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.hc-grid--cards .hc-story { background: #fff; }
.hc-grid--cards .hc-story:nth-child(2n) { background: color-mix(in srgb, var(--hc-accent) 9%, #fff); }
.hc-grid--cards .hc-story__media { height: 160px; }
.hc-grid--cards .hc-story__copy { min-height: 125px; }
.hc-grid--cards .hc-story:first-child { background: color-mix(in srgb, var(--hc-accent) 7%, #fff); }
.hc-grid--cards:has(> .hc-story:only-child) { grid-template-columns: minmax(0, 1fr); }
.hc-grid--cards:has(> .hc-story:nth-child(2):last-child) { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.hc-grid--cards:has(> .hc-story:nth-child(3):last-child) { grid-template-columns: repeat(3, minmax(0, 1fr)); }

.hc-grid--stream { grid-template-columns: repeat(3, minmax(0,1fr)); }
.hc-grid--stream .hc-story:first-child { grid-column: 1 / -1; display: grid; grid-template-columns: 46% minmax(0,1fr); background: color-mix(in srgb, var(--hc-accent) 6%, #fff); }
.hc-grid--stream .hc-story:first-child .hc-story__media { min-height: 230px; }
.hc-grid--stream .hc-story:first-child .hc-story__copy { align-self: center; padding: 1.4rem; }
.hc-grid--stream .hc-story:first-child h3 { font-size: clamp(1.2rem,2.2vw,1.6rem); }
.hc-grid--stream .hc-story:not(:first-child) .hc-story__media { height: 135px; }
.hc-grid--stream .hc-story:not(:first-child) { background: color-mix(in srgb, var(--hc-accent) 7%, #fff); }

.hc-grid--mosaic { grid-template-columns: 1.1fr 1.1fr .9fr; grid-template-rows: repeat(2, minmax(155px,auto)); }
.hc-grid--mosaic .hc-story:first-child { grid-column: 1 / 3; grid-row: 1 / 3; background: #111827; min-height: 330px; }
.hc-grid--mosaic .hc-story:first-child .hc-story__media { position: absolute; inset: 0; }
.hc-grid--mosaic .hc-story:first-child .hc-story__copy { position: absolute; inset: auto 0 0; width: 100%; padding: 2.2rem 1.25rem 1rem; background: linear-gradient(transparent,rgba(0,0,0,.88)); }
.hc-grid--mosaic .hc-story:first-child h3 a, .hc-grid--mosaic .hc-story:first-child time { color: #fff; }
.hc-grid--mosaic .hc-story:nth-child(2) { grid-column: 3; grid-row: 1; }
.hc-grid--mosaic .hc-story:nth-child(3) { grid-column: 3; grid-row: 2; }
.hc-grid--mosaic .hc-story:nth-child(4) { grid-column: 1 / -1; display: grid; grid-template-columns: 29% minmax(0,1fr); }
.hc-grid--mosaic .hc-story:not(:first-child):not(:nth-child(4)) .hc-story__media { height: 90px; }
.hc-grid--mosaic .hc-story:nth-child(4) .hc-story__media { height: 130px; }

.hc-grid--editorial { grid-template-columns: 1.25fr repeat(3,minmax(0,1fr)); }
.hc-grid--editorial .hc-story:first-child { display: flex; flex-direction: column-reverse; justify-content: space-between; background: color-mix(in srgb, var(--hc-accent) 12%, #fff); border-color: color-mix(in srgb, var(--hc-accent) 25%, #fff); }
.hc-grid--editorial .hc-story:first-child .hc-story__media { height: 175px; }
.hc-grid--editorial .hc-story:first-child h3 { font-size: 1.38rem; }
.hc-grid--editorial .hc-story:not(:first-child) { background: #fff; }
.hc-grid--editorial .hc-story:nth-child(3) { background: color-mix(in srgb, var(--hc-accent) 10%, #fff); }
.hc-grid--editorial .hc-story:not(:first-child) .hc-story__media { height: 175px; }

.hc-grid--ribbon { grid-template-columns: repeat(3, minmax(0,1fr)); }
.hc-grid--ribbon .hc-story:first-child { grid-column: 1 / -1; display: grid; grid-template-columns: 58% minmax(0,1fr); background: #12213b; border: 0; }
.hc-grid--ribbon .hc-story:first-child .hc-story__media { min-height: 235px; }
.hc-grid--ribbon .hc-story:first-child .hc-story__copy { align-self: center; padding: 1.4rem; }
.hc-grid--ribbon .hc-story:first-child h3 a, .hc-grid--ribbon .hc-story:first-child time { color: #fff; }
.hc-grid--ribbon .hc-story:first-child p { color: #cbd5e1; }
.hc-grid--ribbon .hc-story:not(:first-child) { display: grid; grid-template-columns: 42% minmax(0,1fr); }
.hc-grid--ribbon .hc-story:not(:first-child) .hc-story__media { min-height: 125px; }
.hc-grid--ribbon .hc-story:not(:first-child) { background: color-mix(in srgb, var(--hc-accent) 9%, #fff); }

/* The accent follows each category's panel color; adjacent sections alternate soft tints. */
.hc-section:nth-child(6n + 1) { background: linear-gradient(145deg, color-mix(in srgb, var(--hc-accent) 15%, #fff), #fff 42%); }
.hc-section:nth-child(6n + 2) { background: linear-gradient(28deg, #fff 55%, color-mix(in srgb, var(--hc-accent) 15%, #fff)); }
.hc-section:nth-child(6n + 3) { background: linear-gradient(120deg, color-mix(in srgb, var(--hc-accent) 12%, #fff), #fff 62%); }
.hc-section:nth-child(6n + 4) { background: linear-gradient(210deg, #fff 45%, color-mix(in srgb, var(--hc-accent) 17%, #fff)); }
.hc-section:nth-child(6n + 5) { background: linear-gradient(165deg, color-mix(in srgb, var(--hc-accent) 16%, #fff), #fff 65%); }
.hc-section:nth-child(6n) { background: linear-gradient(30deg, color-mix(in srgb, var(--hc-accent) 14%, #fff), #fff 65%); }
.hc-section .hc-heading__icon { background: linear-gradient(135deg, var(--hc-accent), color-mix(in srgb, var(--hc-accent) 55%, #15203d)); box-shadow: 0 8px 20px color-mix(in srgb, var(--hc-accent) 28%, transparent); }
.hc-section .hc-story { box-shadow: 0 8px 18px rgba(15,23,42,.045); }

/* Continued stories render with the same article template as a standalone page. */
.article-flow { margin-top: 2rem; }
.article-flow__full { margin: 0 0 3rem; padding-top: 2rem; border-top: 5px solid var(--hs-primary); }
.article-flow__full .article-detail { min-width: 0; }
.article-flow__load { display: flex; justify-content: center; padding: 1.2rem .5rem 2rem; }
.article-flow__load button { border-radius: 999px; }
.article-flow__end { text-align: center; padding: 1rem; color: #64748b; }

@media(max-width:991px) {
  .hc-grid--cards, .hc-grid--editorial { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .hc-grid--ribbon .hc-story:not(:first-child) { display: block; }
  .hc-grid--ribbon .hc-story:not(:first-child) .hc-story__media { height: 135px; }
}
@media(max-width:650px) {
  .hc-showcase { gap: 1.3rem; }
  .hc-section { padding: .9rem; border-radius: 1rem; }
  .hc-heading__icon { width: 39px; height: 39px; flex-basis: 39px; }
  .hc-grid--spotlight, .hc-grid--cards, .hc-grid--stream, .hc-grid--mosaic, .hc-grid--editorial, .hc-grid--ribbon { grid-template-columns: repeat(2,minmax(0,1fr)); grid-template-rows: auto; }
  .hc-grid--cards:has(> .hc-story:only-child) { grid-template-columns: 1fr; }
  .hc-grid--cards:has(> .hc-story:nth-child(3):last-child) { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .hc-grid .hc-story:first-child, .hc-grid--mosaic .hc-story:nth-child(4) { grid-column: 1 / -1; grid-row: auto; min-height: 0; }
  .hc-grid--spotlight .hc-story:first-child, .hc-grid--mosaic .hc-story:first-child { min-height: 300px; }
  .hc-grid--spotlight .hc-story:not(:first-child), .hc-grid--stream .hc-story:first-child, .hc-grid--mosaic .hc-story:nth-child(4), .hc-grid--ribbon .hc-story:first-child { display: block; }
  .hc-grid--spotlight .hc-story:not(:first-child) .hc-story__media, .hc-grid--cards .hc-story__media, .hc-grid--stream .hc-story:not(:first-child) .hc-story__media, .hc-grid--mosaic .hc-story:not(:first-child):not(:nth-child(4)) .hc-story__media, .hc-grid--editorial .hc-story:not(:first-child) .hc-story__media, .hc-grid--ribbon .hc-story:not(:first-child) .hc-story__media { height: 115px; }
  .hc-grid--mosaic .hc-story:nth-child(2), .hc-grid--mosaic .hc-story:nth-child(3) { grid-column: auto; grid-row: auto; }
  .hc-grid--stream .hc-story:first-child .hc-story__media, .hc-grid--ribbon .hc-story:first-child .hc-story__media, .hc-grid--mosaic .hc-story:nth-child(4) .hc-story__media { height: 215px; min-height: 0; }
  .hc-grid--editorial .hc-story:first-child { grid-column: 1 / -1; }
  .hc-story__copy { padding: .75rem; }
  .hc-story h3 { font-size: .87rem; }
  .hc-story p { display: none; }
  .hc-story__kicker { font-size: .62rem; }
  .hc-story time { font-size: .67rem; }
}
