/* UPC Litigation Watch, interface publique.
   Reprend la charte du site : police ES Peak héritée, texte #363636,
   bleu de marque #2222C6, filets sobres, blanc dominant.
   La racine du site vaut 10px, toutes les tailles en rem s'y rapportent
   (échelle du site : menu 1.8rem, corps 2.4rem, titre de page 4.8rem). */

.upcw,
.upcw-page {
	--upcw-ink: #363636;
	--upcw-ink-soft: #6b6b6b;
	--upcw-blue: #2222c6;
	--upcw-rule: #dcdcdc;
	--upcw-rule-strong: #404040;
	color: var(--upcw-ink);
}

.upcw-wrap {
	max-width: 1180px;
	margin: 0 auto;
	padding: 0 24px;
}

.upcw-archive {
	padding: 56px 0 104px;
}

/* Fil d'Ariane ---------------------------------------------------------- */

.upcw-breadcrumb {
	font-size: 1.4rem;
	letter-spacing: 0.02em;
	color: var(--upcw-ink-soft);
	margin-bottom: 30px;
}

.upcw-breadcrumb a {
	color: var(--upcw-ink-soft);
	text-decoration: none;
	border-bottom: 1px solid transparent;
}

.upcw-breadcrumb a:hover {
	color: var(--upcw-blue);
	border-bottom-color: var(--upcw-blue);
}

.upcw-sep {
	margin: 0 0.5em;
	color: #b4b4b4;
}

/* Titraille ------------------------------------------------------------- */

.upcw-head {
	margin-bottom: 44px;
}

.upcw-title {
	color: var(--upcw-blue);
	font-weight: 400;
	line-height: 1.12;
	margin: 0 0 20px;
	font-size: clamp(3.2rem, 4vw, 4.8rem);
}

.upcw-lead {
	max-width: 72rem;
	margin: 0;
	font-size: 2rem;
	line-height: 1.6;
	color: var(--upcw-ink);
}

.upcw-termdesc {
	max-width: 90rem;
	margin: 0 0 36px;
	font-size: 1.8rem;
	line-height: 1.65;
}

/* Filtres --------------------------------------------------------------- */

.upcw-filters {
	border-top: 2px solid var(--upcw-rule-strong);
	border-bottom: 1px solid var(--upcw-rule);
	padding: 30px 0 26px;
	margin-bottom: 30px;
}

.upcw-filters__row {
	display: flex;
	flex-wrap: wrap;
	gap: 20px 24px;
	margin-bottom: 20px;
}

.upcw-field {
	display: flex;
	flex-direction: column;
	gap: 7px;
	flex: 1 1 200px;
	min-width: 0;
}

.upcw-field--search {
	flex-basis: 100%;
}

.upcw-field--date {
	flex: 0 1 170px;
}

.upcw-field__label {
	font-size: 1.3rem;
	text-transform: uppercase;
	letter-spacing: 0.1em;
	color: var(--upcw-ink-soft);
}

.upcw-field input,
.upcw-field select {
	font: inherit;
	font-size: 1.7rem;
	line-height: 1.3;
	color: var(--upcw-ink);
	background: #fff;
	border: 1px solid var(--upcw-rule-strong);
	border-radius: 0;
	padding: 12px 14px;
	width: 100%;
	max-width: 100%;
	box-sizing: border-box;
	appearance: none;
	-webkit-appearance: none;
}

.upcw-field select {
	background-image: linear-gradient(45deg, transparent 50%, var(--upcw-ink) 50%),
		linear-gradient(135deg, var(--upcw-ink) 50%, transparent 50%);
	background-position: calc(100% - 20px) calc(50% + 2px), calc(100% - 14px) calc(50% + 2px);
	background-size: 6px 6px, 6px 6px;
	background-repeat: no-repeat;
	padding-right: 40px;
}

.upcw-field input:focus,
.upcw-field select:focus {
	outline: 2px solid var(--upcw-blue);
	outline-offset: 1px;
}

.upcw-filters__actions {
	display: flex;
	align-items: center;
	gap: 24px;
}

.upcw-btn {
	display: inline-block;
	font: inherit;
	font-size: 1.5rem;
	line-height: 1;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	color: #fff;
	background: var(--upcw-ink);
	border: 1px solid var(--upcw-ink);
	border-radius: 0;
	padding: 15px 32px;
	cursor: pointer;
	text-decoration: none;
	transition: background 0.2s ease, border-color 0.2s ease;
}

.upcw-btn:hover {
	background: var(--upcw-blue);
	border-color: var(--upcw-blue);
	color: #fff;
}

.upcw-reset {
	font-size: 1.6rem;
	color: var(--upcw-ink-soft);
	text-decoration: none;
	border-bottom: 1px solid var(--upcw-rule);
}

.upcw-reset:hover {
	color: var(--upcw-blue);
	border-bottom-color: var(--upcw-blue);
}

/* Compteur et liste ----------------------------------------------------- */

.upcw-count {
	font-size: 1.4rem;
	letter-spacing: 0.06em;
	text-transform: uppercase;
	color: var(--upcw-ink-soft);
	margin: 0 0 10px;
}

.upcw-list {
	border-top: 1px solid var(--upcw-rule);
}

.upcw-row {
	padding: 30px 0;
	border-bottom: 1px solid var(--upcw-rule);
}

.upcw-row__title {
	margin: 0 0 12px;
	font-size: 2.2rem;
	font-weight: 400;
	line-height: 1.35;
}

.upcw-row__title a {
	color: var(--upcw-ink);
	text-decoration: none;
	border-bottom: 1px solid transparent;
}

.upcw-row__title a:hover {
	color: var(--upcw-blue);
	border-bottom-color: var(--upcw-blue);
}

.upcw-row__meta {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 7px 16px;
	margin: 0 0 12px;
	font-size: 1.5rem;
	letter-spacing: 0.03em;
	color: var(--upcw-ink-soft);
}

.upcw-row__date {
	font-variant-numeric: tabular-nums;
	color: var(--upcw-ink);
}

.upcw-badge {
	font-size: 1.25rem;
	line-height: 1;
	text-transform: uppercase;
	letter-spacing: 0.1em;
	color: var(--upcw-blue);
	border: 1px solid var(--upcw-blue);
	padding: 5px 10px;
	white-space: nowrap;
}

.upcw-row__holding {
	margin: 0;
	max-width: 100rem;
	font-size: 1.8rem;
	line-height: 1.6;
	color: var(--upcw-ink);
}

.upcw-empty {
	padding: 36px 0;
	font-size: 1.8rem;
}

.upcw-empty a {
	color: var(--upcw-blue);
}

/* Pagination ------------------------------------------------------------ */

.upcw-pagination {
	margin-top: 44px;
}

.upcw-pagination ul {
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
	list-style: none;
	margin: 0;
	padding: 0;
}

.upcw-pagination a,
.upcw-pagination span {
	display: inline-block;
	min-width: 46px;
	padding: 11px 14px;
	text-align: center;
	font-size: 1.6rem;
	line-height: 1.2;
	text-decoration: none;
	color: var(--upcw-ink);
	border: 1px solid var(--upcw-rule);
}

.upcw-pagination a:hover {
	border-color: var(--upcw-blue);
	color: var(--upcw-blue);
}

.upcw-pagination .current {
	background: var(--upcw-ink);
	border-color: var(--upcw-ink);
	color: #fff;
}

.upcw-pagination .dots {
	border-color: transparent;
}

/* Blocs de la page d'atterrissage --------------------------------------- */

.upcw-stats {
	display: flex;
	flex-wrap: wrap;
	gap: 30px 60px;
	border-top: 2px solid var(--upcw-rule-strong);
	border-bottom: 1px solid var(--upcw-rule);
	padding: 32px 0;
	margin: 10px 0 30px;
}

.upcw-stat {
	display: flex;
	flex-direction: column;
	gap: 8px;
}

.upcw-stat__value {
	font-size: clamp(2.8rem, 3vw, 3.6rem);
	line-height: 1;
	color: var(--upcw-blue);
}

.upcw-stat__label {
	font-size: 1.4rem;
	text-transform: uppercase;
	letter-spacing: 0.08em;
	color: var(--upcw-ink-soft);
}

.upcw-cta {
	margin: 0 0 10px;
}

.upcw-latest .upcw-row:first-child {
	border-top: 1px solid var(--upcw-rule);
}

.upcw-browse {
	display: flex;
	flex-wrap: wrap;
	gap: 10px;
	list-style: none;
	margin: 10px 0 0;
	padding: 0;
}

.upcw-browse li {
	margin: 0;
	list-style: none;
}

.upcw-browse a {
	display: inline-flex;
	align-items: baseline;
	gap: 10px;
	padding: 11px 18px;
	border: 1px solid var(--upcw-rule-strong);
	color: var(--upcw-ink);
	text-decoration: none;
	font-size: 1.6rem;
	line-height: 1.2;
	transition: border-color 0.2s ease, color 0.2s ease;
}

.upcw-browse a:hover {
	border-color: var(--upcw-blue);
	color: var(--upcw-blue);
}

.upcw-browse__count {
	font-size: 1.3rem;
	color: var(--upcw-ink-soft);
	font-variant-numeric: tabular-nums;
}

.upcw-standalone {
	margin: 26px 0 10px;
}

/* Page d'atterrissage ---------------------------------------------------
   La page n'est pas construite avec Bricks : on lui rend le conteneur du
   site et la couleur de titre de la charte, en laissant le thème régler
   la taille des textes pour rester aligné sur le reste du site. */

.upcw-page #brx-content {
	max-width: 1180px;
	margin: 0 auto;
	padding: 56px 24px 104px;
	box-sizing: border-box;
	color: var(--upcw-ink);
}

.upcw-page #brx-content > h1 {
	color: var(--upcw-blue);
	margin: 0 0 24px;
}

.upcw-page #brx-content > h2 {
	margin: 72px 0 20px;
}

.upcw-page #brx-content > p {
	max-width: 90rem;
	margin: 0 0 20px;
}

.upcw-page #brx-content > p a {
	color: var(--upcw-blue);
	text-decoration: none;
	border-bottom: 1px solid var(--upcw-blue);
}

.upcw-page #brx-content .upcw-standalone {
	margin-top: 26px;
}

/* Mobile ---------------------------------------------------------------- */

@media (max-width: 720px) {
	.upcw-archive {
		padding: 36px 0 72px;
	}

	.upcw-wrap {
		padding: 0 16px;
	}

	.upcw-filters__row--selects .upcw-field,
	.upcw-field--date {
		flex-basis: 100%;
	}

	.upcw-filters__actions {
		flex-direction: column;
		align-items: stretch;
		gap: 14px;
	}

	.upcw-btn {
		text-align: center;
	}

	.upcw-reset {
		text-align: center;
		border-bottom: none;
	}

	.upcw-stats {
		gap: 24px;
	}

	.upcw-page #brx-content {
		padding: 36px 16px 72px;
	}

	.upcw-page #brx-content > h2 {
		margin-top: 52px;
	}
}
