/* ==========================================================================
   PUENTE LATINO ASSOCIATION — impact-system.css
   Impact areas are INFORMATION, never decoration: symbol + color + text.
   Environmental Justice · Food Justice · Social Justice
   ========================================================================== */

:root{
  --impact-environmental:var(--puente-808); /* #00B088 */
  --impact-food:var(--puente-810);          /* #FFC808 */
  --impact-social:var(--puente-814);        /* #8A69D4 */
  --impact-line:4px;
  --impact-gap:1px;
}

/* ---------- Symbol ---------- */
.pk-impact-symbol{width:16px;height:16px;flex:0 0 auto;display:block;}
.pk-impact-symbol--24{width:44px;height:44px;}
.pk-impact-symbol--32{width:32px;height:32px;}
[data-impact-area="environmental"] .pk-impact-symbol,
.pk-impact-symbol[data-impact-area="environmental"]{color:var(--impact-environmental);}
[data-impact-area="food"] .pk-impact-symbol,
.pk-impact-symbol[data-impact-area="food"]{color:var(--impact-food);}
[data-impact-area="social"] .pk-impact-symbol,
.pk-impact-symbol[data-impact-area="social"]{color:var(--impact-social);}

/* ---------- Legend (formal introduction of the categories) ---------- */
.pk-impact-legend{display:flex;flex-direction:column;gap:12px;}
.pk-impact-legend--row{flex-direction:row;flex-wrap:wrap;gap:12px 28px;}
.pk-impact-legend__item{display:flex;align-items:center;gap:10px;}
.pk-impact-legend__name{
  font-size:18px;font-weight:700;letter-spacing:0.05em;text-transform:uppercase;color:var(--puente-ink);
}
.pk-section--ink .pk-impact-legend__name{color:#fff;}

/* ---------- Small metadata chip ---------- */
.pk-impact-chip{
  display:inline-flex;align-items:center;gap:8px;
  font-size:13px;font-weight:700;letter-spacing:0.055em;text-transform:uppercase;color:var(--puente-ink-3);
}
.pk-impact-chip__rule{width:20px;height:3px;flex:0 0 auto;}
.pk-impact-chip[data-impact-area="environmental"] .pk-impact-chip__rule{background:var(--impact-environmental);}
.pk-impact-chip[data-impact-area="food"] .pk-impact-chip__rule{background:var(--impact-food);}
.pk-impact-chip[data-impact-area="social"] .pk-impact-chip__rule{background:var(--impact-social);}

/* ---------- Edge indicator: a registration mark, not a rainbow ---------- */
.pk-impact-edge{
  position:fixed;top:0;bottom:0;right:0;z-index:90;
  display:flex;gap:var(--impact-gap);pointer-events:none;
}
.pk-impact-edge__line{width:var(--impact-line);height:100%;}
.pk-impact-edge__line[data-impact-area="environmental"]{background:var(--impact-environmental);}
.pk-impact-edge__line[data-impact-area="food"]{background:var(--impact-food);}
.pk-impact-edge__line[data-impact-area="social"]{background:var(--impact-social);}

/* Mobile: the same device becomes a thin horizontal rule under the masthead */
@media (max-width:767px){
  .pk-impact-edge{
    position:fixed;top:var(--header-h-sm);left:0;right:0;bottom:auto;
    width:100%;height:auto;flex-direction:column;
  }
  .pk-impact-edge__line{width:100%;height:var(--impact-line);}
}

/* ---------- Program page accents (selective, never flooded) ---------- */
[data-impact-area] .pk-rule-accent{background:currentColor;}
.pk-program-mark{display:flex;align-items:center;gap:14px;}
.pk-program-mark__rule{width:48px;height:4px;}
[data-impact-area="environmental"] .pk-program-mark__rule{background:var(--impact-environmental);}
[data-impact-area="food"] .pk-program-mark__rule{background:var(--impact-food);}
[data-impact-area="social"] .pk-program-mark__rule{background:var(--impact-social);}

@media (max-width:767px){
  .pk-impact-legend__name{font-size:16px;}
  .pk-impact-chip{font-size:12px;}
  .pk-impact-symbol--24{width:28px;height:28px;}
}