/* =========================================================
   TIVOLI — footer.css
   ========================================================= */

.site-footer {
	background: var(--color-green-900);
	color: rgba(247, 242, 228, 0.82);
	padding-block: var(--space-2xl) var(--space-lg);
}

/* Audyt SEO (2026-08) — kolumna "Kontakt" usunięta (osobny globalny
   numer/e-mail obok listy lokali mylił Google przy budowaniu fragmentu
   wyniku wyszukiwania, patrz footer.php). Grid zmniejszony z 4 do 3
   kolumn. Przy 900px "Nasze lokale" (teraz najdłuższa kolumna — dwa
   pełne bloki lokalu z telefonem) dostaje całą drugą linię grida
   (grid-column: 1 / -1) zamiast zostawiać osierocone puste pole obok
   niej, jak zostałoby przy prostym "2 kolumny na 3 elementy". */
.footer-top {
	display: grid;
	grid-template-columns: 1.3fr 1fr 1fr;
	gap: var(--space-xl);
	padding-bottom: var(--space-xl);
	border-bottom: 1px solid rgba(247, 242, 228, 0.14);
}

@media (max-width: 900px) {
	.footer-top {
		grid-template-columns: 1fr 1fr;
	}

	.footer-col--locations {
		grid-column: 1 / -1;
	}
}

@media (max-width: 560px) {
	.footer-top {
		grid-template-columns: 1fr;
	}
}

.footer-brand {
	display: flex;
	flex-direction: column;
	gap: var(--space-sm);
}

.footer-brand .footer-logo-mark {
	display: block;
	height: 72px;
	width: auto;
	flex-shrink: 0;
}

.footer-brand p {
	max-width: 32ch;
	font-size: 0.92rem;
	line-height: 1.6;
}

.footer-col h4 {
	font-family: var(--font-body);
	font-size: 0.8rem;
	font-weight: 700;
	letter-spacing: 0.12em;
	text-transform: uppercase;
	color: var(--color-gold-soft);
	margin-bottom: var(--space-sm);
}

.footer-nav__list,
.footer-locations {
	display: flex;
	flex-direction: column;
	gap: var(--space-2xs);
}

.footer-nav__list a {
	font-size: 0.92rem;
	color: rgba(247, 242, 228, 0.82);
	transition: color var(--dur-fast) var(--ease-out);
}

.footer-nav__list a:hover {
	color: var(--color-cream);
}

.footer-locations strong {
	display: block;
	color: var(--color-cream);
	font-size: 0.92rem;
	font-weight: 600;
}

.footer-locations span {
	display: block;
	font-size: 0.85rem;
	opacity: 0.8;
}

/* Audyt SEO (2026-08) — telefon każdego lokalu, teraz klikalny link
   tel:, zamiast zwykłego <span> jak adres — ten sam rozmiar co adres
   nad nim (0.85rem), ale z kolorem/hoverem linku (wzorzec przejęty z
   .footer-nav__list a, dawniej dzielony też z usuniętą kolumną
   "Kontakt"), żeby było wizualnie jasne, że to coś klikalnego. */
.footer-location-block__phone {
	display: block;
	font-size: 0.85rem;
	color: rgba(247, 242, 228, 0.82);
	transition: color var(--dur-fast) var(--ease-out);
}

.footer-location-block__phone:hover {
	color: var(--color-cream);
}

.footer-location-block + .footer-location-block {
	margin-top: var(--space-sm);
}

.footer-social {
	display: flex;
	gap: var(--space-2xs);
	/* No extra margin-top here on top of .footer-brand's flex `gap` —
	   keeps this column's total height unchanged after enlarging the
	   logo mark above, so the footer doesn't grow taller. */
	margin-top: 0;
}

.footer-social a {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 38px;
	height: 38px;
	border-radius: 50%;
	border: 1px solid rgba(247, 242, 228, 0.25);
	transition: background var(--dur-fast) var(--ease-out), border-color var(--dur-fast) var(--ease-out), transform var(--dur-fast) var(--ease-out);
}

.footer-social a:hover {
	background: var(--color-gold);
	border-color: var(--color-gold);
	color: var(--color-green-900);
	transform: translateY(-3px);
}

.footer-social svg {
	width: 1.05rem;
	height: 1.05rem;
}

/* ETAP 17C (audyt 17A) — was `justify-content: space-between` over 3
   flat children (copyright / "Motyw Tivoli" / legal links, the last
   added in ETAP 16D) — designed for 2, so the middle item floated in
   the gap instead of belonging anywhere. Regrouped in footer.php into
   exactly 2 children again: site-credit meta (copyright + theme
   credit, genuinely related — both are "about this build/site", not
   itself a compliance link) and legal links (a distinct category).
   space-between now does what it was meant to. */
.footer-bottom {
	display: flex;
	align-items: center;
	justify-content: space-between;
	flex-wrap: wrap;
	gap: var(--space-sm) var(--space-md);
	padding-top: var(--space-md);
	font-size: 0.82rem;
	color: rgba(247, 242, 228, 0.55);
}

.footer-bottom__meta {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 0.3em 0.7em;
}

.footer-bottom__meta span + span::before {
	content: '·';
	margin-right: 0.7em;
	opacity: 0.6;
}

/* Legal links (Regulamin/Polityka prywatności/Reklamacje i zwroty,
   ETAP 16D, tivoli_render_footer_legal_links()) previously had zero
   dedicated rule here and only inherited .footer-bottom's ambient
   colour/size — worked, but as an accident of inheritance rather than
   a stated part of the footer's own system. Made explicit (same
   values as before — no visual change on its own, see the
   `.footer-bottom` regroup above for the actual fix) so the component
   reads as intentional footer content, not a bolted-on afterthought.
   Its own links reuse `.footer-bottom a` below (same specificity,
   already covers this via descendant match) rather than a duplicate
   `.footer-legal-links a` rule. */
.footer-legal-links {
	font-size: inherit;
	color: inherit;
}

@media (max-width: 640px) {
	.footer-bottom {
		flex-direction: column;
		text-align: center;
	}

	.footer-bottom__meta {
		justify-content: center;
	}
}

.footer-bottom a {
	color: rgba(247, 242, 228, 0.75);
}

.footer-bottom a:hover,
.footer-bottom a:focus-visible {
	color: var(--color-cream);
}