/* Distinct compositions for the homepage's editorial sections. */
.cc-editorial-grid { display: grid; gap: 28px; }
.cc-editorial-story { position: relative; min-width: 0; }
.cc-editorial-story__media { display: block; overflow: hidden; aspect-ratio: 16 / 10; background: var(--cc-gray-100); border-radius: 12px; }
.cc-editorial-story__media img, .cc-editorial-story__media .cc-placeholder { width: 100%; height: 100%; min-height: 0; object-fit: cover; transition: transform .35s ease; }
.cc-editorial-story:hover .cc-editorial-story__media img { transform: scale(1.025); }
.cc-editorial-story__body { position: relative; min-width: 0; padding-top: 18px; }
.cc-editorial-story__title { margin: 0 0 14px; font-size: clamp(1.12rem, 1.8vw, 1.45rem); line-height: 1.18; letter-spacing: -.025em; overflow-wrap: anywhere; }
.cc-editorial-story--lead .cc-editorial-story__title { font-size: clamp(1.65rem, 2.9vw, 2.65rem); line-height: 1.08; letter-spacing: -.04em; }
.cc-editorial-story__excerpt { margin: 0 0 18px; color: var(--cc-gray-700); font-size: .95rem; line-height: 1.65; }
.cc-editorial-story .cc-eyebrow { font-size: .7rem; }
.cc-editorial-story a:focus-visible { outline: 3px solid var(--cc-orange); outline-offset: 4px; }

/* General: two large leads above four smaller cards in a single desktop row. */
.cc-editorial-grid--double { grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 32px 36px; align-items: start; }
.cc-editorial-grid--double .cc-editorial-story--lead { grid-column: span 2; }
.cc-editorial-grid--double .cc-editorial-story--lead .cc-editorial-story__media { aspect-ratio: 16 / 9; }
.cc-editorial-grid--double .cc-editorial-story--lead .cc-editorial-story__title { font-size: clamp(1.6rem, 2.5vw, 2.25rem); }
.cc-editorial-grid--double .cc-editorial-story:not(.cc-editorial-story--lead) { padding-top: 24px; border-top: 1px solid var(--cc-gray-200); }
.cc-editorial-grid--double .cc-editorial-story:not(.cc-editorial-story--lead) .cc-editorial-story__media { aspect-ratio: 4 / 3; }
.cc-editorial-grid--double .cc-editorial-story:not(.cc-editorial-story--lead) .cc-editorial-story__body { padding-top: 16px; }

/* Alternate lead-and-list composition. */
.cc-editorial-grid--lead { grid-template-columns: minmax(0, 1.35fr) minmax(0, 1fr); column-gap: 38px; align-items: start; }
.cc-editorial-grid--lead .cc-editorial-story--lead { grid-row: span 2; padding-right: 30px; border-right: 1px solid var(--cc-gray-200); }
.cc-editorial-grid--lead .cc-editorial-story--lead .cc-editorial-story__media { aspect-ratio: 16 / 9; }
.cc-editorial-grid--lead .cc-editorial-story:not(.cc-editorial-story--lead) { display: grid; grid-template-columns: minmax(100px, .65fr) minmax(0, 1fr); gap: 18px; padding-bottom: 24px; border-bottom: 1px solid var(--cc-gray-200); }
.cc-editorial-grid--lead .cc-editorial-story:not(.cc-editorial-story--lead) .cc-editorial-story__body { padding-top: 0; }
.cc-editorial-grid--lead .cc-editorial-story:not(.cc-editorial-story--lead) .cc-editorial-story__media { aspect-ratio: 1; }

/* Politics: newspaper columns, with a wider lead and fine vertical dividers. */
.cc-editorial-grid--briefing { grid-template-columns: minmax(0, 1.6fr) repeat(2, minmax(0, 1fr)); align-items: start; }
.cc-editorial-grid--briefing .cc-editorial-story + .cc-editorial-story { padding-left: 26px; border-left: 1px solid #d1d1d6; }
.cc-editorial-grid--briefing .cc-editorial-story--lead .cc-editorial-story__media { aspect-ratio: 2; }
.cc-editorial-grid--briefing .cc-editorial-story:not(.cc-editorial-story--lead) .cc-editorial-story__media { aspect-ratio: 4 / 3; }
.cc-editorial-grid--briefing.cc-editorial-grid--count-5 .cc-editorial-story--lead,
.cc-editorial-grid--briefing.cc-editorial-grid--count-4 .cc-editorial-story--lead { grid-row: span 2; }
.cc-editorial-grid--briefing.cc-editorial-grid--count-5 .cc-editorial-story--lead .cc-editorial-story__media,
.cc-editorial-grid--briefing.cc-editorial-grid--count-4 .cc-editorial-story--lead .cc-editorial-story__media { aspect-ratio: 4 / 3; }

/* Judicial: a concise numbered news list with photos to the right. */
.cc-editorial-grid--rail { gap: 0; counter-reset: judicial-stories; }
.cc-editorial-grid--rail .cc-editorial-story { display: grid; grid-template-columns: 55px minmax(0, 1fr) 220px; align-items: center; gap: 26px; padding: 26px 0; border-bottom: 1px solid var(--cc-gray-200); counter-increment: judicial-stories; }
.cc-editorial-grid--rail .cc-editorial-story::before { grid-column: 1; grid-row: 1; align-self: start; color: #b44113; content: counter(judicial-stories, decimal-leading-zero); font-size: 2.2rem; font-weight: 900; line-height: 1; }
.cc-editorial-grid--rail .cc-editorial-story__media { grid-column: 3; grid-row: 1; aspect-ratio: 16 / 10; }
.cc-editorial-grid--rail .cc-editorial-story__body { grid-column: 2; grid-row: 1; padding: 0; }
.cc-editorial-grid--rail .cc-editorial-story__title { max-width: 760px; font-size: clamp(1.2rem, 2.2vw, 1.9rem); }

/* Entrepreneurship: one lead and three consistently aligned horizontal stories. */
.cc-editorial-grid--magazine { grid-template-columns: minmax(0, 1.1fr) minmax(0, 1fr); gap: 24px 32px; align-items: start; }
.cc-editorial-grid--magazine .cc-editorial-story--lead { grid-row: span 3; padding-right: 30px; border-right: 1px solid #d1d1d6; }
.cc-editorial-grid--magazine .cc-editorial-story--lead .cc-editorial-story__media { aspect-ratio: 16 / 10; border-radius: 12px; }
.cc-editorial-grid--magazine .cc-editorial-story:not(.cc-editorial-story--lead) { grid-column: 2; display: grid; grid-template-columns: 144px minmax(0, 1fr); gap: 20px; height: 100%; align-items: start; padding-bottom: 22px; border-bottom: 1px solid #d1d1d6; }
.cc-editorial-grid--magazine .cc-editorial-story:not(.cc-editorial-story--lead) .cc-editorial-story__media { aspect-ratio: 4 / 3; }
.cc-editorial-grid--magazine .cc-editorial-story:not(.cc-editorial-story--lead) .cc-editorial-story__title { font-size: clamp(1.1rem, 1.65vw, 1.4rem); line-height: 1.25; }
.cc-editorial-grid--magazine .cc-editorial-story:not(.cc-editorial-story--lead) .cc-editorial-story__body { padding: 0; }
.cc-editorial-grid--magazine.cc-editorial-grid--count-2 .cc-editorial-story--lead { grid-row: span 1; }
.cc-editorial-grid--magazine.cc-editorial-grid--count-3 .cc-editorial-story--lead { grid-row: span 2; }

/* Economy: a wide feature with an attached text panel, followed by two briefs. */
.cc-editorial-grid--feature { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 30px 36px; }
.cc-editorial-grid--feature .cc-editorial-story { display: grid; grid-template-columns: 140px minmax(0, 1fr); gap: 20px; }
.cc-editorial-grid--feature .cc-editorial-story__body { padding-top: 0; }
.cc-editorial-grid--feature .cc-editorial-story__media { aspect-ratio: 1; }
.cc-editorial-grid--feature .cc-editorial-story--lead { grid-column: 1 / -1; grid-template-columns: minmax(0, 1.2fr) minmax(0, 1fr); gap: 0; overflow: hidden; background: #f4f1ed; border-radius: 16px; }
.cc-editorial-grid--feature .cc-editorial-story--lead .cc-editorial-story__media { height: 100%; min-height: 330px; aspect-ratio: auto; border-radius: 0; }
.cc-editorial-grid--feature .cc-editorial-story--lead .cc-editorial-story__body { align-self: center; padding: clamp(24px, 3.5vw, 48px); border-top: 4px solid var(--cc-orange); }

/* Tourism: a panoramic cover story with two smaller image-led stories below. */
.cc-editorial-grid--panorama { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.cc-editorial-grid--panorama .cc-editorial-story--lead { grid-column: 1 / -1; min-height: 410px; }
.cc-editorial-grid--panorama .cc-editorial-story:not(.cc-editorial-story--lead) { display: grid; grid-template-columns: minmax(0, .9fr) minmax(0, 1fr); gap: 20px; align-items: center; }
.cc-editorial-grid--panorama .cc-editorial-story:not(.cc-editorial-story--lead) .cc-editorial-story__body { padding: 0; }
.cc-editorial-grid--panorama .cc-editorial-story:not(.cc-editorial-story--lead) .cc-editorial-story__media { aspect-ratio: 4 / 3; }

/* AMC: a dark regional band with one large cover and two narrower local stories. */
.cc-editorial-section--districts { color: #fff; background: #151518; }
.cc-editorial-section--districts .cc-section-heading { border-color: #515158; }
.cc-editorial-section--districts .cc-section-heading > a { color: #d7d7db; }
.cc-editorial-grid--districts { grid-template-columns: minmax(0, 1.5fr) repeat(2, minmax(0, 1fr)); gap: 18px; align-items: stretch; }
.cc-editorial-grid--districts .cc-editorial-story { min-height: 370px; }
.cc-editorial-grid--districts .cc-editorial-story--lead .cc-editorial-story__title { font-size: clamp(1.65rem, 2.5vw, 2.3rem); }
.cc-editorial-section--districts .cc-empty { color: #d7d7db; background: #242428; }

/* Cover cards keep text in normal flow, so long titles can expand the card. */
.cc-editorial-grid--panorama .cc-editorial-story--lead,
.cc-editorial-grid--districts .cc-editorial-story { display: flex; align-items: flex-end; overflow: hidden; isolation: isolate; color: #fff; background: #171719; border-radius: 14px; }
.cc-editorial-grid--panorama .cc-editorial-story--lead .cc-editorial-story__media,
.cc-editorial-grid--districts .cc-editorial-story__media { position: absolute; inset: 0; width: 100%; height: 100%; aspect-ratio: auto; border-radius: 0; }
.cc-editorial-grid--panorama .cc-editorial-story--lead::after,
.cc-editorial-grid--districts .cc-editorial-story::after { position: absolute; inset: 0; z-index: 1; pointer-events: none; content: ""; background: linear-gradient(0deg, rgba(0,0,0,.97), rgba(0,0,0,.70) 45%, rgba(0,0,0,.05)); }
.cc-editorial-grid--panorama .cc-editorial-story--lead .cc-editorial-story__body,
.cc-editorial-grid--districts .cc-editorial-story__body { z-index: 2; width: 100%; padding: 28px; }
.cc-editorial-grid--panorama .cc-editorial-story--lead .cc-editorial-story__body { max-width: 900px; padding: clamp(26px, 4vw, 48px); }
.cc-editorial-grid--panorama .cc-editorial-story--lead .cc-editorial-story__title { font-size: clamp(1.8rem, 3.6vw, 3.4rem); }
.cc-editorial-grid--panorama .cc-editorial-story--lead .cc-eyebrow,
.cc-editorial-grid--districts .cc-eyebrow { color: #ffb190; }
.cc-editorial-grid--panorama .cc-editorial-story--lead .cc-meta,
.cc-editorial-grid--districts .cc-meta { color: #dedee3; }
.cc-editorial-grid--panorama .cc-editorial-story--lead h3 a,
.cc-editorial-grid--districts h3 a { color: #fff; }
.cc-editorial-grid--panorama .cc-editorial-story--lead h3 a:hover,
.cc-editorial-grid--districts h3 a:hover { color: #ffb190; }

/* A category with only one or two posts should not leave empty columns. */
.cc-editorial-grid--count-1 { grid-template-columns: minmax(0, 1fr); }
.cc-editorial-grid--count-1 > .cc-editorial-story { grid-column: 1 / -1; grid-row: auto; padding-right: 0; border-right: 0; }
.cc-editorial-grid--count-1.cc-editorial-grid--lead .cc-editorial-story,
.cc-editorial-grid--count-1.cc-editorial-grid--briefing .cc-editorial-story,
.cc-editorial-grid--count-1.cc-editorial-grid--magazine .cc-editorial-story { display: grid; grid-template-columns: minmax(0, 1.1fr) minmax(0, 1fr); gap: 32px; align-items: center; }
.cc-editorial-grid--count-1.cc-editorial-grid--briefing .cc-editorial-story__media { aspect-ratio: 16 / 9; }
.cc-editorial-grid--count-2.cc-editorial-grid--briefing,
.cc-editorial-grid--count-2.cc-editorial-grid--districts { grid-template-columns: minmax(0, 1.4fr) minmax(0, 1fr); }
.cc-editorial-grid--count-2.cc-editorial-grid--feature .cc-editorial-story:last-child,
.cc-editorial-grid--count-2.cc-editorial-grid--panorama .cc-editorial-story:last-child { grid-column: 1 / -1; }

@media (max-width: 960px) {
  .cc-editorial-grid { gap: 24px; }
  .cc-editorial-grid--double { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .cc-editorial-grid--double .cc-editorial-story--lead { grid-column: span 1; }
  .cc-editorial-grid--lead { column-gap: 24px; }
  .cc-editorial-grid--lead .cc-editorial-story--lead { padding-right: 22px; }
  .cc-editorial-grid--lead .cc-editorial-story:not(.cc-editorial-story--lead) { grid-template-columns: 100px minmax(0, 1fr); gap: 12px; }
  .cc-editorial-grid--magazine { column-gap: 24px; }
  .cc-editorial-grid--magazine .cc-editorial-story--lead { padding-right: 22px; }
  .cc-editorial-grid--magazine .cc-editorial-story:not(.cc-editorial-story--lead) { grid-template-columns: 108px minmax(0, 1fr); gap: 14px; }
  .cc-editorial-grid--feature .cc-editorial-story { grid-template-columns: 105px minmax(0, 1fr); gap: 16px; }
  .cc-editorial-grid--feature .cc-editorial-story--lead { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0; }
  .cc-editorial-grid--districts { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .cc-editorial-grid--districts .cc-editorial-story--lead { grid-column: 1 / -1; min-height: 340px; }
  .cc-editorial-grid--districts .cc-editorial-story { min-height: 290px; }
  .cc-editorial-grid--districts .cc-editorial-story--lead .cc-editorial-story__body { max-width: 680px; }
  .cc-editorial-grid--count-2.cc-editorial-grid--districts .cc-editorial-story:last-child { grid-column: 1 / -1; }
  .cc-editorial-grid--briefing .cc-editorial-story + .cc-editorial-story { padding-left: 18px; }
  .cc-editorial-grid--rail .cc-editorial-story { grid-template-columns: 40px minmax(0, 1fr) 170px; gap: 20px; }
}

@media (max-width: 720px) {
  .cc-editorial-grid { grid-template-columns: minmax(0, 1fr); gap: 24px; }
  .cc-editorial-grid > .cc-editorial-story { grid-column: 1; grid-row: auto; }
  .cc-editorial-grid--double .cc-editorial-story:not(.cc-editorial-story--lead) { display: grid; grid-template-columns: 112px minmax(0, 1fr); gap: 16px; }
  .cc-editorial-grid--double .cc-editorial-story:not(.cc-editorial-story--lead) .cc-editorial-story__body { padding: 0; }
  .cc-editorial-grid--briefing.cc-editorial-grid--count-5 .cc-editorial-story--lead,
  .cc-editorial-grid--briefing.cc-editorial-grid--count-4 .cc-editorial-story--lead { grid-row: auto; }
  .cc-editorial-grid--lead .cc-editorial-story--lead { padding-right: 0; border-right: 0; }
  .cc-editorial-grid--lead .cc-editorial-story:not(.cc-editorial-story--lead) { grid-template-columns: 112px minmax(0, 1fr); }
  .cc-editorial-grid--briefing .cc-editorial-story + .cc-editorial-story { display: grid; grid-template-columns: 112px minmax(0, 1fr); gap: 16px; padding: 20px 0 0; border-left: 0; border-top: 1px solid #d1d1d6; }
  .cc-editorial-grid--briefing .cc-editorial-story + .cc-editorial-story .cc-editorial-story__body { padding: 0; }
  .cc-editorial-grid--magazine .cc-editorial-story--lead,
  .cc-editorial-grid--magazine.cc-editorial-grid--count-2 .cc-editorial-story--lead,
  .cc-editorial-grid--magazine.cc-editorial-grid--count-3 .cc-editorial-story--lead { grid-row: auto; padding-right: 0; border-right: 0; }
  .cc-editorial-grid--magazine .cc-editorial-story:not(.cc-editorial-story--lead) { grid-column: 1; grid-template-columns: 112px minmax(0, 1fr); gap: 16px; height: auto; }
  .cc-editorial-grid--feature .cc-editorial-story--lead { grid-template-columns: minmax(0, 1fr); }
  .cc-editorial-grid--feature .cc-editorial-story--lead .cc-editorial-story__media { min-height: 0; height: auto; aspect-ratio: 16 / 10; }
  .cc-editorial-grid--feature .cc-editorial-story--lead .cc-editorial-story__body { padding: 24px; }
  .cc-editorial-grid--panorama .cc-editorial-story--lead { min-height: 390px; }
  .cc-editorial-grid--panorama .cc-editorial-story:not(.cc-editorial-story--lead) { grid-template-columns: 112px minmax(0, 1fr); gap: 16px; }
  .cc-editorial-grid--districts .cc-editorial-story { min-height: 290px; }
  .cc-editorial-grid--rail .cc-editorial-story { grid-template-columns: 28px minmax(0, 1fr) 90px; gap: 12px; padding: 20px 0; }
  .cc-editorial-grid--rail .cc-editorial-story::before { font-size: 1.35rem; }
  .cc-editorial-grid--rail .cc-editorial-story__media { aspect-ratio: 1; }
  .cc-editorial-grid--count-1.cc-editorial-grid--lead .cc-editorial-story,
  .cc-editorial-grid--count-1.cc-editorial-grid--briefing .cc-editorial-story,
  .cc-editorial-grid--count-1.cc-editorial-grid--magazine .cc-editorial-story { grid-template-columns: minmax(0, 1fr); gap: 0; }
  .cc-editorial-grid--count-2.cc-editorial-grid--briefing,
  .cc-editorial-grid--count-2.cc-editorial-grid--districts { grid-template-columns: minmax(0, 1fr); }
}

@media (prefers-reduced-motion: reduce) {
  .cc-editorial-story__media img { transition: none; }
  .cc-editorial-story:hover .cc-editorial-story__media img { transform: none; }
}
