/* ==========================================================================
   Pied de page MYCA — present sur toutes les pages (composant React Footer).
   Portage 1:1 des classes Tailwind. Breakpoints : sm = 640px, lg = 1024px.
   Racine 16px, --spacing = 0.25rem.
   ========================================================================== */

.myca-footer {
	--myca-black: #121212;
	--myca-white: #faf8f4;
	--myca-orange: #c1622e;
	--myca-orange-dark: #9c4a22;
	--myca-font-display: "Archivo", "Archivo Narrow", system-ui, sans-serif;
	--myca-font-body: "Inter", system-ui, sans-serif;

	background-color: var(--myca-black);   /* bg-myca-black */
	color: var(--myca-white);              /* text-myca-white */
	font-family: var(--myca-font-body);
}

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

.myca-footer h4,
.myca-footer p,
.myca-footer span,
.myca-footer div,
.myca-footer a,
.myca-footer ul,
.myca-footer li,
.myca-footer form,
.myca-footer input,
.myca-footer button,
.myca-footer svg {
	margin: 0;
	padding: 0;
	border: 0;
	font: inherit;
	color: inherit;
	background: none;
	list-style: none;
	text-decoration: none;
}

/* mx-auto max-w-350 px-4 py-10 sm:py-16 sm:px-6 */
.myca-footer .myca-footer-inner {
	margin-inline: auto;
	max-width: 87.5rem;
	padding: 2.5rem 1rem;
}

@media (min-width: 640px) {
	.myca-footer .myca-footer-inner {
		padding: 4rem 1.5rem;
	}
}

/* grid gap-8 sm:grid-cols-2 lg:gap-12 lg:grid-cols-5 */
.myca-footer .myca-footer-grid {
	display: grid;
	grid-template-columns: minmax(0, 1fr);
	gap: 2rem;
}

@media (min-width: 640px) {
	.myca-footer .myca-footer-grid {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}
}

@media (min-width: 1024px) {
	.myca-footer .myca-footer-grid {
		gap: 3rem;
		grid-template-columns: repeat(5, minmax(0, 1fr));
	}
}

/* sm:col-span-2 lg:col-span-1 */
@media (min-width: 640px) {
	.myca-footer .myca-footer-brand {
		grid-column: span 2 / span 2;
	}
}

@media (min-width: 1024px) {
	.myca-footer .myca-footer-brand {
		grid-column: span 1 / span 1;
	}
}

/* --- Logo empile (MycaLogo variant=light display=stacked) ---------------- */
.myca-footer .myca-footer-logo {
	font-size: 1.5rem;                 /* text-2xl : base des unites em du logo */
	line-height: calc(2 / 1.5);
}

.myca-footer .myca-logo-stacked {
	display: inline-flex;
	flex-direction: column;
	align-items: center;
	gap: 0.375rem;                     /* gap-1.5 */
}

.myca-footer .myca-logo-mark {
	display: block;
	flex: none;
	width: 2.4em;                      /* h-[2.4em] w-[2.4em] */
	height: 2.4em;
}

.myca-footer .myca-logo-mark svg {
	display: block;
	width: 100%;
	height: 100%;
}

.myca-footer .myca-logo-word {
	font-family: var(--myca-font-display);
	font-size: 0.65em;                 /* text-[0.65em] */
	font-weight: 700;                  /* font-bold */
	text-transform: uppercase;
	letter-spacing: 0.35em;            /* tracking-[0.35em] */
	color: var(--myca-white);
	line-height: 1;
}

/* p : mt-6 font-display text-sm uppercase tracking-[0.18em] text-myca-orange */
.myca-footer .myca-footer-tagline {
	margin-top: 1.5rem;
	font-family: var(--myca-font-display);
	font-weight: 400;
	font-size: 0.875rem;
	line-height: calc(1.25 / 0.875);
	text-transform: uppercase;
	letter-spacing: 0.18em;
	color: var(--myca-orange);
}

/* p : mt-3 text-sm text-myca-white/70 */
.myca-footer .myca-footer-desc {
	margin-top: 0.75rem;
	font-size: 0.875rem;
	line-height: calc(1.25 / 0.875);
	color: rgba(250, 248, 244, 0.7);
}

/* div : mt-6 flex gap-4 */
.myca-footer .myca-footer-social {
	margin-top: 1.5rem;
	display: flex;
	gap: 1rem;
}

.myca-footer .myca-footer-social a {
	display: inline-flex;
	color: inherit;                   /* hover:text-myca-orange */
	transition: color 0.15s cubic-bezier(0.4, 0, 0.2, 1);
}

.myca-footer .myca-footer-social a:hover {
	color: var(--myca-orange);
}

.myca-footer .myca-footer-social svg {
	display: block;
	width: 1.25rem;                   /* h-5 w-5 */
	height: 1.25rem;
}

/* h4 : font-display text-sm uppercase tracking-[0.18em] text-myca-white */
.myca-footer .myca-footer-col-title {
	font-family: var(--myca-font-display);
	font-weight: 400;
	font-size: 0.875rem;
	line-height: calc(1.25 / 0.875);
	text-transform: uppercase;
	letter-spacing: 0.18em;
	color: var(--myca-white);
}

/* ul : mt-4 space-y-3 text-sm text-myca-white/70 */
.myca-footer .myca-footer-col-list {
	margin-top: 1rem;
	font-size: 0.875rem;
	line-height: calc(1.25 / 0.875);
	color: rgba(250, 248, 244, 0.7);
}

.myca-footer .myca-footer-col-list > li + li {
	margin-top: 0.75rem;              /* space-y-3 */
}

.myca-footer .myca-footer-col-list a {
	color: inherit;                   /* hover:text-myca-orange */
	transition: color 0.15s cubic-bezier(0.4, 0, 0.2, 1);
}

.myca-footer .myca-footer-col-list a:hover {
	color: var(--myca-orange);
}

/* p : mt-4 text-sm text-myca-white/70 */
.myca-footer .myca-footer-news-text {
	margin-top: 1rem;
	font-size: 0.875rem;
	line-height: calc(1.25 / 0.875);
	color: rgba(250, 248, 244, 0.7);
}

/* form : mt-4 flex items-center border border-myca-white/30 */
.myca-footer .myca-footer-form {
	margin-top: 1rem;
	display: flex;
	align-items: center;
	border: 1px solid rgba(250, 248, 244, 0.3);
}

/* input : flex-1 bg-transparent px-3 py-3 text-sm outline-none placeholder:text-myca-white/50 */
.myca-footer .myca-footer-input {
	flex: 1 1 0%;
	min-width: 0;
	background: transparent;
	padding: 0.75rem;
	font-size: 0.875rem;
	line-height: calc(1.25 / 0.875);
	color: var(--myca-white);
	outline: none;
	appearance: none;
	border-radius: 0;
}

.myca-footer .myca-footer-input::placeholder {
	color: rgba(250, 248, 244, 0.5);
	opacity: 1;
}

/* button : grid h-12 w-12 place-items-center bg-myca-orange hover:bg-myca-orange-dark */
.myca-footer .myca-footer-submit {
	display: grid;
	place-items: center;
	flex: none;
	width: 3rem;
	height: 3rem;
	background-color: var(--myca-orange);
	color: var(--myca-white);
	cursor: pointer;
	transition: background-color 0.15s cubic-bezier(0.4, 0, 0.2, 1);
}

.myca-footer .myca-footer-submit:hover {
	background-color: var(--myca-orange-dark);
}

.myca-footer .myca-footer-submit svg {
	display: block;
	width: 1rem;                      /* h-4 w-4 */
	height: 1rem;
}

/* --- Bas de page ------------------------------------------------------- */
/* div : border-t border-myca-white/15 */
.myca-footer .myca-footer-bottom {
	border-top: 1px solid rgba(250, 248, 244, 0.15);
}

/* div : mx-auto flex max-w-350 flex-col items-center justify-between gap-2
   px-4 py-5 text-xs text-myca-white/60 sm:flex-row sm:px-6 */
.myca-footer .myca-footer-bottom-inner {
	margin-inline: auto;
	display: flex;
	max-width: 87.5rem;
	flex-direction: column;
	align-items: center;
	justify-content: space-between;
	gap: 0.5rem;
	padding: 1.25rem 1rem;
	font-size: 0.75rem;
	line-height: calc(1 / 0.75);
	color: rgba(250, 248, 244, 0.6);
}

@media (min-width: 640px) {
	.myca-footer .myca-footer-bottom-inner {
		flex-direction: row;
		padding-inline: 1.5rem;
	}
}

/* div : flex flex-wrap justify-center gap-5  (la <ul> porte la mise en page) */
.myca-footer .myca-footer-legal-list {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	gap: 1.25rem;
}

.myca-footer .myca-footer-legal-list > li {
	display: block;
}

.myca-footer .myca-footer-legal-list a {
	color: inherit;                   /* hover:text-myca-orange transition */
	transition: color 0.15s cubic-bezier(0.4, 0, 0.2, 1);
}

.myca-footer .myca-footer-legal-list a:hover {
	color: var(--myca-orange);
}