/*
 * Devenir membre 2026 — tarifs.
 * Reprend le langage visuel du bloc tarifaire des activités.
 */
.hm-member-rates,
.hm-member-benefits {
	width: 100%;
	margin-top: clamp(42px, 5vw, 72px);
	padding-top: 0;
	border-top: 0;
}

.hm-page-base-2026__content .hm-member-rates__title,
.hm-page-base-2026__content .hm-member-benefits__title {
	position: relative;
	margin: 0 0 clamp(26px, 3.5vw, 42px);
	padding: 0 0 18px;
	color: var(--hm-primary);
	border: 0;
	border-bottom: 1px solid color-mix(in srgb, var(--hm-primary) 18%, transparent);
	font-family: "Cooper", serif !important;
	font-size: clamp(2rem, 3.2vw, 3.45rem);
	font-weight: normal;
	line-height: 1.05;
}

.hm-page-base-2026__content .hm-member-rates__title::after,
.hm-page-base-2026__content .hm-member-benefits__title::after {
	position: absolute;
	bottom: -2px;
	left: 0;
	width: 72px;
	height: 4px;
	border-radius: 999px;
	background: var(--hm-accent2);
	content: "";
}

.hm-member-rates__list {
	display: grid;
	grid-template-columns: repeat(var(--hm-member-rate-count, 1), minmax(0, 1fr));
	gap: 14px;
}

.hm-member-rates__list.hm-member-rates__list--4 {
	grid-template-columns: repeat(4, minmax(0, 1fr));
}

.hm-member-rates__row {
	display: grid;
	grid-template-columns: minmax(0, 1fr) auto;
	align-items: center;
	gap: 1rem;
	width: 100%;
	min-width: 0;
	padding: .7rem .75rem .7rem 1.15rem;
	background: color-mix(in srgb, var(--hm-accent2) 14%, #fff);
	border: 2px solid var(--hm-accent2);
	border-radius: 999px;
}

.hm-member-rates__category {
	min-width: 0;
	color: var(--hm-primary);
	font-family: "BrownStd-Regular", sans-serif !important;
	font-size: 1.3rem;
	line-height: 1.3;
	overflow-wrap: anywhere;
}

.hm-member-rates__price {
	justify-self: end;
	padding: .35em .65em;
	color: #fff;
	background: var(--hm-accent3);
	border-radius: 999px;
	font-family: "BrownStd-Bold", sans-serif !important;
	font-size: 1.45rem;
	line-height: 1;
	white-space: nowrap;
}

/*
 * Devenir membre 2026 — avantages offerts par les partenaires sélectionnés.
 */

.hm-member-benefits__table-wrap {
	width: 100%;
	overflow-x: auto;
	overflow-y: hidden;
	background: transparent;
	border: 0;
	border-radius: 0;
	-webkit-overflow-scrolling: touch;
}

.hm-member-benefits__table-wrap:focus-visible {
	outline: 3px solid var(--hm-accent2);
	outline-offset: 3px;
}

.hm-page-base-2026__content .hm-member-benefits__table {
	width: 100%;
	min-width: 900px;
	margin: 0;
	border: 0;
	border-collapse: separate;
	border-spacing: 0 10px;
	table-layout: fixed;
	font-size: 1rem;
	line-height: 1.4;
}

.hm-page-base-2026__content .hm-member-benefits__table th,
.hm-page-base-2026__content .hm-member-benefits__table td {
	padding: 20px;
	color: var(--hm-primary);
	border: 0;
	background: var(--hm-secondary);
	text-align: left;
	vertical-align: middle;
}

.hm-page-base-2026__content .hm-member-benefits__table thead th {
	padding-top: 0;
	padding-bottom: 8px;
	color: var(--hm-primary);
	background: transparent;
	font-family: "BrownStd-Bold", sans-serif !important;
	font-size: .88rem;
	line-height: 1.35;
	letter-spacing: .01em;
	vertical-align: middle;
}

.hm-page-base-2026__content .hm-member-benefits__table thead th:nth-child(n + 2) {
	text-align: center;
}

.hm-page-base-2026__content .hm-member-benefits__table tbody tr > :first-child {
	border-radius: 14px 0 0 14px;
}

.hm-page-base-2026__content .hm-member-benefits__table tbody tr > :last-child {
	border-radius: 0 14px 14px 0;
}

.hm-page-base-2026__content .hm-member-benefits__table tbody th,
.hm-page-base-2026__content .hm-member-benefits__table tbody td {
	transition: background-color 180ms ease, color 180ms ease;
}

.hm-page-base-2026__content .hm-member-benefits__row {
	position: relative;
	transform-origin: center;
	transition: transform 180ms ease;
}

.hm-page-base-2026__content .hm-member-benefits__row--linked {
	cursor: pointer;
}

.hm-page-base-2026__content .hm-member-benefits__row--linked:has(.hm-member-benefits__name a:focus-visible) {
	z-index: 1;
	transform: translateY(-5px) scaleY(1.025);
}

@media (hover: hover) and (pointer: fine) {
	.hm-page-base-2026__content .hm-member-benefits__row--linked:hover {
		z-index: 1;
		transform: translateY(-5px) scaleY(1.025);
	}
}

.hm-page-base-2026__content .hm-member-benefits__name {
	width: 20%;
	font-family: "BrownStd-Bold", sans-serif;
	font-size: 1.25rem;
	line-height: 1.3;
	overflow-wrap: anywhere;
}

.hm-page-base-2026__content .hm-member-benefits__name a {
	color: var(--hm-primary);
	text-decoration-thickness: 1px;
	text-underline-offset: 3px;
	transition: color 180ms ease;
}

.hm-page-base-2026__content .hm-member-benefits__row--linked .hm-member-benefits__name a::after {
	position: absolute;
	z-index: 2;
	inset: 0;
	border-radius: 14px;
	content: "";
}

.hm-page-base-2026__content .hm-member-benefits__table tbody tr:hover .hm-member-benefits__name a {
	color: var(--hm-primary);
	text-decoration-thickness: 2px;
}

.hm-page-base-2026__content .hm-member-benefits__name a:focus-visible {
	outline: 0;
}

.hm-page-base-2026__content .hm-member-benefits__row--linked .hm-member-benefits__name a:focus-visible::after {
	outline: 3px solid var(--hm-accent2);
	outline-offset: 2px;
}

.hm-member-benefits__logo {
	display: block;
	width: auto;
	max-width: 100%;
	height: 52px;
	max-height: 52px;
	margin: 0 auto;
	object-fit: contain;
	object-position: center;
}

.hm-member-benefits__no-logo {
	display: block;
	color: var(--hm-grey3);
	font-size: 1.4rem;
	text-align: center;
}

.hm-member-benefits__logo-cell {
	width: 12%;
}

.hm-member-benefits__benefit {
	width: 34%;
	line-height: 1.55;
	overflow-wrap: anywhere;
	text-align: left !important;
}

.hm-page-base-2026__content .hm-member-benefits__table tbody tr > .hm-member-benefits__benefit:nth-child(3) {
	color: #fff;
	background: var(--hm-accent3);
}

.hm-page-base-2026__content .hm-member-benefits__table tbody tr > .hm-member-benefits__benefit:nth-child(4) {
	color: var(--hm-primary);
	background: var(--hm-accent2);
}

.hm-member-benefits__benefit-copy {
	display: block;
	width: auto;
	max-width: none;
	min-width: 0;
	padding: 0;
	color: inherit;
	background: transparent;
	border-radius: 0;
	font-family: "BrownStd-Bold", sans-serif;
	font-size: 1rem;
	line-height: 1.3;
	text-align: left;
}

.hm-member-benefits__benefit-copy > :first-child {
	margin-top: 0;
}

.hm-member-benefits__benefit-copy > :last-child {
	margin-bottom: 0;
}

@media screen and (max-width: 768px) {
	.hm-member-rates,
	.hm-member-benefits {
		margin-top: 38px;
		padding-top: 0;
	}

	.hm-page-base-2026__content .hm-member-rates__title,
	.hm-page-base-2026__content .hm-member-benefits__title {
		margin-bottom: 24px;
		padding-bottom: 14px;
		font-size: clamp(1.85rem, 9vw, 2.65rem);
	}

	.hm-page-base-2026__content .hm-member-rates__title::after,
	.hm-page-base-2026__content .hm-member-benefits__title::after {
		width: 56px;
		height: 3px;
	}

	.hm-member-rates__row {
		gap: 10px;
		padding: 8px 8px 8px 14px;
		border: 2px solid var(--hm-accent2);
		border-radius: 999px;
		background: color-mix(in srgb, var(--hm-accent2) 14%, #fff);
	}

	.hm-member-rates__list,
	.hm-member-rates__list.hm-member-rates__list--4 {
		grid-template-columns: 1fr;
	}

	.hm-member-rates__category {
		font-size: 1rem;
		line-height: 1.35;
	}

	.hm-member-rates__price {
		padding: 7px 10px;
		font-size: 1rem;
		line-height: 1.1;
	}

	.hm-page-base-2026__content .hm-member-benefits__table {
		display: block;
		width: 100%;
		min-width: 0;
		border-spacing: 0;
		font-size: .95rem;
	}

	.hm-member-benefits__table-wrap {
		max-width: 100%;
		overflow: visible;
	}

	.hm-page-base-2026__content .hm-member-benefits__table thead {
		position: absolute;
		width: 1px;
		height: 1px;
		margin: -1px;
		padding: 0;
		overflow: hidden;
		clip: rect(0, 0, 0, 0);
		clip-path: inset(50%);
		white-space: nowrap;
	}

	.hm-page-base-2026__content .hm-member-benefits__table tbody {
		display: grid;
		gap: 14px;
		width: 100%;
	}

	.hm-page-base-2026__content .hm-member-benefits__row {
		display: grid;
		grid-template-columns: minmax(0, 1fr);
		width: 100%;
		overflow: hidden;
		border-radius: 14px;
	}

	.hm-page-base-2026__content .hm-member-benefits__table th,
	.hm-page-base-2026__content .hm-member-benefits__table td {
		width: auto;
		padding: 12px;
		border-radius: 0 !important;
	}

	.hm-page-base-2026__content .hm-member-benefits__logo-cell {
		grid-column: 1;
		grid-row: 1;
		display: flex;
		align-items: center;
		justify-content: center;
		min-height: 104px;
		padding: 18px 18px 10px;
	}

	.hm-page-base-2026__content .hm-member-benefits__name {
		grid-column: 1;
		grid-row: 2;
		padding: 8px 18px 18px;
		font-size: 1.15rem;
		line-height: 1.32;
		text-align: center;
		white-space: normal;
	}

	.hm-page-base-2026__content .hm-member-benefits__name a {
		display: inline;
		white-space: normal;
		overflow-wrap: anywhere;
	}

	.hm-page-base-2026__content .hm-member-benefits__benefit {
		display: block;
		grid-column: 1 / -1;
		width: 100%;
		padding: 14px 16px;
	}

	.hm-page-base-2026__content .hm-member-benefits__benefit::before {
		display: block;
		margin-bottom: 6px;
		font-family: "BrownStd-Bold", sans-serif;
		font-size: .72rem;
		line-height: 1.3;
		letter-spacing: .025em;
		content: attr(data-label);
	}

	.hm-page-base-2026__content .hm-member-benefits__benefit:nth-child(3)::before {
		color: color-mix(in srgb, #fff 78%, transparent);
	}

	.hm-page-base-2026__content .hm-member-benefits__benefit:nth-child(4)::before {
		color: color-mix(in srgb, var(--hm-primary) 72%, transparent);
	}

	.hm-member-benefits__logo {
		height: 72px;
		max-height: 72px;
		margin: 0 auto;
	}

	.hm-page-base-2026__content .hm-member-benefits__row--linked .hm-member-benefits__name a:focus-visible::after {
		outline-offset: -3px;
	}

}

@media screen and (max-width: 400px) {
	.hm-member-benefits__logo {
		height: 64px;
		max-height: 64px;
	}
}

/*
 * Impression canonique de la page Devenir membre.
 * La largeur physique ne dépend pas de l’appareil qui lance l’impression.
 */
@media print {
	body.hm-member-page {
		width: 180mm !important;
		min-width: 180mm !important;
		max-width: 180mm !important;
		margin: 0 auto !important;
		background: #fff !important;
	}

	body.hm-member-page #header,
	body.hm-member-page #footer {
		display: none !important;
	}

	body.hm-member-page #wrapper,
	.hm-member-2026,
	.hm-member-2026 .widthRegulator {
		display: block !important;
		width: 100% !important;
		min-width: 0 !important;
		max-width: none !important;
		margin-right: 0 !important;
		margin-left: 0 !important;
	}

	.hm-member-2026 .hm-page-base-2026__body {
		padding: 0 !important;
	}

	.hm-member-rates {
		break-inside: avoid;
		border-top-color: #000 !important;
	}

	.hm-member-rates__row {
		break-inside: avoid;
		background: #fff !important;
		border: 1px solid #aaa;
		border-radius: 999px;
	}

	.hm-member-rates__price {
		color: #000 !important;
		background: #fff !important;
		border: 1px solid #000;
	}

	.hm-member-benefits {
		break-inside: auto;
		border-top-color: #000 !important;
	}

	.hm-member-benefits__table-wrap {
		overflow: visible;
		border: 1px solid #777 !important;
		border-radius: 0;
		box-shadow: none !important;
	}

	.hm-page-base-2026__content .hm-member-benefits__table {
		width: 100% !important;
		min-width: 0 !important;
		border-collapse: collapse !important;
		border-spacing: 0 !important;
		font-size: 8.5pt;
		line-height: 1.3;
	}

	.hm-page-base-2026__content .hm-member-benefits__table thead {
		display: table-header-group;
	}

	.hm-page-base-2026__content .hm-member-benefits__table tr {
		break-inside: avoid;
		transform: none !important;
	}

	.hm-page-base-2026__content .hm-member-benefits__table th,
	.hm-page-base-2026__content .hm-member-benefits__table td {
		padding: 6pt;
		color: #000 !important;
		background: #fff !important;
		border-right: .5pt solid #aaa;
		border-bottom: .5pt solid #aaa;
		border-radius: 0 !important;
	}

	.hm-page-base-2026__content .hm-member-benefits__table tr > :last-child {
		border-right: 0;
	}

	.hm-page-base-2026__content .hm-member-benefits__table thead th {
		border-bottom: 1pt solid #000;
		font-size: 8pt;
	}

	.hm-member-benefits__logo {
		height: 30pt;
		max-height: 30pt;
		filter: none !important;
	}

	.hm-member-benefits__benefit-copy {
		display: block;
		width: auto;
		max-width: none;
		padding: 0;
		color: #000 !important;
		background: transparent !important;
		border-radius: 0;
		font-family: "BrownStd-Regular", sans-serif;
		font-size: inherit;
		line-height: inherit;
	}

	.hm-page-base-2026__content .hm-member-benefits__name a {
		color: #000 !important;
		text-decoration: underline;
	}

	.hm-page-base-2026__content .hm-member-benefits__name a::after {
		position: static;
		z-index: auto;
		inset: auto;
		border-radius: 0;
		outline: 0;
		content: " (" attr(href) ")";
	}

}

