/* ============================================================
   COALITION PAGE — individual coalition landing page styles
   (/initiatives/nrwc/, /initiatives/seoc/)
   Inherits a lot from initiatives.css; adds page-specific bits.
   ============================================================ */

.coalition-page {
  --coalition-accent: var(--pillar-initiatives, #E8A94B);
  --coalition-accent-soft: rgba(232, 169, 75, 0.12);
}

/* ---------- Hero ---------- */
.coalition-hero {
  background: linear-gradient(135deg, var(--ls-navy-900) 0%, #1a2f4a 100%);
  color: var(--color-text-inverse);
  padding-block: calc(var(--section-y) * 0.85) var(--section-y);
  position: relative;
  overflow: hidden;
}

/* RWI map hero is a high-color topographic render — push the scrim
   darker and desaturate the image further so the headline, eyebrow,
   and breadcrumb stay fully legible. */
[data-tool="rwi"] .photo-brand--hero img {
  filter: grayscale(0.6) contrast(1.05) brightness(0.32);
}
[data-tool="rwi"] .photo-brand--hero::before {
  background: linear-gradient(
    180deg,
    rgba(9, 22, 32, 0.92) 0%,
    rgba(9, 22, 32, 0.86) 45%,
    rgba(9, 22, 32, 0.82) 75%,
    rgba(9, 22, 32, 0.90) 100%
  );
}
.coalition-hero::before {
  content: '';
  position: absolute;
  right: -8%;
  top: 50%;
  transform: translateY(-50%);
  width: 480px;
  height: 555px;
  clip-path: polygon(50% 0%, 100% 25%, 100% 75%, 50% 100%, 0% 75%, 0% 25%);
  border: 1px solid rgba(232, 169, 75, 0.16);
  pointer-events: none;
}
.coalition-hero .breadcrumb { color: var(--color-text-inverse-muted); }
.coalition-hero .breadcrumb a { color: var(--color-text-inverse-muted); }
.coalition-hero .breadcrumb a:hover { color: var(--coalition-accent); }
.coalition-hero .breadcrumb [aria-current] { color: var(--coalition-accent); }
.coalition-hero__eyebrow {
  color: var(--coalition-accent);
  margin-bottom: var(--space-4);
}
.coalition-hero h1 {
  color: var(--ls-white);
  max-width: 22ch;
  margin-top: var(--space-3);
}
.coalition-hero__tagline {
  font-family: var(--font-serif);
  font-size: var(--fs-xl, 1.25rem);
  font-style: italic;
  color: rgba(255, 255, 255, 0.9);
  margin-top: var(--space-4);
  max-width: 50ch;
  line-height: var(--lh-snug);
}
.coalition-hero .lead {
  color: var(--color-text-inverse-muted);
  max-width: 62ch;
  margin-top: var(--space-5);
}
.coalition-hero__actions {
  display: flex;
  gap: var(--space-4);
  margin-top: var(--space-7);
  flex-wrap: wrap;
}

/* ---------- By-the-numbers bar ---------- */
.coalition-stats {
  padding-block: var(--space-8);
  background: var(--ls-white);
  border-bottom: 1px solid var(--ls-neutral-200, rgba(0, 0, 0, 0.06));
}
.coalition-stats__grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: var(--space-6);
}
@media (max-width: 900px) {
  .coalition-stats__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 500px) {
  .coalition-stats__grid { grid-template-columns: 1fr; }
}
.coalition-stat {
  padding-left: var(--space-4);
  border-left: 3px solid var(--coalition-accent);
}
.coalition-stat__number {
  font-family: var(--font-sans);
  font-size: var(--fs-4xl, 2.5rem);
  font-weight: var(--fw-semibold);
  color: var(--ls-navy-900);
  line-height: var(--lh-tight);
}
.coalition-stat__label {
  margin-top: var(--space-2);
  font-size: var(--fs-sm);
  line-height: var(--lh-snug);
  color: var(--color-text-muted);
  max-width: 24ch;
}

/* ---------- The question ---------- */
.coalition-question {
  padding-block: var(--section-y);
  background: var(--ls-white);
}
.coalition-question__heading {
  margin-top: var(--space-3);
  max-width: 30ch;
}
.coalition-question__body {
  margin-top: var(--space-6);
  max-width: 62ch;
}
.coalition-question__body p + p { margin-top: var(--space-5); }

/* ---------- Who's at the table ---------- */
.coalition-table {
  padding-block: var(--section-y);
  background: var(--ls-cream-50, var(--ls-neutral-50, #f8f6f1));
}
.coalition-table__header {
  max-width: var(--container-narrow);
  margin-bottom: var(--space-9);
}
.coalition-table__header h2 {
  margin-top: var(--space-3);
  max-width: 22ch;
}
.coalition-table__grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: var(--space-6);
}
@media (max-width: 900px) {
  .coalition-table__grid { grid-template-columns: 1fr; }
}
.constituency {
  padding: var(--space-6);
  background: var(--ls-white);
  border-radius: var(--radius-md);
  border-top: 3px solid var(--coalition-accent);
}
.constituency__label {
  font-size: var(--fs-xs);
  font-weight: var(--fw-semibold);
  letter-spacing: var(--tracking-wide);
  text-transform: uppercase;
  color: var(--coalition-accent);
}
.constituency__title {
  font-family: var(--font-sans);
  font-size: var(--fs-lg);
  font-weight: var(--fw-semibold);
  color: var(--ls-navy-900);
  line-height: var(--lh-snug);
  margin: var(--space-3) 0 var(--space-4);
}
.constituency__body {
  margin: 0;
  font-size: var(--fs-sm);
  line-height: var(--lh-relaxed);
  color: var(--color-text-body);
}
.constituency__examples {
  margin: var(--space-4) 0 0;
  padding-top: var(--space-4);
  border-top: 1px solid var(--ls-neutral-200, rgba(0, 0, 0, 0.06));
  font-size: var(--fs-xs);
  line-height: var(--lh-snug);
  color: var(--color-text-muted);
  font-style: italic;
}

/* ---------- What the room is working on ---------- */
.coalition-agenda {
  padding-block: var(--section-y);
  background: var(--ls-white);
}
.coalition-agenda__header {
  max-width: var(--container-narrow);
  margin-bottom: var(--space-9);
}
.coalition-agenda__header h2 {
  margin-top: var(--space-3);
  max-width: 28ch;
}
.coalition-agenda__header .lead {
  margin-top: var(--space-5);
  max-width: 62ch;
}
.coalition-agenda__grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: var(--space-6);
}
@media (max-width: 900px) {
  .coalition-agenda__grid { grid-template-columns: 1fr; }
}
.thread {
  padding: var(--space-6);
  border: 1px solid var(--ls-neutral-200, rgba(0, 0, 0, 0.08));
  border-left: 3px solid var(--coalition-accent);
  border-radius: var(--radius-md);
  background: var(--ls-white);
}
.thread__num {
  font-family: var(--font-sans);
  font-size: var(--fs-xs);
  font-weight: var(--fw-semibold);
  letter-spacing: var(--tracking-wide);
  color: var(--coalition-accent);
}
.thread__title {
  font-family: var(--font-sans);
  font-size: var(--fs-lg);
  font-weight: var(--fw-semibold);
  color: var(--ls-navy-900);
  line-height: var(--lh-snug);
  margin: var(--space-3) 0 var(--space-3);
}
.thread__body {
  margin: 0 0 var(--space-4);
  font-size: var(--fs-sm);
  line-height: var(--lh-relaxed);
  color: var(--color-text-body);
}
.thread__anchor {
  display: inline-block;
  padding: 0.25rem 0.6rem;
  background: var(--coalition-accent-soft);
  color: #8b5f1a;
  font-size: var(--fs-2xs, 0.7rem);
  font-weight: var(--fw-semibold);
  letter-spacing: var(--tracking-wide);
  text-transform: uppercase;
  border-radius: var(--radius-full, 9999px);
}

/* ---------- Convenings ---------- */
.coalition-convenings {
  padding-block: var(--section-y);
  background: var(--ls-cream-50, var(--ls-neutral-50, #f8f6f1));
}
.coalition-convenings__header {
  max-width: var(--container-narrow);
  margin-bottom: var(--space-9);
}
.coalition-convenings__header h2 {
  margin-top: var(--space-3);
  max-width: 24ch;
}
.coalition-convenings__grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: var(--space-5);
}
@media (max-width: 900px) {
  .coalition-convenings__grid { grid-template-columns: 1fr; }
}
.convening {
  padding: var(--space-6);
  background: var(--ls-white);
  border-radius: var(--radius-md);
  border-top: 3px solid var(--coalition-accent);
}
.convening__tag {
  font-size: var(--fs-xs);
  font-weight: var(--fw-semibold);
  letter-spacing: var(--tracking-wide);
  text-transform: uppercase;
  color: var(--coalition-accent);
}
.convening__title {
  font-family: var(--font-sans);
  font-size: var(--fs-lg);
  font-weight: var(--fw-semibold);
  color: var(--ls-navy-900);
  margin: var(--space-3) 0 var(--space-3);
}
.convening__body {
  margin: 0;
  font-size: var(--fs-sm);
  line-height: var(--lh-relaxed);
  color: var(--color-text-body);
}
.convening__next {
  margin: var(--space-4) 0 0;
  padding-top: var(--space-3);
  border-top: 1px solid var(--ls-neutral-200, rgba(0, 0, 0, 0.06));
  font-size: var(--fs-xs);
  color: var(--color-text-muted);
}

/* ---------- Published record ---------- */
.coalition-record {
  padding-block: var(--section-y);
  background: var(--ls-white);
}
.coalition-record__header {
  max-width: var(--container-narrow);
  margin-bottom: var(--space-9);
}
.coalition-record__header h2 { margin-top: var(--space-3); }
.coalition-record__header .lead { margin-top: var(--space-5); max-width: 62ch; }
.coalition-record__grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: var(--space-5);
}
@media (max-width: 900px) {
  .coalition-record__grid { grid-template-columns: 1fr; }
}
.coalition-record__footer {
  margin-top: var(--space-8);
  display: flex;
  justify-content: flex-start;
}

/* ---------- Join the conversation ---------- */
.coalition-join {
  padding-block: var(--section-y);
  background: var(--ls-navy-900);
  color: var(--color-text-inverse);
}
.coalition-join__header {
  max-width: var(--container-narrow);
  margin-bottom: var(--space-9);
}
.coalition-join__header .eyebrow { color: var(--coalition-accent); }
.coalition-join__header h2 {
  color: var(--ls-white);
  margin-top: var(--space-3);
  max-width: 30ch;
}
.coalition-join__grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: var(--space-5);
}
@media (max-width: 900px) {
  .coalition-join__grid { grid-template-columns: 1fr; }
}
.entry-card {
  padding: var(--space-6);
  background: rgba(255, 255, 255, 0.04);
  border: 1px solid rgba(255, 255, 255, 0.1);
  border-radius: var(--radius-md);
  display: flex;
  flex-direction: column;
}
.entry-card__tag {
  font-size: var(--fs-xs);
  font-weight: var(--fw-semibold);
  letter-spacing: var(--tracking-wide);
  text-transform: uppercase;
  color: var(--coalition-accent);
}
.entry-card__title {
  font-family: var(--font-sans);
  font-size: var(--fs-lg);
  font-weight: var(--fw-semibold);
  color: var(--ls-white);
  line-height: var(--lh-snug);
  margin: var(--space-3) 0 var(--space-4);
}
.entry-card__body {
  margin: 0;
  font-size: var(--fs-sm);
  line-height: var(--lh-relaxed);
  color: var(--color-text-inverse-muted);
  flex-grow: 1;
}
.entry-card__cta {
  margin-top: var(--space-5);
  font-size: var(--fs-sm);
  font-weight: var(--fw-semibold);
  color: var(--coalition-accent);
  text-decoration: none;
}
.entry-card__cta:hover {
  color: #f2c375;
  text-decoration: underline;
}