/**
 * ss4y/footer — pied de page.
 *
 * Rangée logo + réseaux sociaux, puis les colonnes de liens et l'infolettre,
 * enfin la barre de mentions séparée par un filet.
 */

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

.ss4y-footer {
	padding-block: var(--wp--preset--spacing--xl);
	background: var(--wp--preset--color--text);
	color: rgb(255 255 255 / 72%);
	font-size: var(--wp--preset--font-size--small);
}

.ss4y-footer__inner {
	max-width: var(--wp--style--global--wide-size, 1400px);
	margin-inline: auto;
	padding-inline: var(--wp--custom--section--padding-inline);
}

/* ─── Logo et réseaux ────────────────────────────────────────────────────── */
.ss4y-footer__top {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: space-between;
	gap: var(--wp--preset--spacing--md);
	padding-block-end: var(--wp--preset--spacing--xl);
}

.ss4y-footer__brand .custom-logo-link,
.ss4y-footer__logo-link {
	display: inline-block;
}

/* Largeur réglée dans l'éditeur, servie en variable par le rendu PHP. */
.ss4y-footer__brand img {
	max-width: var(--ss4y-footer-logo-width, 9rem);
	height: auto;
}

.ss4y-footer__sitename {
	font-family: var(--wp--preset--font-family--heading);
	font-size: var(--wp--preset--font-size--large);
	font-weight: 700;
	text-decoration: none;
	color: var(--wp--preset--color--white);
}

.ss4y-footer__tagline {
	margin: 0.6rem 0 0;
	max-width: 34ch;
	line-height: 1.6;
}

.ss4y-footer__socials {
	margin: 0;
	padding: 0;
	list-style: none;
	display: flex;
	gap: var(--wp--preset--spacing--sm);
}

.ss4y-footer__social {
	display: inline-flex;
	color: var(--wp--preset--color--white);
	transition: color var(--wp--custom--transition);
}

.ss4y-footer__social:hover,
.ss4y-footer__social:focus-visible {
	color: var(--wp--preset--color--accent);
}

.ss4y-footer__social-icon {
	width: 1.35rem;
	height: 1.35rem;
}

/* ─── Colonnes ───────────────────────────────────────────────────────────── */
.ss4y-footer__cols {
	display: grid;
	grid-template-columns: repeat(4, minmax(0, 1fr));
	gap: var(--wp--preset--spacing--lg) var(--wp--preset--spacing--md);
	padding-block-end: var(--wp--preset--spacing--xl);
}

.ss4y-footer__col-title {
	margin: 0 0 var(--wp--preset--spacing--md);
	font-family: var(--wp--preset--font-family--heading);
	font-size: var(--wp--preset--font-size--base);
	font-weight: 700;
	color: var(--wp--preset--color--white);
}

.ss4y-footer__list {
	margin: 0;
	padding: 0;
	list-style: none;
	display: grid;
	gap: 0.7rem;
}

.ss4y-footer__list--two {
	grid-template-columns: repeat(2, minmax(0, 1fr));
	column-gap: var(--wp--preset--spacing--sm);
}

.ss4y-footer__item {
	display: flex;
	align-items: flex-start;
	gap: 0.5rem;
	line-height: 1.5;
}

.ss4y-footer__item a {
	color: inherit;
	text-decoration: none;
}

.ss4y-footer__item a:hover,
.ss4y-footer__item a:focus-visible {
	color: var(--wp--preset--color--white);
	text-decoration: underline;
}

.ss4y-footer__item-icon {
	width: 0.95rem;
	height: 0.95rem;
	flex-shrink: 0;
	margin-block-start: 0.2em;
	color: rgb(255 255 255 / 55%);
}

/* Puce triangulaire des listes de liens, dessinée sans image. */
.ss4y-footer__bullet {
	width: 0;
	height: 0;
	flex-shrink: 0;
	margin-block-start: 0.42em;
	border-block: 0.28em solid transparent;
	border-inline-start: 0.42em solid rgb(255 255 255 / 55%);
}

/* ─── Infolettre ─────────────────────────────────────────────────────────── */
.ss4y-footer__form {
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	gap: 0.75rem;
}

.ss4y-footer__input {
	width: 100%;
	padding: 0.7rem 1rem;
	border: 1px solid rgb(255 255 255 / 18%);
	border-radius: var(--wp--custom--radius--sm);
	background: rgb(255 255 255 / 92%);
	font-family: inherit;
	font-size: var(--wp--preset--font-size--small);
	color: var(--wp--preset--color--text);
}

.ss4y-footer__input:focus {
	outline: 2px solid var(--wp--preset--color--accent);
	outline-offset: 2px;
}

.ss4y-footer__submit {
	padding: 0.6rem 1.4rem;
	border: 0;
	border-radius: var(--wp--custom--radius--pill);
	background: var(--wp--preset--color--accent);
	color: var(--wp--preset--color--text);
	font-family: inherit;
	font-size: var(--wp--preset--font-size--small);
	font-weight: 600;
	cursor: pointer;
	transition: background-color var(--wp--custom--transition);
}

.ss4y-footer__submit:hover,
.ss4y-footer__submit:focus-visible {
	background: var(--wp--preset--color--accent-dark);
}

.ss4y-footer__note {
	margin: 0.7rem 0 0;
	font-size: 0.72rem;
	line-height: 1.5;
	color: rgb(255 255 255 / 55%);
}

/* ─── Bas de page ────────────────────────────────────────────────────────── */
.ss4y-footer__bottom {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: space-between;
	gap: var(--wp--preset--spacing--sm);
	padding-block-start: var(--wp--preset--spacing--md);
	border-block-start: 1px solid rgb(255 255 255 / 12%);
	font-size: 0.75rem;
	color: rgb(255 255 255 / 60%);
}

.ss4y-footer__bottom p {
	margin: 0;
}

.ss4y-footer__credit a {
	color: inherit;
	text-decoration: none;
}

.ss4y-footer__credit a:hover,
.ss4y-footer__credit a:focus-visible {
	color: var(--wp--preset--color--white);
	text-decoration: underline;
}

/* ─── Tablette & mobile ──────────────────────────────────────────────────── */
@media (max-width: 900px) {

	.ss4y-footer__cols {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}
}

@media (max-width: 560px) {

	.ss4y-footer__cols {
		grid-template-columns: minmax(0, 1fr);
	}

	.ss4y-footer__list--two {
		grid-template-columns: minmax(0, 1fr);
	}
}

@media (prefers-reduced-motion: reduce) {

	.ss4y-footer__social,
	.ss4y-footer__submit {
		transition: none;
	}
}