:root {
  /* Paleta corporativa (Guia d'Estils, igual que eleccions): vermell #DA291C i el seu to fosc */
  --color-red: #da291c;
  --color-primary: #901b13;
  --color-text: #1f1f1f;
  --color-muted: #5a5a5a;
  --color-bg: #ffffff;
  --color-surface: #f5f3f0;
  --radius: 6px;
  --gutter: 16px;
}

*, *::before, *::after { box-sizing: border-box; }

html { font-size: 100%; }

body {
  margin: 0;
  font-family: system-ui, -apple-system, "Segoe UI", Roboto, Arial, sans-serif;
  line-height: 1.5;
  color: var(--color-text);
  background: var(--color-bg);
  overflow-wrap: anywhere;
}

.container {
  max-width: 1200px;
  margin: 0 auto;
  padding: 0 var(--gutter);
}

.skip-link {
  position: absolute;
  left: -9999px;
}
.skip-link:focus {
  left: var(--gutter);
  top: var(--gutter);
  background: var(--color-bg);
  padding: .5rem 1rem;
  z-index: 10;
}

.site-header { background: var(--color-bg); box-shadow: 0 1px 4px rgba(30, 0, 8, .12); }
.site-header__top {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  flex-wrap: wrap;
  padding-top: 1rem;
  padding-bottom: .75rem;
}
.site-header__brand { display: flex; align-items: center; gap: .75rem; text-decoration: none; }
.site-header__brand:focus-visible { outline: 3px solid var(--color-primary); outline-offset: 2px; }
.site-header__shield img { display: block; height: 42px; width: auto; }
.site-header__titles { display: flex; flex-direction: column; }
.site-header__title { font-weight: 700; font-size: 1.25rem; color: var(--color-primary); }
.site-header__subtitle { font-size: .9rem; color: var(--color-muted); }
.site-header__opendata { margin: 0; text-align: right; font-size: .85rem; color: var(--color-muted); line-height: 1.3; }
.site-header__bar { height: 4px; background: var(--color-red); }
a:focus-visible { outline: 3px solid var(--color-primary); outline-offset: 2px; }

main { padding: 2rem var(--gutter); min-height: 60vh; }
h1 { font-size: clamp(1.5rem, 4vw, 2.25rem); margin-top: 0; }
.lead { font-size: 1.125rem; }
.notice {
  background: var(--color-surface);
  border-left: 4px solid var(--color-red);
  padding: 1rem;
  border-radius: var(--radius);
}

.site-footer {
  background: var(--color-surface);
  padding: 1.5rem 0;
  font-size: .875rem;
  color: var(--color-muted);
}
.site-footer a { color: var(--color-primary); }
.version { margin: 0; }

@media (max-width: 600px) {
  .site-header__opendata { display: none; }
}

/* ---- Fase 2: catàleg i fitxa ---- */
h2 { font-size: clamp(1.2rem, 3vw, 1.5rem); margin-top: 2rem; }
a { color: var(--color-primary); }
.notice--warning { border-left-color: #b35c00; background: #fff4e5; }

.cards {
  list-style: none; margin: 0; padding: 0;
  display: grid; gap: 1rem;
  grid-template-columns: repeat(auto-fill, minmax(min(100%, 220px), 1fr));
}
.card__link {
  display: flex; flex-direction: column; gap: .5rem; height: 100%;
  padding: 1.25rem; border: 1px solid #e0dcd6; border-radius: var(--radius);
  background: var(--color-surface); text-decoration: none; color: var(--color-text);
}
.card__link:hover { border-color: var(--color-red); }
.card__link:focus-visible { outline: 3px solid var(--color-primary); outline-offset: 2px; }
.card__icon { width: 40px; height: 40px; }
.card__title { font-weight: 700; font-size: 1.1rem; color: var(--color-primary); }
.card__meta { color: var(--color-muted); font-size: .9rem; }

.breadcrumb ol { list-style: none; margin: 0 0 1rem; padding: 0; display: flex; flex-wrap: wrap; gap: .25rem; font-size: .9rem; }
.breadcrumb li + li::before { content: "›"; margin-right: .25rem; color: var(--color-muted); }
.with-icon { display: flex; align-items: center; gap: .75rem; }

.dataset-list { list-style: none; margin: 0; padding: 0; }
.dataset-list li { border-bottom: 1px solid #e0dcd6; padding: 1rem 0; }
.dataset-list h2 { margin: 0 0 .25rem; font-size: 1.2rem; }
.dataset-list p { margin: 0; }

.version-form { display: flex; flex-wrap: wrap; align-items: center; gap: .5rem; margin: 1rem 0; }
.version-form select, .version-form button, .button { font: inherit; }
.fitxa { background: var(--color-surface); border-radius: var(--radius); padding: 1rem 1.25rem; margin-top: 1.5rem; }
.fitxa h2 { margin-top: 0; }
.fitxa__dl { display: grid; gap: .75rem 1.5rem; grid-template-columns: repeat(auto-fill, minmax(min(100%, 180px), 1fr)); margin: 0; }
.fitxa__dl dt { font-size: .85rem; color: var(--color-muted); }
.fitxa__dl dd { margin: 0; font-weight: 600; }
.downloads { display: flex; flex-wrap: wrap; gap: .75rem; margin: 1.25rem 0 0; }
.button, .version-form button {
  display: inline-block; padding: .6rem 1rem; border-radius: var(--radius); border: 2px solid var(--color-primary);
  background: var(--color-primary); color: #fff; text-decoration: none; cursor: pointer;
}
.button--secondary { background: #fff; color: var(--color-primary); }
.button:focus-visible, .version-form button:focus-visible, select:focus-visible { outline: 3px solid var(--color-red); outline-offset: 2px; }

/* Les taules amples fan scroll dins la seva caixa, mai la pàgina (RF5.1, CA4) */
.table-wrap { max-width: 100%; overflow-x: auto; border: 1px solid #e0dcd6; border-radius: var(--radius); }
.table-wrap:focus-visible { outline: 3px solid var(--color-primary); }
.table { border-collapse: collapse; width: 100%; font-size: .9rem; }
.table th, .table td { text-align: left; vertical-align: top; padding: .5rem .75rem; border-bottom: 1px solid #ece8e2; overflow-wrap: normal; word-break: normal; }
.table[data-field="structure"] { min-width: 44rem; }
.table[data-field="structure"] td:nth-child(2), .table[data-field="structure"] td:last-child { min-width: 12rem; max-width: 22rem; overflow-wrap: anywhere; }
.table thead th { background: var(--color-surface); position: sticky; top: 0; }
.table .num { text-align: right; white-space: nowrap; }
.table--preview td, .table--preview th { white-space: nowrap; max-width: 28rem; overflow: hidden; text-overflow: ellipsis; overflow-wrap: normal; }
.table code { font-size: .85rem; overflow-wrap: normal; }

.pagination ul { list-style: none; display: flex; flex-wrap: wrap; gap: .5rem; padding: 0; margin: 1rem 0; }
.pagination a, .pagination span { display: inline-block; min-width: 2.5rem; padding: .4rem .6rem; text-align: center; border: 1px solid #e0dcd6; border-radius: var(--radius); }
.pagination span[aria-current] { background: var(--color-primary); color: #fff; border-color: var(--color-primary); }
main.container { padding-top: 1.5rem; padding-bottom: 2.5rem; }

/* ---- Fase 2b: explorador de dades ---- */
.explorer { margin: 1rem 0; }
.explorer__search { display: flex; flex-wrap: wrap; gap: .5rem; align-items: center; }
.explorer__search label { flex-basis: 100%; font-weight: 600; }
.explorer__search input { flex: 1 1 14rem; min-width: 0; font: inherit; padding: .55rem .75rem; border: 1px solid #b8b2aa; border-radius: var(--radius); }
.explorer button { font: inherit; padding: .55rem 1rem; border-radius: var(--radius); border: 2px solid var(--color-primary); background: var(--color-primary); color: #fff; cursor: pointer; }
.explorer button:focus-visible, .explorer input:focus-visible, .explorer summary:focus-visible { outline: 3px solid var(--color-red); outline-offset: 2px; }
.explorer__group { font-size: 1rem; margin: 1.25rem 0 .5rem; color: var(--color-text); }
.explorer__grid { display: grid; gap: 1rem; align-items: start; grid-template-columns: repeat(auto-fill, minmax(min(100%, 17rem), 1fr)); }

/* Cada filtre: capçalera amb el títol llegible (descripció de la columna) i el codi en petit */
.filter { border: 1px solid #d9d3cb; border-radius: var(--radius); background: #fff; padding: 0; margin: 0; min-width: 0; overflow: hidden; }
.filter__head { float: left; width: 100%; padding: .6rem .85rem; margin: 0; background: #ece7e0; border-left: 4px solid var(--color-primary); display: flex; flex-direction: column; gap: .1rem; }
.filter__head + * { clear: both; }
.filter__title { font-weight: 700; font-size: .95rem; line-height: 1.3; color: var(--color-primary); overflow-wrap: anywhere; }
.filter__code { font-size: .75rem; color: var(--color-muted); overflow-wrap: anywhere; }
.filter--active { border-color: var(--color-primary); box-shadow: 0 0 0 1px var(--color-primary); }
.filter--active .filter__head { background: #f8e3df; border-left-color: var(--color-red); }
.filter__body { padding: .6rem .85rem .8rem; }

.filter__options { max-height: 13rem; overflow-y: auto; display: flex; flex-direction: column; }
.filter .filter__option { display: flex; flex-direction: row; align-items: center; gap: .5rem; padding: .3rem .25rem; border-bottom: 1px solid #f0ece6; font-size: .9rem; cursor: pointer; }
.filter .filter__option[hidden] { display: none; }  /* el buscador de filtres amaga opcions */
.filter .filter__option:last-child { border-bottom: 0; }
.filter .filter__option:hover { background: var(--color-surface); }
.filter__option input { flex: none; width: 1.05rem; height: 1.05rem; accent-color: var(--color-primary); }
.filter__value { flex: 1; min-width: 0; line-height: 1.3; }
.filter__count { flex: none; min-width: 2.2rem; text-align: center; font-size: .75rem; font-variant-numeric: tabular-nums; padding: .05rem .45rem; border-radius: 999px; background: #ece7e0; color: var(--color-text); }
.filter__option--selected .filter__value { font-weight: 700; }
.filter__option--selected .filter__count { background: var(--color-primary); color: #fff; }
.filter__option--empty { color: var(--color-muted); cursor: default; }

.filter__range { display: flex; flex-wrap: wrap; gap: .6rem; }
.filter__range label, .filter__contains { font-size: .85rem; color: var(--color-muted); display: flex; flex-direction: column; gap: .25rem; flex: 1 1 6.5rem; min-width: 0; }
.filter input[type=text], .filter input[type=date] { font: inherit; color: var(--color-text); padding: .4rem .55rem; border: 1px solid #b8b2aa; border-radius: var(--radius); min-width: 0; width: 100%; }
.explorer__actions { margin: 1rem 0 0; }
.explorer__status { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: center; gap: .5rem 1rem; margin: 1rem 0 .5rem; }
.explorer__status p { margin: 0; }
.explorer__links { display: flex; flex-wrap: wrap; gap: .5rem 1rem; align-items: center; }
.explorer__license { font-size: .8rem; color: var(--color-muted); }
.sort-link { color: inherit; text-decoration: none; }
.sort-link:hover, .sort-link:focus-visible { text-decoration: underline; }
.pagination__gap { border: 0 !important; }

/* ---- Acordió comú (v0.2.3): Estructura i Filtres, plegats d'entrada ---- */
.accordion { margin-top: 1.5rem; border: 1px solid #d9d3cb; border-radius: var(--radius); background: var(--color-surface); }
.explorer .accordion { margin-top: 1rem; }
.accordion__summary { list-style: none; cursor: pointer; display: flex; flex-wrap: wrap; align-items: baseline; gap: .25rem 1rem; padding: .85rem 1rem .85rem 2.4rem; position: relative; border-radius: var(--radius); }
.accordion__summary::-webkit-details-marker { display: none; }
.accordion__summary::before { content: ""; position: absolute; left: 1rem; top: 1.2rem; width: .55rem; height: .55rem; border-right: 2px solid var(--color-primary); border-bottom: 2px solid var(--color-primary); transform: rotate(-45deg); transition: transform .15s ease; }
.accordion[open] > .accordion__summary::before { transform: rotate(45deg); top: 1.05rem; }
.accordion__summary:hover { background: #ece7e0; }
.accordion__summary:focus-visible { outline: 3px solid var(--color-red); outline-offset: 2px; }
.accordion__title { margin: 0; font-size: 1.1rem; font-weight: 700; color: var(--color-text); }
.accordion__meta { font-size: .85rem; color: var(--color-muted); }
.accordion__meta--active { color: #fff; background: var(--color-primary); padding: .05rem .6rem; border-radius: 999px; font-size: .8rem; }
.accordion__body { padding: 0 1rem 1rem; }
.accordion__body > .table-wrap { background: #fff; }
@media (prefers-reduced-motion: reduce) { .accordion__summary::before { transition: none; } }

/* ---- Fase 3: quadre de comandament ---- */
.button--small { padding: .35rem .75rem; font-size: .9rem; }
.quadre-toolbar { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: .5rem 1rem; }
.quadre-toolbar__status { margin: 0; color: var(--color-muted); font-size: .9rem; min-height: 1.4em; }
button.button--secondary[disabled] { opacity: .6; cursor: progress; }
.quadre-dates { display: flex; flex-wrap: wrap; gap: .25rem 1.75rem; margin: 1.25rem 0 .5rem; padding: .75rem 1rem; border-left: 4px solid var(--color-primary); background: var(--color-surface); border-radius: var(--radius); }
.quadre-dates p { margin: 0; }
.quadre-dates__label { color: var(--color-muted); font-size: .9rem; }

.kpis { display: grid; gap: 1rem; margin: 1.25rem 0; grid-template-columns: repeat(auto-fill, minmax(min(100%, 12.5rem), 1fr)); }
.kpi { border: 1px solid #d9d3cb; border-radius: var(--radius); padding: .9rem 1rem; background: #fff; }
.kpi__label { margin: 0; font-size: .85rem; color: var(--color-muted); font-weight: 600; }
.kpi__value { margin: .25rem 0 0; font-size: 2rem; font-weight: 700; line-height: 1.1; color: var(--color-text); font-variant-numeric: tabular-nums; }
.kpi__hint { margin: .35rem 0 0; font-size: .78rem; color: var(--color-muted); line-height: 1.35; }

.charts { display: grid; gap: 1rem; grid-template-columns: repeat(auto-fill, minmax(min(100%, 26rem), 1fr)); }
.chart-card { border: 1px solid #d9d3cb; border-radius: var(--radius); background: #fff; padding: 1rem; min-width: 0; }
.chart-card--wide { grid-column: 1 / -1; }
.chart-card__title { font-size: 1.05rem; margin: 0 0 .5rem; }
.chart { width: 100%; height: 320px; }
.chart--short { height: 40px; margin-top: .5rem; }
.chart-card__foot { margin: .5rem 0 0; font-size: .78rem; color: var(--color-muted); }
.accordion--small { margin-top: .75rem; background: #fff; }
.accordion--small .accordion__summary { padding-top: .5rem; padding-bottom: .5rem; }
.accordion--small .accordion__summary::before { top: .85rem; }
.accordion--small[open] > .accordion__summary::before { top: .7rem; }
.accordion--small .accordion__title { font-size: .9rem; font-weight: 600; }
.table--compact th, .table--compact td { padding: .35rem .6rem; font-size: .85rem; }
.g6 { display: flex; flex-wrap: wrap; gap: 1.5rem; }
.g6__item { margin: 0; display: flex; flex-direction: column; }
.g6__value { font-size: 1.75rem; font-weight: 700; font-variant-numeric: tabular-nums; }
.g6__label { font-size: .85rem; color: var(--color-muted); }
.quadre-filtres .filter select { font: inherit; padding: .35rem .5rem; border: 1px solid #b8b2aa; border-radius: var(--radius); background: #fff; width: 100%; }
.filter__finder { margin-bottom: .5rem; }
[aria-busy="true"] { opacity: .6; transition: opacity .15s; }
@media (prefers-reduced-motion: reduce) { [aria-busy="true"] { transition: none; } }
/* Tooltips dels gràfics (sense estils en línia per la CSP) */
.tt-box { font-size: .85rem !important; color: var(--color-text) !important; }
.tt { min-width: 8rem; }
.tt__title { margin: 0 0 .3rem; font-weight: 700; white-space: normal; max-width: 18rem; }
.tt__row { margin: .1rem 0; display: flex; align-items: center; gap: .4rem; }
.tt__name { flex: 1; }
.tt__dot { width: .65rem; height: .65rem; border-radius: 50%; display: inline-block; flex: none; }
.tt__dot--0 { background: #2a78d6; } .tt__dot--1 { background: #eb6834; } .tt__dot--2 { background: #1baf7a; }
.tt__dot--3 { background: #eda100; } .tt__dot--4 { background: #e87ba4; } .tt__dot--5 { background: #008300; }
.tt__dot--6 { background: #4a3aa7; } .tt__dot--7 { background: #e34948; }
.g6__hidden { margin: 0; color: var(--color-muted); }

/* ---- Redisseny R1: capçalera amb menú, portada, catàleg, indicadors i temes ---- */
.visually-hidden { position: absolute !important; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0; }
.site-header__top { padding-top: .6rem; padding-bottom: .55rem; }
.site-nav ul { list-style: none; margin: 0; padding: 0; display: flex; gap: .25rem; }
.site-nav a { display: block; padding: .45rem .9rem; border-radius: 999px; color: var(--color-text); text-decoration: none; font-weight: 600; font-size: .95rem; }
.site-nav a:hover { background: var(--color-surface); }
.site-nav a[aria-current="page"] { background: #f8e3df; color: var(--color-primary); }
.site-nav a:focus-visible { outline: 3px solid var(--color-primary); outline-offset: 2px; }
.site-nav--narrow { display: none; }
@media (max-width: 720px) {
  .site-nav--wide { display: none; }
  .site-nav--narrow { display: block; margin-left: auto; position: relative; }
  .site-nav--narrow summary { list-style: none; cursor: pointer; display: flex; align-items: center; gap: .4rem; padding: .45rem .8rem; border: 1px solid #d9d3cb; border-radius: var(--radius); font-weight: 600; }
  .site-nav--narrow summary::-webkit-details-marker { display: none; }
  .site-nav--narrow summary:focus-visible { outline: 3px solid var(--color-primary); outline-offset: 2px; }
  .site-nav--narrow nav { position: absolute; right: 0; top: calc(100% + .4rem); z-index: 20; background: #fff; border: 1px solid #d9d3cb; border-radius: var(--radius); box-shadow: 0 6px 18px rgba(0,0,0,.12); padding: .4rem; min-width: 12rem; }
  .site-nav--narrow ul { flex-direction: column; }
  .site-nav--narrow a { border-radius: var(--radius); }
}

.hero { background: var(--color-surface); border-radius: 10px; padding: clamp(1.25rem, 4vw, 2.25rem); display: flex; flex-direction: column; gap: .5rem; }
.hero h1 { margin: 0; }
.hero .lead { margin: 0 0 .5rem; color: var(--color-muted); }
.search { display: flex; align-items: center; gap: .5rem; position: relative; }
.search__icon { position: absolute; left: .85rem; pointer-events: none; }
.search input[type=search] { flex: 1 1 auto; min-width: 0; font: inherit; font-size: 1.05rem; padding: .8rem .9rem .8rem 2.6rem; border: 1px solid #b8b2aa; border-radius: 10px; background: #fff; }
.search input[type=search]:focus-visible { outline: 3px solid var(--color-primary); outline-offset: 1px; }
.search button { font: inherit; font-weight: 600; padding: .8rem 1.2rem; border-radius: 10px; border: 2px solid var(--color-primary); background: var(--color-primary); color: #fff; cursor: pointer; }
.search button:focus-visible { outline: 3px solid var(--color-red); outline-offset: 2px; }

.section-title { font-size: 1.25rem; margin: 2rem 0 .75rem; }
.quick { list-style: none; margin: 0; padding: 0; display: grid; gap: 1rem; grid-template-columns: repeat(auto-fit, minmax(min(100%, 15rem), 1fr)); }
.quick__link { display: flex; flex-direction: column; gap: .35rem; height: 100%; padding: 1.1rem 1.2rem; border: 1px solid #d9d3cb; border-radius: 10px; background: #fff; text-decoration: none; color: var(--color-text); }
.quick__link:hover { border-color: var(--color-primary); }
.quick__link:focus-visible { outline: 3px solid var(--color-primary); outline-offset: 2px; }
.quick__title { font-weight: 700; font-size: 1.05rem; color: var(--color-primary); }
.quick__desc { font-size: .9rem; color: var(--color-muted); }

.kpis--home { grid-template-columns: repeat(auto-fill, minmax(min(100%, 15rem), 1fr)); }
.kpi--tile { display: flex; flex-direction: column; }
.kpi__tema { display: flex; align-items: center; gap: .35rem; margin: 0 0 .35rem; font-size: .78rem; color: var(--color-muted); }
.kpi__tema img { width: 16px; height: 16px; flex: none; opacity: .8; }
.home-rotacio { margin: .75rem 0 0; font-size: .88rem; color: var(--color-muted); }
.home-rotacio a { color: var(--color-primary); font-weight: 600; white-space: nowrap; }
.kpi__link { margin: .6rem 0 0; font-size: .88rem; font-weight: 600; }
.kpi__link a { color: var(--color-primary); }

.chip { display: inline-block; font-size: .78rem; padding: .12rem .6rem; border-radius: 999px; background: #ece7e0; color: var(--color-text); }
.chip--on { background: var(--color-primary); color: #fff; }
.ds-grid { display: grid; gap: 1rem; grid-template-columns: repeat(auto-fill, minmax(min(100%, 19rem), 1fr)); }
.ds-card { border: 1px solid #d9d3cb; border-radius: 10px; background: #fff; padding: 1rem 1.1rem; display: flex; flex-direction: column; gap: .4rem; }
.ds-card__cat { margin: 0; }
.ds-card__title { margin: 0; font-size: 1.05rem; line-height: 1.3; }
.ds-card__title a { color: var(--color-primary); text-decoration: none; }
.ds-card__title a:hover, .ds-card__title a:focus-visible { text-decoration: underline; }
.ds-card__desc { margin: 0; font-size: .9rem; color: var(--color-muted); }
.ds-card__meta { margin: auto 0 0; display: flex; flex-wrap: wrap; gap: .3rem .9rem; align-items: center; font-size: .82rem; color: var(--color-muted); }
.ds-card__visits30 { white-space: nowrap; }

.cataleg-form { display: flex; flex-direction: column; gap: .75rem; margin: 1rem 0; }
.chips { border: 0; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: .4rem; align-items: center; }
.chip-check { position: relative; }
.chip-check input { position: absolute; opacity: 0; width: 1px; height: 1px; }
.chip-check span { display: inline-block; padding: .35rem .8rem; border-radius: 999px; border: 1px solid #d9d3cb; background: #fff; font-size: .88rem; cursor: pointer; }
.chip-check input:checked + span { background: var(--color-primary); border-color: var(--color-primary); color: #fff; }
.chip-check input:focus-visible + span { outline: 3px solid var(--color-red); outline-offset: 2px; }
.cataleg-count { color: var(--color-muted); margin: .25rem 0 1rem; }

.panel { border: 1px solid #d9d3cb; border-radius: 10px; background: #fff; padding: 1.1rem 1.25rem; margin-top: 1rem; display: flex; flex-direction: column; gap: .6rem; }
.panel__title { margin: 0; font-size: 1.2rem; }
.panel .kpis { margin: .25rem 0; }
.panel__foot { display: flex; flex-wrap: wrap; gap: .5rem 1rem; align-items: center; justify-content: space-between; font-size: .88rem; color: var(--color-muted); }
.search button { white-space: nowrap; flex: none; }
.kpis--home { grid-template-columns: repeat(auto-fit, minmax(min(100%, 14rem), 1fr)); }
.ds-grid--fit { grid-template-columns: repeat(auto-fit, minmax(min(100%, 19rem), 1fr)); }
@media (max-width: 600px) {
  .quick__link { display: grid; grid-template-columns: auto 1fr; column-gap: .8rem; row-gap: .1rem; align-items: center; padding: .8rem 1rem; }
  .quick__link img { grid-row: span 2; }
  .kpis--home { grid-template-columns: 1fr; gap: .6rem; }
  .kpis--home .kpi { display: grid; grid-template-columns: minmax(0, 1fr) auto; column-gap: .75rem; padding: .7rem .9rem; }
  .kpis--home .kpi__tema, .kpis--home .kpi__label, .kpis--home .kpi__hint, .kpis--home .kpi__link { grid-column: 1; }
  .kpis--home .kpi__value { grid-column: 2; grid-row: 1 / span 4; align-self: center; margin: 0; font-size: 1.7rem; }
  .kpis--home .kpi__link { margin-top: .3rem; }
  .search input[type=search] { font-size: 1rem; }
}

/* ---------- R-embed: quadre incrustat en una altra web (/embed/*) i panell «Incrustar» ---------- */
.embed__body { background: #fff; }
.embed__main { padding: 12px var(--gutter) 16px; max-width: 1200px; margin: 0 auto; }
.embed__header { display: flex; flex-wrap: wrap; align-items: baseline; justify-content: space-between; gap: .25rem 1rem; border-bottom: 3px solid var(--color-red); padding-bottom: .5rem; margin-bottom: .75rem; }
.embed__title { font-size: clamp(1.15rem, 3.5vw, 1.5rem); margin: 0; }
.embed__owner { margin: 0; font-size: .85rem; color: var(--color-muted); }
.embed__main .quadre-filtres .accordion { margin-top: .75rem; }
.embed__main .quadre-dates { margin-top: .5rem; }
.embed__footer { display: flex; flex-wrap: wrap; align-items: center; gap: .5rem 1rem; margin-top: 1rem; padding-top: .75rem; border-top: 1px solid #e6e2dc; font-size: .85rem; color: var(--color-muted); }
.charts--single { grid-template-columns: 1fr; }
.incrustar__opcions { display: flex; flex-wrap: wrap; gap: .75rem 1.5rem; align-items: flex-end; margin: .75rem 0; }
.incrustar__camp { display: flex; flex-direction: column; gap: .25rem; font-weight: 600; max-width: 100%; }
.incrustar__camp select { max-width: 100%; padding: .35rem .5rem; font: inherit; font-weight: 400; }
.incrustar__check { display: flex; gap: .4rem; align-items: center; }
.incrustar__codi { margin: .75rem 0; }
.incrustar__codi label { display: block; font-weight: 600; margin-bottom: .25rem; }
.incrustar__codi textarea { display: block; width: 100%; font: .82rem/1.4 ui-monospace, SFMono-Regular, Menlo, Consolas, monospace; padding: .5rem; border: 1px solid #d9d3cb; border-radius: var(--radius); background: #fff; resize: vertical; margin-bottom: .4rem; }
.incrustar__nota { font-size: .88rem; color: var(--color-muted); }
.incrustar__peu { display: flex; flex-wrap: wrap; gap: .5rem 1rem; align-items: center; }

/* ---------- Q2: quadre del Padró ---------- */
.quadre-nota { font-size: .9rem; color: var(--color-muted); margin: -.25rem 0 1rem; max-width: 70rem; }
.table-note { font-size: .82rem; color: var(--color-muted); margin: .5rem 0 0; }
.kpis--6 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
@media (max-width: 329px) { .kpis--6 { grid-template-columns: 1fr; } }
@media (min-width: 900px) { .kpis--6 { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
@media (max-width: 899px) {
  .kpis--6 { gap: .6rem; }
  .kpis--6 .kpi { padding: .75rem; }
  .kpis--6 .kpi__value { font-size: clamp(1.35rem, 6.8vw, 2rem); white-space: nowrap; overflow-wrap: normal; }
  .kpis--6 .kpi__value--eur { font-size: clamp(1.05rem, 4.9vw, 2rem); }
  .kpis--6 .kpi__value--text { white-space: normal; overflow-wrap: anywhere; }
}
.kpi__value--text { font-size: 1.25rem; line-height: 1.25; }
.quadre-detall { display: flex; flex-wrap: wrap; align-items: center; gap: .5rem 1rem; margin: 1.5rem 0 0; padding: .9rem 1rem; border-radius: var(--radius); background: var(--color-surface); }

/* ---------- R2: catàleg (ordre, vista targetes/llista) ---------- */
.cataleg-tools { display: flex; flex-wrap: wrap; gap: .75rem 1.5rem; align-items: center; margin: .5rem 0 1rem; }
.segmented { display: inline-flex; flex-wrap: wrap; align-items: center; gap: .35rem; font-size: .9rem; }
.segmented__label { color: var(--color-muted); margin-right: .15rem; }
.segmented a { padding: .3rem .75rem; border: 1px solid #d9d3cb; border-radius: 999px; color: var(--color-text); text-decoration: none; background: #fff; }
.segmented a:hover { border-color: var(--color-primary); }
.segmented a[aria-current="true"] { background: var(--color-primary); border-color: var(--color-primary); color: #fff; }
.segmented a:focus-visible { outline: 3px solid var(--color-red); outline-offset: 2px; }
.ds-card__match, .ds-row__match { font-size: .85rem; color: var(--color-muted); margin: .25rem 0 0; }
.ds-list { list-style: none; margin: 0; padding: 0; border-top: 1px solid #e6e2dc; }
.ds-row { display: flex; flex-wrap: wrap; justify-content: space-between; gap: .35rem 1rem; padding: .8rem .25rem; border-bottom: 1px solid #e6e2dc; }
.ds-row__main { display: flex; flex-direction: column; min-width: 0; flex: 1 1 18rem; }
.ds-row__title { font-weight: 600; }
.ds-row__meta { display: flex; flex-wrap: wrap; gap: .35rem .75rem; align-items: center; font-size: .88rem; color: var(--color-muted); }

/* ---------- R3: pàgina única del conjunt de dades (capçalera + pestanyes) ---------- */
.ds-head { margin: .25rem 0 1rem; }
.ds-head__cat { margin: 0 0 .35rem; display: flex; flex-wrap: wrap; gap: .35rem; }
.ds-head__title { margin: 0 0 .35rem; }
.ds-head__meta { display: flex; flex-wrap: wrap; gap: .25rem 1.25rem; margin: 0; color: var(--color-muted); font-size: .95rem; }
.ds-head__meta strong { color: var(--color-text); }
/* Línia inferior amb box-shadow (no border + marge negatiu): l'overflow-x:auto ja no crea desplaçament vertical
   ni barres de desplaçament (07/10/2026); en pantalles estretes les pestanyes passen a dues files (més avall). */
.tabs { margin: 0 0 1.25rem; box-shadow: inset 0 -2px 0 #e6e2dc; overflow-x: auto; overflow-y: hidden;
        -webkit-overflow-scrolling: touch; scrollbar-width: none; }
.tabs::-webkit-scrollbar { display: none; }
.tabs ul { display: flex; gap: .25rem; list-style: none; margin: 0; padding: 0; min-width: max-content; }
.tabs a { display: block; padding: .65rem 1rem; color: var(--color-text); text-decoration: none; font-weight: 600; border-bottom: 3px solid transparent; white-space: nowrap; }
.tabs a:hover { color: var(--color-primary); border-bottom-color: #d9d3cb; }
.tabs a[aria-current="page"] { color: var(--color-primary); border-bottom-color: var(--color-red); }
.tabs a:focus-visible { outline: 3px solid var(--color-red); outline-offset: -3px; }
.resum-grafic { margin-top: 1rem; }
.resum-accessos { margin-top: 2rem; }
@media (max-width: 599px) {
  .tabs { overflow: visible; }
  .tabs ul { flex-wrap: wrap; min-width: 0; gap: 0; }
  .tabs li { flex: 1 1 50%; }
  .tabs a { padding: .55rem .5rem; text-align: center; font-size: .92rem; white-space: normal; }
}

/* ---------- Contractes menors: comparació d'anys ---------- */
.kpi__delta { display: inline-block; margin-top: .35rem; padding: .1rem .5rem; border-radius: 8px; font-size: .82rem; font-weight: 600; background: #efeae4; color: var(--color-text); }
.kpi--avis .kpi__hint { font-size: .78rem; }
.quadre-nota--cmp { font-weight: 600; color: var(--color-text); }
.filter__help { margin: .4rem 0 0; font-size: .8rem; color: var(--color-muted); }

/* Paginació manual de la portada (indicadors i conjunts destacats, 28/09/2026). Sense JS: pista amb scroll-snap.
   position: relative a la pista: els .visually-hidden (absolute) de les pàgines amagades no fan scroll a la pàgina. */
.pager { min-width: 0; max-width: 100%; }
.pager__track { position: relative; display: flex; align-items: flex-start; gap: 1rem; width: 100%; overflow-x: auto; scroll-snap-type: x mandatory; overscroll-behavior-x: contain; scroll-behavior: smooth; padding: 2px; margin-top: 1.25rem; }
.pager__track:focus-visible { outline: 3px solid var(--color-primary); outline-offset: 2px; }
.pager__page { flex: 0 0 100%; min-width: 0; margin: 0; scroll-snap-align: start; }
.pager--js .pager__track { scrollbar-width: none; }
.pager--js .pager__track::-webkit-scrollbar { display: none; }
.pager__nav { display: flex; align-items: center; justify-content: center; gap: .25rem; margin-top: .75rem; }
.pager__nav[hidden] { display: none; }
.pager__arrow { width: 2.75rem; height: 2.75rem; border-radius: 50%; border: 1px solid var(--color-primary); background: var(--color-bg); color: var(--color-primary); font-size: 1.6rem; line-height: 1; cursor: pointer; padding: 0 0 .15rem; }
.pager__arrow:hover:not(:disabled) { background: var(--color-surface); }
.pager__arrow:disabled { border-color: #c8c2ba; color: #767676; cursor: default; }
.pager__dot { width: 1.75rem; height: 2.75rem; border: 0; background: transparent; cursor: pointer; padding: 0; display: inline-flex; align-items: center; justify-content: center; }
.pager__dot::before { content: ""; width: .7rem; height: .7rem; border-radius: 50%; border: 2px solid var(--color-primary); background: var(--color-bg); }
.pager__dot[aria-current="true"]::before { background: var(--color-primary); }
.pager__arrow:focus-visible, .pager__dot:focus-visible { outline: 3px solid var(--color-primary); outline-offset: 2px; }
@media (prefers-reduced-motion: reduce) { .pager__track { scroll-behavior: auto; } }
/* D-PORT-6: 3 columnes = una fila per conjunt de dades (3 destacats cadascun) */
@media (min-width: 600px) { .pager__page.kpis--home { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
/* Mocions: matriu d'afinitat (M4). Colors amb contrast AA per al text fosc; el valor sempre escrit. */
.afinitat td.afinitat__cel { text-align: center; min-width: 3.6rem; }
.afinitat__cel--0 { background: #f6d5d0; }
.afinitat__cel--1 { background: #f9e3cf; }
.afinitat__cel--2 { background: #f6edc9; }
.afinitat__cel--3 { background: #d6eddc; }
.afinitat__cel--4 { background: #a9dcc0; }
.afinitat__cel--diag, .afinitat__cel--buit { background: #f5f3f0; color: var(--color-muted); }

/* D-VER: datasets pendents de revisió per canvis en l'origen (docs/06-verificacio-origen.md) */
.chip--pendent { background: #8a4500; color: #fff; }
.chip--ok { background: #1e6b3a; color: #fff; }
.chip--sense_verificar { background: #ece7e0; color: var(--color-text); }
.estat-taula__data { white-space: nowrap; }
.estat-taula__motius { margin: 0; padding-left: 1.1rem; }
.estat-taula__avis { color: #5c5852; }

/* Accidents (T2): tipus exacte dins de cada família */
.table th.table__sub { font-weight: 400; padding-left: 1.5rem; color: #4a4640; }

/* Despeses institucionals (E4): llista de viatges */
.viatges { min-width: 680px; }
.viatges td, .viatges th { vertical-align: top; }
.viatges td:nth-child(3) { min-width: 16rem; }
.viatges__data { white-space: nowrap; }
.viatges .chip { font-size: .72rem; }

/* ---------- Ajuda: com funciona el visor (08/10/2026) ---------- */
.ajuda-index { margin: 1.25rem 0 2rem; padding: 1rem 1.25rem; border-radius: var(--radius); background: var(--color-surface); max-width: 46rem; }
.ajuda-index__title { font-size: 1rem; margin: 0 0 .5rem; }
.ajuda-index ol { margin: 0; padding-left: 1.25rem; columns: 2 16rem; column-gap: 2rem; }
.ajuda-index li { margin: .2rem 0; }
.ajuda { max-width: 46rem; }
.ajuda section { margin: 0 0 2rem; scroll-margin-top: 1rem; }
.ajuda h2 { margin-top: 0; }
.ajuda li { margin: .35rem 0; }
.ajuda-dl { margin: 0 0 1rem; }
.ajuda-dl > div { margin: 0 0 .75rem; }
.ajuda-dl dt { font-weight: 700; }
.ajuda-dl dd { margin: .15rem 0 0; }

/* ---- D-ADM: administració (instància interna, docs/08-administracio-validacio.md) ---- */
.admin-bar { background: #2b2b2b; color: #fff; font-size: .9rem; }
.admin-bar__inner { display: flex; flex-wrap: wrap; align-items: center; gap: .5rem 1.25rem; padding: .4rem var(--gutter); }
.admin-bar a { color: #fff; }
.admin-bar form { margin: 0 0 0 auto; }
.admin-bar button { font: inherit; background: transparent; color: #fff; border: 1px solid #fff; border-radius: var(--radius); padding: .15rem .6rem; cursor: pointer; }
.admin-form { display: grid; gap: .5rem; max-width: 22rem; margin: 1.5rem 0; }
.admin-form input, .admin-accio input { font: inherit; padding: .5rem .6rem; border: 1px solid #b8b2aa; border-radius: var(--radius); }
.admin-form button { justify-self: start; margin-top: .5rem; }
.admin-note { color: var(--color-muted); font-size: .9rem; }
.admin-publicacio { background: var(--color-surface); border-radius: var(--radius); padding: .75rem 1rem; margin: 1rem 0; }
.admin-publicacio p { margin: .25rem 0; }
.admin-filtres ul { list-style: none; display: flex; flex-wrap: wrap; gap: .5rem; margin: 1rem 0; padding: 0; }
.admin-filtres a { text-decoration: none; font-size: .9rem; padding: .3rem .9rem; }
.admin-taula { min-width: 46rem; }
.admin-accio summary { cursor: pointer; color: var(--color-primary); font-weight: 600; }
.admin-accio form { display: grid; gap: .4rem; margin: .5rem 0; max-width: 20rem; }
.admin-accio button { justify-self: start; }
.admin-link { font-size: .85rem; }
.admin-huelles { font-size: .8rem; }
.admin-huelles ul { margin: .25rem 0; padding-left: 1rem; }
.admin-act-filtres { display: flex; flex-wrap: wrap; align-items: end; gap: .5rem 1rem; margin: 1rem 0; }
.admin-act-filtres label { display: grid; gap: .2rem; font-size: .9rem; }
.admin-act-filtres select, .admin-act-filtres input { font: inherit; padding: .35rem .5rem; border: 1px solid #b8b2aa; border-radius: var(--radius); }
.admin-act-resum .chip { font-size: .85rem; }
.admin-act-json { max-width: 32rem; max-height: 20rem; overflow: auto; white-space: pre-wrap; word-break: break-all; font-size: .75rem; }
