/* Content pages (Stream C): home sections, dossier pieces, evidence pages.
   Builds on the Task 3 contract (tokens, poster, dossier, components); only page-specific layout lives here. */

/* ================================================================== home: hero */
.home-hero { padding-top: var(--s-6); }
.home-hero .poster-hero__inner { gap: var(--s-4); }
/* lines and the red brush come from the headline marks (Headline.cs); site.js [data-fit] sizes it so the longest line
   fills the width (min-width: 0 keeps the grid column from widening to the unwrapped text while it measures) */
.home-hero__title { max-width: none; min-width: 0; font-size: clamp(3.1rem, 0.9rem + 6.1vw, 7.25rem); line-height: 0.9; }
/* a brush that starts a line keeps its ragged left end inside the page edge */
.home-hero__title .brush, .reasons__title .brush { margin-top: 0.08em; margin-left: 0.18em; }

/* the place, readable at a glance; the coordinates open the spot in a map app */
.place {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: var(--s-1) var(--s-4);
  margin: 0;
}
.place__pin { flex: none; width: 2.1rem; height: 2.1rem; color: var(--accent); }
.place__head { display: inline-flex; align-items: center; gap: var(--s-2); }
.place__name {
  font-family: var(--font-display);
  font-weight: 800;
  font-stretch: var(--label-stretch);
  font-size: clamp(1.35rem, 1.05rem + 1.1vw, 1.95rem);
  line-height: 1.05;
  letter-spacing: 0.01em;
  text-transform: uppercase;
}
.place__coords {
  display: inline-flex;
  align-items: center;
  gap: var(--s-2);
  min-height: 2.75rem;
  font-family: var(--font-mono);
  font-size: var(--text-sm);
  letter-spacing: 0.03em;
  white-space: nowrap;
  color: var(--fg-muted);
  text-decoration: underline;
  text-decoration-color: var(--accent);
  text-underline-offset: 0.3em;
}
.place__coords:hover { color: var(--fg); text-decoration-thickness: 2px; }
.place__coords .icon { width: 1.35rem; height: 1.35rem; color: var(--accent); }
.place__coords .icon--external { width: 1rem; height: 1rem; }

/* figures: one ruled row per HeroFact.Row, stacked as one box */
.home-hero__facts { margin-top: var(--s-2); }
.home-hero__facts .datagrid + .datagrid { border-top: 0; }

/* "Somos contra… porque:" — the movement's poster, as a list of reasons with icons */
.reasons {
  margin-top: var(--s-5);
  padding-top: var(--s-5);
  border-top: var(--rule-heavy) solid var(--fg);
}
.reasons__head {
  display: grid;
  gap: var(--s-3) var(--s-5);
  align-items: center;
  margin-bottom: var(--s-5);
}
@media (min-width: 62rem) {
  .reasons__head { grid-template-columns: auto minmax(0, 1fr); }
}
.reasons__title { margin: 0; font-size: var(--display-2); line-height: 0.95; }
.reasons__lede {
  margin: 0;
  max-width: 40rem;
  font-family: var(--font-display);
  font-weight: 800;
  font-stretch: var(--label-stretch);
  font-size: clamp(1.15rem, 0.95rem + 0.9vw, 1.65rem);
  line-height: 1.15;
  text-transform: uppercase;
}
.reasons__list {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 30rem), 1fr));
  gap: var(--s-3);
  margin: 0;
  padding: 0;
  list-style: none;
}
.reasons__item { display: flex; min-width: 0; }
.reasons__row {
  display: flex;
  flex: 1;
  min-width: 0;
  align-items: center;
  gap: var(--s-4);
  min-height: 4.5rem;
  padding: var(--s-2) var(--s-5) var(--s-2) var(--s-2);
  border-radius: 2.25rem;
  background: var(--bg-raised);
  color: var(--fg);
  text-decoration: none;
}
a.reasons__row:hover { box-shadow: inset 0 0 0 2px var(--accent); }
.reasons__icon {
  flex: none;
  display: grid;
  place-items: center;
  width: 3.5rem;
  height: 3.5rem;
  border: 2px solid var(--accent);
  border-radius: 50%;
  background: var(--bg);
  color: var(--accent);
}
.reasons__icon .icon { width: 2rem; height: 2rem; }
.reasons__text {
  /* a long word on a narrow phone ("CONTAMINATION") breaks with a hyphen instead of widening the row */
  min-width: 0;
  overflow-wrap: break-word;
  hyphens: auto;
  font-family: var(--font-display);
  font-weight: 800;
  font-stretch: var(--label-stretch);
  font-size: var(--text-md);
  line-height: 1.15;
  text-transform: uppercase;
}
.reasons__go { flex: none; width: 1.25rem; height: 1.25rem; margin-left: auto; color: var(--accent); transition: transform var(--dur) var(--ease-out); }
a.reasons__row:hover .reasons__go { transform: translateX(3px); }
/* the narrowest phones: a smaller circle and tighter spacing leave room for a whole long word ("CONTAMINATION") */
@media (max-width: 23.99rem) {
  .reasons__row { gap: var(--s-3); padding-right: var(--s-4); }
  .reasons__icon { width: 2.75rem; height: 2.75rem; }
  .reasons__icon .icon { width: 1.6rem; height: 1.6rem; }
}
.reasons__more { display: flex; flex-wrap: wrap; gap: var(--s-3) var(--s-5); margin: var(--s-4) 0 0; }

/* ================================================================== home: shared section head
   A huge condensed title left, the one-paragraph lede right (stacked on phones). */
.home-split {
  display: grid;
  gap: var(--s-3) var(--s-7);
  margin-bottom: var(--s-6);
  align-items: end;
}
@media (min-width: 62rem) {
  .home-split { grid-template-columns: minmax(0, 6fr) minmax(0, 5fr); }
}
.home-split__title { margin: 0; font-size: var(--display-2); line-height: 0.86; max-width: 14ch; }
.home-split__lede { margin: 0; max-width: 34rem; font-size: var(--text-md); line-height: 1.45; }

/* ================================================================== map slot (Stream M fills it) */
.map-slot {
  position: relative;
  display: grid;
  place-items: center;
  min-height: 22rem;
  border: var(--rule-heavy) solid var(--fg);
  background-color: var(--bg-raised);
  background-image: url("/img/topo-guarda.svg");
  background-size: 900px 900px;
}
@media (min-width: 62rem) { .map-slot { min-height: 34rem; } }
.map-slot--dossier { min-height: 20rem; margin-bottom: var(--s-4); }
.map-slot__links {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: var(--s-3) var(--s-5);
  margin: 0 0 var(--s-6);
}
.map-slot__links .icon,
.flip__sim .icon { width: 1.1em; height: 1.1em; vertical-align: -0.15em; }
.map-slot[data-lazy-state="ready"] { display: block; }
.map-slot[data-lazy-state="ready"] .map-slot__fallback { display: none; }
/* Once map.js mounts (it adds .movap-map), its own frame layout (map.css: flex column, grid body) takes over:
   the placeholder's centring grid and minimum height would otherwise shrink the map body to the panel's width. */
.map-slot.movap-map,
.map-slot.movap-map[data-lazy-state="ready"] { display: flex; place-items: normal; min-height: 0; }
.map-slot__fallback {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: center;
  gap: var(--s-3) var(--s-5);
  margin: 0;
  padding: var(--s-5);
}
/* the fallback button's label ("Experimentar no simulador") is wider than a 360 px panel in one line: let it wrap */
.map-slot__fallback .btn { max-width: 100%; white-space: normal; text-align: center; line-height: 1.15; }

/* ================================================================== process diagram */
.process { display: grid; gap: var(--s-5); }
.process-diagram {
  width: 100%;
  height: auto;
  border-top: var(--rule-heavy) solid var(--fg);
  border-bottom: var(--rule) solid var(--rule-color);
  padding-block: var(--s-4);
}
.pd-ground { stroke: var(--paper-300); stroke-width: 2; }
.pd-ink { fill: none; stroke: var(--ink-900); stroke-width: 3; stroke-linejoin: miter; }
.pd-thin { stroke-width: 1.5; }
.pd-wheel { fill: var(--paper-50); stroke: var(--ink-900); stroke-width: 3; }
.pd-waste { fill: var(--ink-600); }
.pd-odour { fill: none; stroke: var(--ink-600); stroke-width: 2; stroke-dasharray: 3 5; }
.pd-field { fill: none; stroke: var(--ink-600); stroke-width: 2.5; }
.pd-bubble { fill: none; stroke: var(--ink-900); stroke-width: 2; }
.pd-flow { fill: none; stroke-width: 5; stroke-dasharray: 10 12; stroke-linecap: butt; }
.pd-flow--waste { stroke: var(--red-700); }
.pd-flow--gas { stroke: var(--green-700); }
.pd-flow--digestate { stroke: var(--ink-600); }
.pd-step circle { fill: var(--ink-900); }
.pd-step text { fill: var(--paper-50); font-family: var(--font-mono); font-size: 20px; font-weight: 600; }

@media (prefers-reduced-motion: no-preference) {
  .pd-flow { animation: pd-flow 1.4s linear infinite; }
  .pd-flow--gas { animation-duration: 0.9s; }
  .pd-flow--digestate { animation-duration: 2.2s; }
  .pd-truck { animation: pd-truck 6s var(--ease-out) infinite; }
  .pd-bubble { animation: pd-bubble 3s ease-in infinite; }
  .pd-bubble--2 { animation-delay: 1s; }
  .pd-bubble--3 { animation-delay: 2s; }
  .pd-odour { animation: pd-flow 3s linear infinite reverse; }
}
@keyframes pd-flow { to { stroke-dashoffset: -44; } }
@keyframes pd-truck {
  0% { transform: translateX(-60px); opacity: 0; }
  12% { opacity: 1; }
  45%, 100% { transform: translateX(0); opacity: 1; }
}
@keyframes pd-bubble {
  0% { transform: translateY(0); opacity: 0; }
  20% { opacity: 1; }
  100% { transform: translateY(-70px); opacity: 0; }
}

.process-steps {
  display: grid;
  gap: 0;
  margin: 0;
  padding: 0;
  list-style: none;
  counter-reset: step;
}
@media (min-width: 62rem) {
  .process-steps { grid-template-columns: repeat(5, minmax(0, 1fr)); }
}
.process-steps > li {
  counter-increment: step;
  position: relative;
  padding: var(--s-3) var(--s-4) var(--s-4) 2.75rem;
  border-bottom: var(--rule) solid var(--rule-color);
  font-size: var(--text-sm);
  line-height: 1.5;
}
@media (min-width: 62rem) {
  .process-steps > li { padding: var(--s-6) var(--s-4) 0 0; border-bottom: 0; }
  .process-steps > li + li { padding-left: var(--s-4); border-left: var(--rule) solid var(--rule-color); }
}
.process-steps > li::before {
  content: counter(step);
  position: absolute;
  left: 0;
  top: var(--s-3);
  display: inline-grid;
  place-items: center;
  width: 1.9rem;
  height: 1.9rem;
  background: var(--ink-900);
  color: var(--paper-50);
  font-family: var(--font-mono);
  font-weight: 600;
  font-size: var(--text-sm);
}
@media (min-width: 62rem) {
  .process-steps > li::before { position: static; display: grid; margin-bottom: var(--s-3); }
}
.process-steps strong { display: block; font-family: var(--font-serif); font-size: var(--text-base); }

/* ================================================================== flip cards (cards.js) */
.flip-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(min(100%, 17rem), 1fr));
  gap: 0;
  margin: 0 0 var(--s-6);
  padding: 0;
  list-style: none;
  border-top: var(--rule-heavy) solid var(--fg);
  border-left: var(--rule) solid var(--rule-color);
}
@media (min-width: 62rem) { .flip-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
.flip {
  border-right: var(--rule) solid var(--rule-color);
  border-bottom: var(--rule) solid var(--rule-color);
  perspective: 1400px;
}
.flip__inner {
  display: grid;
  height: 100%;
  min-height: 11rem;
}
@media (min-width: 48rem) { .flip__inner { min-height: 15rem; } }
.flip__front,
.flip__back {
  display: flex;
  flex-direction: column;
  gap: var(--s-2);
  padding: var(--s-5) var(--s-4) var(--s-4);
  background: var(--bg);
  color: var(--fg);
  text-align: left;
}
.flip__front {
  width: 100%;
  border: 0;
  font: inherit;
}
.flip__front:hover .flip__icon,
.flip__front:focus-visible .flip__icon { color: var(--accent); }
.flip__icon .icon { width: 2.6rem; height: 2.6rem; }
.flip__icon { color: var(--fg); transition: color var(--dur) var(--ease-out); }
.flip__title {
  margin: var(--s-2) 0 0;
  font-family: var(--font-mono);
  font-size: var(--text-xs);
  font-weight: 600;
  letter-spacing: 0.05em;
  text-transform: uppercase;
  color: var(--fg-muted);
}
.flip__claim {
  font-family: var(--font-display);
  font-weight: 900;
  font-stretch: var(--display-stretch);
  font-size: var(--display-4);
  line-height: 0.95;
  text-transform: uppercase;
  text-wrap: balance;
}
.flip__hint {
  margin-top: auto;
  padding-top: var(--s-3);
  font-family: var(--font-mono);
  font-size: var(--text-xs);
  color: var(--accent);
  text-decoration: underline;
  text-underline-offset: 0.3em;
}
.flip__summary { margin: 0; font-size: var(--text-base); line-height: 1.5; }
.flip__sim { margin: 0; }
.flip__actions {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: var(--s-3);
  margin: auto 0 0;
  padding-top: var(--s-3);
}
.flip__close {
  min-height: 2.75rem;
  padding: 0 var(--s-3);
  border: 1px solid var(--fg);
  background: none;
  color: var(--fg);
  font-family: var(--font-mono);
  font-size: var(--text-xs);
}
.flip__back { border-top: 4px solid var(--red-600); }
/* Without JS: the front is a plain header and the back is always shown under it. */
.flip:not(.flip--js) .flip__front { cursor: default; padding-bottom: 0; }
.flip:not(.flip--js) .flip__hint,
.flip:not(.flip--js) .flip__close,
.flip:not(.flip--js) .flip__back > .flip__title { display: none; }
.flip:not(.flip--js) .flip__back { border-top: 0; }

/* With JS: both faces share one grid cell; the card turns over. */
.flip--js .flip__front,
.flip--js .flip__back {
  grid-area: 1 / 1;
  backface-visibility: hidden;
  -webkit-backface-visibility: hidden;
  transition: transform 520ms var(--ease-out), opacity 200ms linear;
}
.flip--js .flip__inner { transform-style: preserve-3d; }
.flip--js .flip__back { transform: rotateY(180deg); }
.flip--js[data-open] .flip__front { transform: rotateY(-180deg); }
.flip--js[data-open] .flip__back { transform: rotateY(0); }
@media (prefers-reduced-motion: reduce) {
  .flip--js .flip__front,
  .flip--js .flip__back { transform: none !important; transition: none; }
  .flip--js .flip__back { visibility: hidden; }
  .flip--js[data-open] .flip__back { visibility: visible; }
  .flip--js[data-open] .flip__front { visibility: hidden; }
}

.home-risks__foot {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: var(--s-4) var(--s-6);
  align-items: center;
}
@media (min-width: 62rem) { .home-risks__foot { grid-template-columns: minmax(0, 1fr) auto; } }
.risks-important {
  display: flex;
  gap: var(--s-3);
  align-items: flex-start;
  max-width: 44rem;
  margin: 0;
  font-size: var(--text-base);
}
.risks-important .icon { flex: none; width: 1.6rem; height: 1.6rem; margin-top: 0.1rem; color: var(--accent); }
.risks-important--paper { padding: var(--s-4); border: 2px solid var(--ink-900); }

/* ================================================================== distance strip */
.distance-strip { margin: 0 0 var(--s-4); }
.distance-strip__svg { width: 100%; height: auto; overflow: visible; }
.distance-strip__svg--wide { display: none; }
@media (min-width: 48rem) {
  .distance-strip__svg--wide { display: block; }
  .distance-strip__svg--narrow { display: none; }
}
.ds-label { fill: var(--fg); font-family: var(--font-serif); font-size: 16px; }
.ds-label,
.ds-value { paint-order: stroke; stroke: var(--bg); stroke-width: 6px; stroke-linejoin: round; }
.ds-value { fill: var(--fg); font-family: var(--font-mono); font-size: 14px; font-weight: 600; }
.ds-value--inside { fill: var(--white); stroke: var(--red-600); }
.ds-bar:not(.ds-bar--draft) { fill: var(--red-600); }
.ds-bar--draft { stroke: var(--red-600); stroke-width: 1.5; }
.ds-hatch-bg { fill: var(--bg); }
.ds-hatch { stroke: var(--red-600); stroke-width: 3; }
.ds-line { stroke: var(--accent); stroke-width: 2; stroke-dasharray: 4 4; }
.ds-marker { fill: var(--accent); }
.ds-marker-n { fill: var(--bg); font-family: var(--font-mono); font-size: 13px; font-weight: 600; }
.ds-axis { stroke: var(--fg); stroke-width: 2; }
.ds-tick { stroke: var(--fg); stroke-width: 1.5; }
.ds-tick-label { fill: var(--fg-muted); font-family: var(--font-mono); font-size: 13px; }

.distance-strip__caption { display: grid; gap: var(--s-3); margin-top: var(--s-4); }
.distance-strip__legend {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(min(100%, 14rem), 1fr));
  gap: var(--s-2) var(--s-5);
  margin: 0;
  padding: 0;
  list-style: none;
  font-size: var(--text-sm);
}
.distance-strip__legend li { display: grid; grid-template-columns: 1.5rem minmax(0, 1fr); gap: 0.15rem var(--s-2); align-items: start; }
.distance-strip__legend .distance-strip__n { grid-row: span 2; }
.distance-strip__n {
  display: inline-grid;
  place-items: center;
  width: 1.5rem;
  height: 1.5rem;
  background: var(--accent);
  color: var(--bg);
  font-family: var(--font-mono);
  font-weight: 600;
  font-size: var(--text-xs);
}
.distance-strip__m { font-family: var(--font-mono); font-weight: 600; }
.distance-strip__sources { margin: 0; font-family: var(--font-mono); font-size: var(--text-xs); color: var(--fg-muted); }
.distance-strip__portugal {
  margin: var(--s-2) 0 0;
  padding: var(--s-3) var(--s-4);
  max-width: 44rem;
  border-left: 5px solid var(--red-600);
  font-size: var(--text-md);
  line-height: 1.4;
}

/* ================================================================== home timeline (horizontal on desktop) */
.home-timeline {
  display: grid;
  gap: 0;
  margin: var(--s-5) 0 var(--s-5);
  padding: 0;
  list-style: none;
  border-top: var(--rule-heavy) solid var(--fg);
}
@media (min-width: 62rem) {
  .home-timeline { grid-template-columns: repeat(5, minmax(0, 1fr)); }
}
.home-timeline > li {
  position: relative;
  padding: var(--s-4) var(--s-4) var(--s-4) 0;
  border-bottom: var(--rule) solid var(--rule-color);
}
@media (min-width: 62rem) {
  .home-timeline > li { border-bottom: 0; padding-top: var(--s-5); }
  .home-timeline > li::before {
    content: "";
    position: absolute;
    top: -8px;
    left: 0;
    width: 13px;
    height: 13px;
    background: var(--bg);
    border: 2px solid var(--fg);
  }
  .home-timeline > li:first-child::before { background: var(--red-600); border-color: var(--red-600); }
}
.home-timeline time,
.home-timeline__date {
  display: block;
  margin-bottom: var(--s-2);
  font-family: var(--font-mono);
  font-size: var(--text-xs);
  font-weight: 600;
  letter-spacing: 0.05em;
  text-transform: uppercase;
  color: var(--accent);
}
.home-timeline p { margin: 0; font-size: var(--text-base); line-height: 1.4; }
.home-timeline__next { color: var(--fg-muted); }
@media (min-width: 62rem) { .home-timeline__next::before { border-style: dashed !important; } }

/* ================================================================== take part */
.takepart__list {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 15rem), 1fr));
  gap: 0;
  margin: 0;
  padding: 0;
  list-style: none;
  border-top: var(--rule-heavy) solid var(--fg);
}
.takepart__item {
  display: flex;
  flex-direction: column;
  gap: var(--s-3);
  padding: var(--s-5) var(--s-4) var(--s-5) 0;
  border-bottom: var(--rule) solid var(--rule-color);
}
@media (min-width: 48rem) {
  .takepart__item { padding-left: var(--s-4); border-left: var(--rule) solid var(--rule-color); }
}
.takepart__item p { margin: 0; color: var(--fg-muted); max-width: 22rem; }
.takepart__item .btn { align-self: flex-start; margin-top: auto; }
.takepart__verb { margin: 0; font-size: var(--display-3); line-height: 0.88; }
.takepart__item--main .takepart__verb { color: var(--red-300); }
.takepart .counter { max-width: none; border-top-width: var(--rule); }

/* ================================================================== dossier: plant */
.status--approved { --status: var(--lime-500); }
.status--stopped { --status: #7A7A7A; }
.status--unknown { --status: #B5B0A3; }
.dossier-meta {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: var(--s-2) var(--s-5);
  margin: 0 0 var(--s-5);
  font-family: var(--font-mono);
  font-size: var(--text-xs);
  color: var(--fg-muted);
}
.facts-table td .redact { margin-right: var(--s-2); }
.facts-table__alarm { color: var(--red-700); font-weight: 650; }
.receptors-table__m .cite { font-size: var(--text-xs); }
.facts-table__unknown-text { display: block; margin-top: var(--s-1); font-size: var(--text-sm); color: var(--fg-muted); }
.receptors-table { width: 100%; margin: 0 0 var(--s-6); border-collapse: collapse; border-top: 2px solid var(--fg); }
.receptors-table th,
.receptors-table td { padding: 0.6rem 0.75rem 0.5rem 0; border-bottom: var(--rule) solid var(--rule-color); text-align: left; vertical-align: baseline; }
.receptors-table thead th { font-family: var(--font-mono); font-size: var(--text-xs); font-weight: 400; text-transform: uppercase; letter-spacing: 0.04em; color: var(--fg-muted); }
.receptors-table__m {
  font-family: var(--font-display);
  font-weight: 900;
  font-stretch: var(--display-stretch);
  font-size: var(--display-4);
  white-space: nowrap;
}
.receptors-table__kind { display: block; font-family: var(--font-mono); font-size: var(--text-xs); color: var(--fg-muted); }
.unknowns { margin: 0 0 var(--s-6); padding: var(--s-5) var(--s-4); border: 2px dashed var(--ink-900); background: var(--paper-50); }
.unknowns h2 { margin-top: 0; }
.unknowns ul { margin: 0 0 var(--s-5); padding-left: 1.25rem; }
.unknowns ul > li { margin-bottom: var(--s-2); max-width: var(--measure); }
.unknowns ul > li::marker { color: var(--red-700); }
.lada { display: grid; gap: var(--s-3); padding-top: var(--s-4); border-top: var(--rule) solid var(--rule-color); }
.lada p { margin: 0; }
.dossier-summary { max-width: var(--measure); font-size: var(--text-md); line-height: var(--ruling); }

/* plant list (/projetos) */
.plant-counts {
  display: flex;
  flex-wrap: wrap;
  gap: var(--s-2) var(--s-5);
  margin: 0 0 var(--s-6);
  padding: 0;
  list-style: none;
}
.plant-counts li { display: flex; align-items: baseline; gap: var(--s-2); }
.plant-counts strong { font-family: var(--font-display); font-weight: 900; font-stretch: var(--display-stretch); font-size: var(--display-4); }
.plant-list { width: 100%; margin: 0 0 var(--s-6); border-collapse: collapse; border-top: 2px solid var(--fg); }
.plant-list th,
.plant-list td { padding: 0.7rem 0.75rem 0.6rem 0; border-bottom: var(--rule) solid var(--rule-color); text-align: left; vertical-align: baseline; }
.plant-list thead th { font-family: var(--font-mono); font-size: var(--text-xs); font-weight: 400; text-transform: uppercase; letter-spacing: 0.04em; color: var(--fg-muted); }
.plant-list__name a { font-weight: 650; }
.plant-list__where { font-size: var(--text-sm); color: var(--fg-muted); }
.plant-list__featured td { background: var(--paper-50); }
@media (max-width: 47.99rem) {
  .plant-list thead { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); }
  .plant-list tr { display: grid; padding: var(--s-3) 0; border-bottom: var(--rule) solid var(--rule-color); }
  .plant-list td { padding: 0 0 var(--s-1); border: 0; }
}

/* ================================================================== evidence pages */
.risk-index { display: grid; gap: 0; margin: 0 0 var(--s-6); padding: 0; list-style: none; border-top: 2px solid var(--fg); }
.risk-index > li { display: grid; grid-template-columns: 2.6rem minmax(0, 1fr); gap: var(--s-1) var(--s-4); padding: var(--s-4) 0; border-bottom: var(--rule) solid var(--rule-color); }
.risk-index .icon { width: 2.2rem; height: 2.2rem; color: var(--red-700); grid-row: span 3; }
.risk-index h2 { margin: 0; font-size: var(--display-4); }
.risk-index h2 a { color: inherit; text-decoration: none; }
.risk-index h2 a:hover { text-decoration: underline; }
.risk-index p { margin: 0; max-width: var(--measure); }
.risk-index__claim { font-family: var(--font-mono); font-size: var(--text-xs); text-transform: uppercase; letter-spacing: 0.04em; color: var(--fg-muted); }
.risk-head-icon .icon { width: 3.5rem; height: 3.5rem; color: var(--red-700); }
.risk-nav { display: flex; flex-wrap: wrap; gap: var(--s-2); margin: var(--s-7) 0 0; padding: 0; list-style: none; }
.risk-nav a {
  display: inline-flex;
  align-items: center;
  gap: var(--s-2);
  min-height: 2.75rem;
  padding: 0 var(--s-3);
  border: 1px solid var(--fg);
  color: var(--fg);
  font-family: var(--font-mono);
  font-size: var(--text-xs);
  font-weight: 600;
  text-decoration: none;
}
.risk-nav a[aria-current="page"] { background: var(--fg); color: var(--bg); }
.risk-nav .icon { width: 1.1rem; height: 1.1rem; }

.incident-list { margin: 0 0 var(--s-6); padding: 0; list-style: none; border-top: 2px solid var(--fg); }
.incident {
  display: grid;
  gap: var(--s-1) var(--s-5);
  padding: var(--s-4) 0;
  border-bottom: var(--rule) solid var(--rule-color);
}
@media (min-width: 48rem) { .incident { grid-template-columns: 9rem minmax(0, 1fr); } }
.incident__when { font-family: var(--font-mono); font-size: var(--text-xs); font-weight: 600; color: var(--accent); }
.incident__where { display: block; font-family: var(--font-mono); font-size: var(--text-xs); color: var(--fg-muted); }
.incident__type { margin: 0 0 var(--s-1); font-family: var(--font-mono); font-size: var(--text-xs); text-transform: uppercase; letter-spacing: 0.04em; }
.incident__summary { margin: 0 0 var(--s-1); max-width: var(--measure); }
.incident__consequences { margin: 0; max-width: var(--measure); font-weight: 650; }
.incident__conf { margin-top: var(--s-2); }

.qa { margin: 0 0 var(--s-6); border-top: 2px solid var(--fg); }
.qa details { border-bottom: var(--rule) solid var(--rule-color); }
.qa summary {
  display: flex;
  justify-content: space-between;
  gap: var(--s-4);
  padding: var(--s-4) 0;
  cursor: pointer;
  list-style: none;
  font-family: var(--font-serif);
  font-size: var(--text-md);
  font-weight: 650;
  line-height: 1.3;
}
.qa summary::-webkit-details-marker { display: none; }
.qa summary .icon { flex: none; width: 1.3rem; height: 1.3rem; margin-top: 0.2rem; transition: transform var(--dur) var(--ease-out); }
.qa details[open] summary .icon { transform: rotate(180deg); }
.qa__answer { max-width: var(--measure); padding: 0 0 var(--s-5); }
.qa__answer > * { margin: 0 0 var(--s-3); }
.qa__answer > :last-child { margin-bottom: 0; }
.home-faq .qa { margin-bottom: var(--s-5); }
.qa--otherside summary { font-style: italic; }

.news-list { margin: 0 0 var(--s-6); padding: 0; list-style: none; border-top: 2px solid var(--fg); }
.news-list > li { padding: var(--s-4) 0; border-bottom: var(--rule) solid var(--rule-color); }
.news-list h2 { margin: 0 0 var(--s-2); font-size: var(--display-4); }
.news-list h2 a { color: inherit; text-decoration: none; }
.news-list h2 a:hover { text-decoration: underline; }
.news-list p { margin: 0; max-width: var(--measure); }
.news-date { display: block; margin-bottom: var(--s-2); font-family: var(--font-mono); font-size: var(--text-xs); font-weight: 600; color: var(--accent); }

/* agenda (poster) */
.agenda-list { margin: 0 0 var(--s-6); padding: 0; list-style: none; border-top: var(--rule-heavy) solid var(--fg); }
.agenda-list > li { display: grid; gap: var(--s-2) var(--s-5); padding: var(--s-4) 0; border-bottom: var(--rule) solid var(--rule-color); }
@media (min-width: 48rem) { .agenda-list > li { grid-template-columns: 10rem minmax(0, 1fr); } }
.agenda-list time { font-family: var(--font-display); font-weight: 900; font-stretch: var(--display-stretch); font-size: var(--display-4); line-height: 1; }
.agenda-empty {
  display: grid;
  gap: var(--s-4);
  max-width: 44rem;
  margin: 0 0 var(--s-7);
  padding: var(--s-5);
  border: var(--rule-heavy) dashed var(--fg);
}
.agenda-empty p { margin: 0; font-size: var(--text-md); }
.agenda-empty .icon { width: 2.5rem; height: 2.5rem; color: var(--accent); }

/* methodology / privacy / letter */
.prose table { width: 100%; margin: 0 0 var(--ruling); border-collapse: collapse; border-top: 2px solid var(--fg); font-size: var(--text-sm); }
.prose th,
.prose td { padding: 0.5rem 0.75rem 0.45rem 0; border-bottom: var(--rule) solid var(--rule-color); text-align: left; vertical-align: top; }
.prose th { font-family: var(--font-mono); font-size: var(--text-xs); font-weight: 600; text-transform: uppercase; letter-spacing: 0.03em; }
.prose code {
  display: block;
  overflow-x: auto;
  padding: var(--s-3);
  background: var(--paper-50);
  border-left: 3px solid var(--ink-900);
  font-family: var(--font-mono);
  font-size: var(--text-sm);
  white-space: pre;
}
.prose-wide { max-width: 52rem; }
.table-scroll { position: relative; overflow-x: auto; } /* relative: keeps absolutely positioned .sr-only text inside the scroller */
.disclaimer {
  max-width: var(--measure);
  margin: var(--s-4) 0 var(--s-6);
  padding: var(--s-4);
  border: 2px solid var(--ink-900);
  font-weight: 650;
}
.param-table { width: 100%; margin: 0 0 var(--s-5); border-collapse: collapse; border-top: 2px solid var(--fg); font-size: var(--text-sm); }
.param-table th,
.param-table td { padding: 0.55rem 0.75rem 0.5rem 0; border-bottom: var(--rule) solid var(--rule-color); text-align: left; vertical-align: baseline; }
.param-table th { font-family: var(--font-mono); font-size: var(--text-xs); font-weight: 400; text-transform: uppercase; color: var(--fg-muted); }
.param-table td:first-child { font-family: var(--font-mono); font-weight: 600; white-space: nowrap; }
.letter {
  max-width: 40rem;
  margin: 0 0 var(--s-6);
  padding: var(--s-6) var(--s-5);
  background: var(--paper-50);
  border: 1px solid var(--paper-300);
  border-top: 5px solid var(--red-600);
}
.letter > p:first-child { font-family: var(--font-display); font-weight: 900; font-stretch: var(--display-stretch); font-size: var(--display-4); text-transform: uppercase; }
.letter ol { padding-left: 1.4rem; }
.letter li { margin-bottom: var(--s-3); }
.editor-note { max-width: var(--measure); padding: var(--s-3) var(--s-4); border-left: 4px solid var(--ink-900); background: var(--paper-50); font-size: var(--text-sm); }

/* section spacing on dossier pages */
.dossier-section { margin-top: var(--s-7); }
.dossier-section > h2 { margin-bottom: var(--s-4); }
.page-actions { display: flex; flex-wrap: wrap; gap: var(--s-3) var(--s-5); align-items: center; margin: var(--s-6) 0; }

/* long-form text inside evidence pages: smaller section heads than page titles */
.dossier .prose h2 { font-size: var(--display-4); margin-top: var(--s-6); }
.dossier .prose h3 { font-size: var(--text-md); font-family: var(--font-serif); text-transform: none; font-weight: 650; }
.dossier .dossier__lede + .prose { margin-top: var(--s-5); }

/* long button labels wrap on narrow screens instead of overflowing */
@media (max-width: 47.99rem) {
  .dossier .btn,
  .takepart .btn,
  .home-faq .btn,
  .home-risks__foot .btn,
  .page-actions .btn,
  .agenda-empty .btn,
  .band .poster-hero__actions .btn { max-width: 100%; white-space: normal; text-align: left; overflow-wrap: anywhere; }
}
@media (max-width: 47.99rem) {
  .prose table { display: block; overflow-x: auto; }
}

/* ================================================================== noise and traffic (Task 7)
   Home band "10 cargas por dia" and /ruido-e-trafego: three numbers (_NoiseFigures), the traffic animation map with its
   live readout (_TrafficAnim, traffic-band.js), the plain statement of the default case, the body sections. */
.noise-flag { color: var(--flag); font-weight: 600; }
.home-split__lede > p,
.poster-hero__lede > p { margin: 0; }
.home-traffic .datagrid,
.noise-hero .datagrid { margin-bottom: var(--s-5); }
.noise-figs .datagrid__n .noise-flag,
.home-split__title .noise-flag { font-size: 0.45em; vertical-align: super; }
.noise-figs .datagrid__l { max-width: 26rem; }
.noise-honest {
  display: grid;
  gap: var(--s-2);
  max-width: 44rem;
  margin: 0;
  font-size: var(--text-md);
  line-height: 1.45;
}
.noise-honest > span { display: block; }
.noise-honest .noise-flag { font-size: 0.8em; }

.traffic-anim { display: grid; gap: var(--s-3); margin: var(--s-4) 0 var(--s-3); min-width: 0; }
.traffic-anim__label { margin: 0; font-family: var(--font-mono); font-size: var(--text-xs); letter-spacing: 0.04em; text-transform: uppercase; color: var(--fg-muted); }
.map-slot--traffic { min-height: 20rem; }
@media (min-width: 62rem) { .map-slot--traffic { min-height: 28rem; } }
.map-slot--traffic.movap-map { --map-h: clamp(20rem, 56vh, 30rem); }
.traffic-readout { display: grid; gap: var(--s-2); font-size: var(--text-sm); }
.traffic-readout p { margin: 0; }
.traffic-readout__clock { display: flex; flex-wrap: wrap; align-items: baseline; gap: var(--s-2) var(--s-3); font-family: var(--font-mono); }
.traffic-readout__label { color: var(--fg-muted); font-size: var(--text-xs); }
.traffic-readout__time { font-family: var(--font-display); font-size: var(--text-lg); font-weight: 800; font-variant-numeric: tabular-nums; }
.traffic-readout__ff { color: var(--flag); font-size: var(--text-xs); }
.traffic-readout__ff[hidden],
.traffic-readout__static[hidden] { display: none; }
.traffic-readout__counts { display: flex; flex-wrap: wrap; gap: var(--s-1) var(--s-5); margin: 0; padding: 0; list-style: none; font-family: var(--font-mono); font-size: var(--text-xs); font-variant-numeric: tabular-nums; }
.traffic-readout__caption,
.traffic-readout__halo { color: var(--fg-muted); }
.traffic-readout__swatch { display: inline-block; margin-right: var(--s-2); vertical-align: -0.2em; width: 1.1rem; height: 1.1rem; border: 1.5px solid var(--red-300); border-radius: 50%; background: rgb(227 6 19 / 0.15); }

.noise-hero__foot { display: grid; gap: var(--s-3); }
.noise-hero__caveat { max-width: 44rem; margin: 0; font-size: var(--text-sm); color: var(--fg-muted); }
.home-traffic__links { margin-top: var(--s-4); }
.home-traffic__links .icon { width: 1.1em; height: 1.1em; vertical-align: -0.15em; }

.noise-body .prose > section + section { margin-top: var(--s-7); }
.noise-body .prose h2 { font-size: var(--display-4); margin: 0 0 var(--s-4); }
.noise-plants th[scope="row"] { font-family: var(--font-serif); font-size: var(--text-sm); font-weight: 650; text-transform: none; letter-spacing: 0; }
.noise-plants__note { font-weight: 400; color: var(--fg-muted); }
.noise-worked { padding-left: 1.1rem; max-width: 52rem; font-size: var(--text-sm); }
.noise-worked li + li { margin-top: var(--s-1); }
.param-note { color: var(--fg-muted); font-family: var(--font-serif); font-weight: 400; }
.param-table--wrap td:first-child { white-space: normal; min-width: 9rem; }
/* Metodologia #agua (water spec §5; Task 7): the formulas wrap on phones (each is its own block), the inputs table lists
   one plant type per line, the three scenarios read as numbers, the assumptions as a numbered list. */
.water-formulas code { white-space: pre-wrap; overflow-wrap: anywhere; }
.water-inputs__line { display: block; }
.water-inputs__line + .param-note { display: block; margin-top: var(--s-1); }
.water-worked th[scope="row"] { min-width: 6.5rem; font-family: var(--font-serif); font-size: var(--text-sm); font-weight: 400; text-transform: none; letter-spacing: 0; color: var(--fg); }
.water-worked thead th[data-type] { text-align: right; letter-spacing: 0; hyphens: auto; }
.water-worked :is(th, td):not(:first-child) { padding-left: 0.4rem; padding-right: 0; }
@media (min-width: 48rem) { .water-worked th[scope="row"] { min-width: 14rem; } }
.water-worked td { text-align: right; white-space: nowrap; font-variant-numeric: tabular-nums; }
.water-worked tr[data-row="pctRecharge1km"] td,
.water-worked tr[data-row="pctRecharge1kmSensitivity"] td { font-weight: 650; }
.water-sensitivity,
.water-rainyears { max-width: 52rem; }
.water-decisions li + li { margin-top: var(--s-2); }
.water-assumptions { max-width: 52rem; padding-left: 1.6rem; font-size: var(--text-sm); }
.water-assumptions li + li { margin-top: var(--s-1); }
