@use "@gloria/layout/_mixins.scss" as *;

.c-footer {
	margin: var(--spacing-20) 0 var(--spacing-6);
	border-top: 1px solid var(--color-gray-400);

	@include mobile {
		margin-top: var(--spacing-10);
	}

	&__heading {
		display: flex;
		align-items: center;
		justify-content: flex-start;
		margin: var(--spacing-4) 0;
	}

	&__items {
		display: inline-flex;
		align-items: center;
	}

	&__copyright {
		display: flex;
		align-items: center;
		justify-content: space-between;
	}

	@include max-width($breakpoint-sm) {
		&__heading {
			justify-content: space-between;
		}

		&__copyright {
			flex-direction: column;
			align-items: flex-start;
			justify-content: flex-start;
		}
	}
}
