/* ==========================================================================
   ConnectedEarth -- shared 3-column feed grid
   Used by: homepage Featured Analysis (Item 12); industry merged feed (Item 9).
   Col 1 = 1 large card - Col 2 = 3 medium - Col 3 = 5 compact.
   Widths 5:4:3; all columns equal height; cards share their column's height.
   Signal cards (industry pages only) use the --ce-alt-band fill (s3.1/s3.2
   sanctioned exception).
   ========================================================================== */
.ce-feed {
  --cf-amber:  var(--theme-palette-color-1, #FFB300);
  --cf-amber-h: var(--theme-palette-color-2, #E0A200);
  --cf-navy:   var(--theme-palette-color-3, #252B52);
  --cf-dark:   var(--theme-palette-color-5, #1A1A2E);
  --cf-gray:   var(--theme-palette-color-6, #8B8FA8);
  --cf-white:  var(--theme-palette-color-7, #FFFFFF);
  --cf-border: #E2E4EB;
  --cf-alt:    #D5EEF5;
  --cf-ind:    #92400E;
}

/* ---- Grid ---- */
.ce-feed-grid {
  display: grid;
  grid-template-columns: minmax(0, 5fr) minmax(0, 4fr) minmax(0, 3fr);
  gap: 16px;
  align-items: stretch;
}
.ce-feed-grid--cols-2 { grid-template-columns: minmax(0, 5fr) minmax(0, 4fr); }
.ce-feed-grid--cols-1 { grid-template-columns: minmax(0, 1fr); max-width: 760px; margin: 0 auto; }

.ce-feed-col { display: flex; flex-direction: column; gap: 12px; min-width: 0; }
.ce-feed-col--3 { gap: 10px; }
.ce-feed-col > .ce-feed-card { flex: 1 1 0; }

/* ---- Card (shared) ---- */
.ce-feed-card {
  display: flex; flex-direction: column; min-width: 0;
  background: var(--cf-white);
  border: 1px solid var(--cf-border);
  border-radius: 10px;
  text-decoration: none;
  transition: border-color .15s ease, box-shadow .15s ease;
}
a.ce-feed-card:hover { border-color: var(--cf-amber); box-shadow: 0 6px 18px rgba(37, 43, 82, .10); }
a.ce-feed-card:focus-visible { outline: 2px solid var(--cf-amber); outline-offset: 2px; }

.ce-feed-body { display: flex; flex-direction: column; align-items: flex-start; padding: 16px 18px; }

.ce-feed-kick {
  font-family: 'Exo 2', sans-serif; font-weight: 700; font-size: 11px;
  letter-spacing: .15em; text-transform: uppercase;
  color: var(--cf-ind); margin: 0 0 6px;
}
.ce-feed-title {
  font-family: 'Exo 2', sans-serif; font-weight: 700;
  color: var(--cf-navy); line-height: 1.25; margin: 0;
}
.ce-feed-ex {
  font-family: 'Lato', sans-serif; font-weight: 300;
  color: var(--cf-dark); line-height: 1.6; margin: 8px 0 0;
}

/* ---- Col 1: large ---- */
.ce-feed-card--lg .ce-feed-img {
  position: relative; line-height: 0; overflow: hidden;
  border-radius: 9px 9px 0 0;
}
.ce-feed-card--lg .ce-feed-img img {
  width: 100%; aspect-ratio: 16 / 9; height: auto; object-fit: cover;
  filter: saturate(0.86); display: block;
}
.ce-feed-card--lg .ce-feed-img::after {
  content: ""; position: absolute; inset: 0;
  background: var(--cf-navy); opacity: 0.12; pointer-events: none;
}
.ce-feed-card--lg .ce-feed-body { padding: 18px 20px 20px; }
.ce-feed-card--lg .ce-feed-title { font-weight: 800; font-size: 22px; line-height: 1.2; }
.ce-feed-card--lg .ce-feed-ex { font-size: 15px; }

/* Col 1 excerpt fills the height set by Cols 2-3 without driving it:
   contain:size gives it no intrinsic height, flex-grow fills the space,
   the fade hides the cut. Min ~3 lines so it never vanishes. */
.ce-feed-grid:not(.ce-feed-grid--cols-1) .ce-feed-card--lg .ce-feed-body { flex: 1 1 auto; min-height: 0; }
.ce-feed-grid:not(.ce-feed-grid--cols-1) .ce-feed-card--lg .ce-feed-ex {
  flex: 1 1 0; min-height: 4.8em; width: 100%;
  contain: size; overflow: hidden;
  -webkit-mask-image: linear-gradient(to bottom, #000 calc(100% - 1.6em), transparent);
          mask-image: linear-gradient(to bottom, #000 calc(100% - 1.6em), transparent);
}
.ce-feed-grid--cols-1 .ce-feed-card--lg .ce-feed-ex {
  display: -webkit-box; -webkit-line-clamp: 5; -webkit-box-orient: vertical; overflow: hidden;
}

/* ---- Col 2: medium ---- */
.ce-feed-card--md .ce-feed-title { font-size: 16px; }
.ce-feed-card--md .ce-feed-ex { font-size: 14px; }

/* ---- Col 3: compact ---- */
.ce-feed-card--sm .ce-feed-body { padding: 12px 14px; }
.ce-feed-card--sm .ce-feed-title { font-size: 14px; }

/* ---- Tier pill (descriptor -- not clickable, s3.5) ---- */
.ce-tier {
  position: relative; display: inline-block;
  font-family: 'Exo 2', sans-serif; font-weight: 700; font-size: 10px;
  letter-spacing: .08em; text-transform: uppercase; line-height: 1;
  padding: 4px 9px; border: 1px solid; border-radius: 999px;
  margin: 0 0 8px;
}
.ce-tier--reality-check { background: #EFF6FF; color: #1D4ED8; border-color: #BFDBFE; }
.ce-tier--field-notes   { background: #ECFDF5; color: #065F46; border-color: #A7F3D0; }
.ce-tier--ground-truth  { background: var(--cf-navy); color: var(--cf-white); border-color: var(--cf-navy); }
.ce-tier[data-tiertip]:hover::after {
  content: attr(data-tiertip);
  position: absolute; left: 0; top: calc(100% + 6px); z-index: 5;
  width: max-content; max-width: 240px;
  background: var(--cf-dark); color: var(--cf-white);
  font-family: 'Lato', sans-serif; font-weight: 400; font-size: 12px;
  letter-spacing: 0; text-transform: none; line-height: 1.4;
  padding: 8px 10px; border-radius: 6px; white-space: normal;
}

/* ---- Signal card (industry merged feed, Item 9) ---- */
.ce-feed-card--signal { background: var(--cf-alt); }
.ce-feed-pills { display: flex; flex-wrap: wrap; gap: 6px; margin: 0 0 8px; }
.ce-sigpill,
.ce-indpill {
  display: inline-block;
  font-family: 'Exo 2', sans-serif; font-weight: 700; font-size: 10px;
  letter-spacing: .08em; text-transform: uppercase; line-height: 1;
  padding: 4px 9px; border: 1px solid; border-radius: 999px; white-space: nowrap;
}
.ce-sigpill { background: var(--cf-amber); color: var(--cf-dark); border-color: var(--cf-amber-h); }
.ce-indpill { background: #FEF3C7; color: var(--cf-ind); border-color: #FDE68A; }
.ce-feed-meta {
  font-family: 'Lato', sans-serif; font-weight: 400; font-size: 12px;
  color: var(--cf-gray); margin: 0 0 6px;
}
.ce-feed-out { color: var(--cf-amber-h); }
.ce-feed-take {
  font-family: 'Raleway', Georgia, serif; font-style: italic; font-weight: 400;
  font-size: 14px; line-height: 1.5; color: var(--cf-navy);
  margin: 8px 0 0; padding-left: 10px; border-left: 2px solid var(--cf-amber);
  display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden;
}

/* ---- Mobile: stack Col 1 -> Col 2 -> Col 3 ---- */
@media (max-width: 900px) {
  .ce-feed-grid,
  .ce-feed-grid--cols-2 { grid-template-columns: minmax(0, 1fr); }
  .ce-feed-col > .ce-feed-card { flex: none; }
  .ce-feed-grid:not(.ce-feed-grid--cols-1) .ce-feed-card--lg .ce-feed-ex {
    flex: none; min-height: 0; contain: none;
    -webkit-mask-image: none; mask-image: none;
    display: -webkit-box; -webkit-line-clamp: 5; -webkit-box-orient: vertical; overflow: hidden;
  }
}