/* Carte du hameau : aperçu sans requête externe, puis carte Leaflet. */

.hameau-carte {
	margin: var(--wp--preset--spacing--6, 2rem) 0 0;
}

.hameau-carte__apercu,
.hameau-carte__zone {
	box-sizing: border-box;
	width: 100%;
	height: clamp(260px, 45vw, 380px);
	border: 1px solid var(--wp--preset--color--lin, #e4e2dd);
	border-radius: 18px;
	overflow: hidden;
}

/* Aperçu : fond discret, adresse et bouton centrés. */
.hameau-carte__apercu {
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	gap: 0.875rem;
	padding: 1.5rem;
	text-align: center;
	background:
		radial-gradient(circle at 30% 40%, var(--wp--preset--color--foret-100, #d6e3db) 0 18%, transparent 19%),
		radial-gradient(circle at 70% 65%, var(--wp--preset--color--foret-50, #eef3f0) 0 22%, transparent 23%),
		var(--wp--preset--color--papier-releve, #f1efe9);
}

.hameau-carte__apercu[hidden],
.hameau-carte__zone[hidden] {
	display: none;
}

.hameau-carte__adresse {
	margin: 0;
	font-weight: 500;
	color: var(--wp--preset--color--encre, #1f2a24);
}

.hameau-carte__bouton {
	min-height: 44px;
	padding: 0.625rem 1.25rem;
	font: inherit;
	font-weight: 600;
	color: var(--wp--preset--color--blanc, #fff);
	background: var(--wp--preset--color--foret, #285c46);
	border: 0;
	border-radius: 999px;
	cursor: pointer;
}

.hameau-carte__bouton:hover {
	background: var(--wp--preset--color--foret-700, #1b3e2f);
}

.hameau-carte__bouton:focus-visible,
.hameau-carte__zone:focus-visible {
	outline: 3px solid var(--wp--preset--color--pin, #1f7354);
	outline-offset: 3px;
}

.hameau-carte__note {
	max-width: 32rem;
	margin: 0;
	font-size: var(--wp--preset--font-size--sm, 0.875rem);
	color: var(--wp--preset--color--texte-attenue, #6b6557);
}

.hameau-carte figcaption {
	margin-top: 0.5rem;
	font-size: var(--wp--preset--font-size--sm, 0.875rem);
}

/* Épingle aux couleurs du site (pas d'image). */
.hameau-carte__epingle span {
	display: block;
	width: 32px;
	height: 32px;
	background: var(--wp--preset--color--foret, #285c46);
	border: 3px solid var(--wp--preset--color--blanc, #fff);
	border-radius: 50% 50% 50% 0;
	box-shadow: 0 2px 6px rgb(0 0 0 / 0.3);
	transform: rotate(-45deg);
}