/* ============================================================
   SWITALSKI.LAW — layout: header, mega-menu, mobile drawer,
   footer. Port of header.jsx + sections.jsx (Footer).
   Breakpoints: 640 / 920 / 1100 / 1400 (literals sanctioned in
   media queries only — see tokens.css).
   ============================================================ */

/* ------------------------------------------------------------
   Header — sticky dark bar
   ------------------------------------------------------------ */

.sl-header {
	position: sticky;
	top: 0;
	z-index: 50;
	background: var(--ink);
	border-bottom: var(--bw-1) solid transparent;
	transition: background .2s ease, border-color .2s ease;
}

/* Scrolled past 8px OR mega-menu open (JS toggles the class) */
.sl-header.is-glass {
	background: var(--header-bg-glass);
	-webkit-backdrop-filter: blur(10px);
	backdrop-filter: blur(10px);
	border-bottom-color: var(--border-inv-mid);
}

.sl-header__inner {
	max-width: var(--container-max);
	margin: 0 auto;
	padding: var(--sp-18) var(--s-6);
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: var(--s-5);
}

.sl-header__logo-link {
	text-decoration: none;
}

.sl-header__nav {
	display: flex;
	align-items: center;
	gap: var(--sp-28);
}

.sl-header__svc {
	position: relative;
}

.sl-header__link {
	font-family: var(--font-body);
	font-size: var(--fs-13);
	font-weight: 500;
	color: var(--n-200);
	text-decoration: none;
	border-bottom: var(--bw-2) solid transparent;
	padding-bottom: var(--s-1);
	transition: border-color .15s ease, color .15s ease;
	display: inline-flex;
	align-items: center;
	gap: var(--sp-6);
	cursor: pointer;
}

.sl-header__link--active {
	color: var(--paper);
	border-bottom-color: var(--gold);
}

.sl-header__caret {
	display: inline-flex;
}

.sl-header__tools {
	display: flex;
	align-items: center;
	gap: var(--s-4);
}

/* Burger — hidden on desktop, shown ≤920px */
.sl-burger {
	display: none;
	align-items: center;
	justify-content: center;
	width: var(--sp-44);
	height: var(--sp-44);
	padding: 0;
	cursor: pointer;
	background: transparent;
	border: var(--bw-1) solid var(--border-inv-ctl);
	border-radius: var(--r-ctl);
	color: var(--paper);
}

.sl-burger__icon {
	display: inline-flex;
}

.sl-burger__icon--close {
	display: none;
}

.sl-burger[aria-expanded="true"] .sl-burger__icon--open {
	display: none;
}

.sl-burger[aria-expanded="true"] .sl-burger__icon--close {
	display: inline-flex;
}

/* ------------------------------------------------------------
   EN/PL segmented toggle — sliding gold thumb
   ------------------------------------------------------------ */

.sl-langtoggle {
	position: relative;
	display: inline-flex;
	align-items: center;
	padding: var(--sp-2);
	border: var(--bw-1) solid var(--border-inv-ctl-2);
	border-radius: var(--r-pill);
	background: var(--surface-inv-ctl);
	font-family: var(--font-mono);
	font-size: var(--fs-11);
	font-weight: 700;
	letter-spacing: 0.08em;
}

.sl-langtoggle__thumb {
	position: absolute;
	top: var(--sp-2);
	bottom: var(--sp-2);
	left: var(--sp-2);
	width: calc(50% - var(--sp-2));
	background: var(--gold);
	border-radius: var(--r-pill);
	transition: left .18s ease;
}

.sl-langtoggle--pl .sl-langtoggle__thumb {
	left: 50%;
}

.sl-langtoggle__opt {
	position: relative;
	padding: var(--sp-6) var(--s-3);
	color: var(--n-300);
	text-decoration: none;
	transition: color .15s ease;
}

.sl-langtoggle__opt--current {
	color: var(--ink);
}

/* ------------------------------------------------------------
   Services mega-menu (desktop)
   ------------------------------------------------------------ */

.sl-mega {
	position: absolute;
	top: 100%;
	left: 0;
	right: 0;
	z-index: 49;
	background: var(--mega-bg);
	-webkit-backdrop-filter: blur(12px);
	backdrop-filter: blur(12px);
	border-top: var(--bw-1) solid var(--border-inv-soft);
	border-bottom: var(--bw-1) solid var(--gold);
	box-shadow: var(--shadow-mega);
	opacity: 0;
	visibility: hidden;
	transform: translateY(calc(-1 * var(--s-2)));
	transition: opacity .18s ease, transform .18s ease, visibility .18s;
	pointer-events: none;
}

.sl-mega.is-open {
	opacity: 1;
	visibility: visible;
	transform: none;
	pointer-events: auto;
}

.sl-mega__inner {
	max-width: var(--container-max);
	margin: 0 auto;
	padding: var(--sp-34) var(--s-6) var(--sp-26);
}

.sl-mega__grid {
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	gap: var(--sp-36);
	align-items: start;
}

.sl-mega__col-title {
	font-family: var(--font-body);
	font-size: var(--fs-11);
	font-weight: 700;
	letter-spacing: 0.16em;
	text-transform: uppercase;
	color: var(--gold);
}

.sl-mega__col-tagline {
	font-family: var(--font-body);
	font-size: var(--fs-12);
	line-height: 1.4;
	color: var(--n-400);
	margin: var(--sp-6) 0 var(--s-4);
	max-width: var(--mw-220);
}

.sl-mega__list {
	display: flex;
	flex-direction: column;
	gap: var(--sp-6);
}

.sl-mega__item {
	color: var(--n-200);
	text-decoration: none;
	display: flex;
	align-items: baseline;
	gap: var(--sp-9);
	padding: var(--sp-3) 0;
	line-height: 1.3;
	font-family: var(--font-body);
	font-size: var(--fs-13-5);
	font-weight: 500;
	transition: color .15s ease;
}

.sl-mega__item:hover,
.sl-mega__item:focus-visible {
	color: var(--gold);
}

.sl-mega__item--lead {
	color: var(--paper);
	font-size: var(--fs-15);
	font-weight: 600;
}

.sl-mega__arrow {
	color: var(--gold);
	font-weight: 700;
	opacity: .6;
	flex: none;
	transition: opacity .15s ease;
}

.sl-mega__item:hover .sl-mega__arrow,
.sl-mega__item:focus-visible .sl-mega__arrow {
	opacity: 1;
}

/* Foot strip — Ongoing Regulatory Counsel */
.sl-mega__foot {
	margin-top: var(--sp-26);
	display: flex;
	align-items: center;
	gap: var(--s-3);
	flex-wrap: wrap;
	padding: var(--s-4) var(--sp-20);
	border-left: var(--bw-3) solid var(--gold);
	background: var(--gold-tint-05);
	border-top: var(--bw-1) solid var(--border-inv-soft);
	text-decoration: none;
	transition: background-color .15s ease;
}

.sl-mega__foot:hover,
.sl-mega__foot:focus-visible {
	background: var(--gold-tint-10);
}

.sl-mega__foot-title {
	font-family: var(--font-body);
	font-size: var(--fs-14);
	font-weight: 700;
	color: var(--paper);
	letter-spacing: 0.01em;
	transition: color .15s ease;
}

.sl-mega__foot:hover .sl-mega__foot-title {
	color: var(--gold);
}

.sl-mega__arrow--foot {
	opacity: .7;
	margin-left: auto;
}

.sl-mega__foot:hover .sl-mega__arrow--foot {
	opacity: 1;
}

.sl-mega__foot-desc {
	font-family: var(--font-body);
	font-size: var(--fs-13-5);
	color: var(--n-300);
}

/* ------------------------------------------------------------
   Mobile drawer — slide-in from the right, SERVICES accordion
   ------------------------------------------------------------ */

.sl-drawer-backdrop {
	position: fixed;
	inset: 0;
	z-index: 40;
	background: var(--overlay-scrim);
	opacity: 0;
	visibility: hidden;
	pointer-events: none;
	transition: opacity .2s ease, visibility .2s ease;
}

.sl-drawer-backdrop.is-open {
	opacity: 1;
	visibility: visible;
	pointer-events: auto;
}

.sl-drawer {
	position: fixed;
	top: 0;
	right: 0;
	bottom: 0;
	z-index: 41;
	width: min(88vw, var(--drawer-w));
	background: var(--ink);
	color: var(--paper);
	border-left: var(--bw-1) solid var(--gold);
	box-shadow: var(--shadow-drawer);
	padding: var(--sp-84) var(--sp-28) var(--s-5);
	display: flex;
	flex-direction: column;
	transform: translateX(100%);
	visibility: hidden;
	transition: transform .26s cubic-bezier(0.4, 0, 0.2, 1), visibility .26s;
}

.sl-drawer.is-open {
	transform: none;
	visibility: visible;
}

/* Scrollable region — expanded SERVICES scrolls here; CTA stays pinned */
.sl-drawer__nav {
	display: flex;
	flex-direction: column;
	flex: 1 1 auto;
	min-height: 0;
	overflow-y: auto;
	-webkit-overflow-scrolling: touch;
	margin-right: calc(-1 * var(--s-3));
	padding-right: var(--s-3);
}

.sl-drawer__link {
	font-family: var(--font-display);
	font-weight: 700;
	text-transform: uppercase;
	font-size: var(--fs-22);
	letter-spacing: -0.005em;
	line-height: 1;
	color: var(--paper);
	text-decoration: none;
	width: 100%;
	min-height: var(--sp-56);
	padding: var(--sp-14) 0;
	margin: 0;
	background: transparent;
	border: none;
	border-bottom: var(--bw-1) solid var(--border-inv-soft);
	text-align: left;
	cursor: pointer;
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: var(--s-3);
	transition: color .15s ease;
}

.sl-drawer__link--active {
	color: var(--gold);
}

.sl-drawer__plus {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: var(--sp-30);
	height: var(--sp-30);
	flex: none;
	border: var(--bw-2) solid var(--gold);
	border-radius: var(--r-ctl);
	color: var(--gold);
	transition: transform .2s ease;
}

.sl-drawer__acc-btn[aria-expanded="true"] .sl-drawer__plus {
	transform: rotate(45deg);
}

.sl-drawer__acc {
	overflow: hidden;
	max-height: 0;
	border-bottom: var(--bw-1) solid var(--border-inv-soft);
	transition: max-height .28s cubic-bezier(0.4, 0, 0.2, 1);
}

.sl-drawer__acc.is-open {
	max-height: var(--drawer-acc-max);
}

.sl-drawer__acc-inner {
	padding: var(--s-1) 0 var(--sp-20);
}

.sl-drawer__group-h {
	font-family: var(--font-body);
	font-size: var(--fs-11);
	font-weight: 700;
	letter-spacing: 0.16em;
	text-transform: uppercase;
	color: var(--gold);
	margin: 0;
	padding: var(--sp-18) 0 var(--s-1);
}

.sl-drawer__svc-link {
	display: flex;
	align-items: center;
	gap: var(--sp-10);
	min-height: var(--sp-44);
	padding: var(--s-2) 0;
	text-decoration: none;
	font-family: var(--font-body);
	font-size: var(--fs-15);
	line-height: 1.3;
	color: var(--n-200);
	transition: color .15s ease;
}

.sl-drawer__svc-link--lead {
	color: var(--paper);
	font-weight: 600;
}

.sl-drawer__svc-link:hover,
.sl-drawer__svc-link:focus-visible {
	color: var(--gold);
}

.sl-drawer__ar {
	color: var(--gold);
	font-weight: 700;
	opacity: .6;
	font-family: var(--font-mono);
	flex: none;
}

.sl-drawer__svc-link:hover .sl-drawer__ar,
.sl-drawer__svc-link:focus-visible .sl-drawer__ar {
	opacity: 1;
}

.sl-drawer__foot {
	display: flex;
	align-items: center;
	gap: var(--sp-10);
	min-height: var(--sp-44);
	margin-top: var(--sp-14);
	padding: var(--s-3) var(--sp-14);
	text-decoration: none;
	border-left: var(--bw-3) solid var(--gold);
	background: var(--gold-tint-06);
	font-family: var(--font-body);
	font-size: var(--fs-14);
	font-weight: 700;
	color: var(--paper);
	transition: background-color .15s ease;
}

.sl-drawer__foot:hover,
.sl-drawer__foot:focus-visible {
	background: var(--gold-tint-14);
}

.sl-drawer__foot .sl-drawer__ar {
	margin-left: auto;
}

/* Pinned CONTACT CTA — never pushed off-screen by the accordion */
.sl-drawer__cta {
	flex: none;
	font-family: var(--font-display);
	font-weight: 700;
	text-transform: uppercase;
	font-size: var(--fs-18);
	letter-spacing: 0.02em;
	line-height: 1;
	color: var(--ink);
	background: var(--gold);
	text-decoration: none;
	min-height: var(--sp-56);
	padding: var(--sp-18) var(--sp-22);
	border-radius: var(--r-ctl);
	margin-top: var(--sp-20);
	display: flex;
	align-items: center;
	justify-content: center;
	gap: var(--sp-10);
}

.sl-drawer__cta-ar {
	font-family: var(--font-mono);
}

/* ------------------------------------------------------------
   Footer
   ------------------------------------------------------------ */

.sl-footer {
	background: var(--ink);
	color: var(--paper);
	padding: var(--sp-72) var(--s-6) var(--s-6);
	border-top: var(--bw-1) solid var(--border-inv-soft);
}

.sl-footer__grid {
	max-width: var(--container-max);
	margin: 0 auto;
	display: grid;
	grid-template-columns: 1.5fr 0.85fr 1.1fr 1.3fr;
	gap: var(--s-7);
}

.sl-footer__tagline {
	font-family: var(--font-body);
	font-size: var(--fs-14);
	color: var(--n-300);
	margin: var(--s-4) 0 var(--s-5);
	max-width: var(--mw-320);
	line-height: 1.6;
}

/* font-weight:700 is explicit on purpose — regression fix for the
   variable-Oswald port (sections.jsx:835/:860, MIGRATION-NOTES.md) */
.sl-footer__h {
	font-family: var(--font-display);
	font-weight: 700;
	text-transform: uppercase;
	font-size: var(--fs-14);
	letter-spacing: 0.08em;
	color: var(--gold);
	margin: 0 0 var(--sp-14);
}

.sl-footer__h-link {
	color: var(--gold);
	text-decoration: none;
	border-bottom: var(--bw-1) solid transparent;
	transition: border-color .15s ease;
}

.sl-footer__h-link:hover,
.sl-footer__h-link:focus-visible {
	border-bottom-color: var(--gold);
}

.sl-footer__list {
	list-style: none;
	padding: 0;
	margin: 0;
	display: flex;
	flex-direction: column;
	gap: var(--s-2);
	font-family: var(--font-body);
	font-size: var(--fs-14);
	color: var(--n-200);
}

.sl-footer__firm {
	color: var(--paper);
	font-weight: 600;
}

.sl-footer__vat {
	font-family: var(--font-mono);
	font-size: var(--fs-12);
	color: var(--n-400);
}

.sl-footer__contact-link {
	color: var(--paper);
	text-decoration: none;
	border-bottom: var(--bw-1) solid var(--gold);
}

.sl-footer__social {
	display: flex;
	gap: var(--s-2);
	margin-top: var(--sp-22);
}

.sl-footer__chip {
	font-family: var(--font-mono);
	font-size: var(--fs-11);
	padding: var(--sp-6) var(--sp-10);
	border: var(--bw-1-5) solid var(--gold);
	color: var(--gold);
	text-decoration: none;
	border-radius: var(--r-1);
	letter-spacing: 0.2px;
}

.sl-footer__list--practice {
	gap: var(--sp-10);
}

.sl-footer__practice-link {
	color: var(--n-200);
	font-weight: 400;
	text-decoration: none;
	display: inline-flex;
	align-items: center;
	gap: var(--s-2);
}

.sl-footer__practice-link--flagship {
	color: var(--paper);
	font-weight: 600;
}

.sl-footer__dot {
	width: var(--sp-6);
	height: var(--sp-6);
	background: var(--gold);
	border-radius: 50%;
	display: inline-block;
}

.sl-footer__list--insights {
	gap: var(--s-3);
}

.sl-footer__insight-link {
	color: var(--n-200);
	text-decoration: none;
	line-height: 1.4;
	display: inline-block;
	transition: color .15s ease;
}

.sl-footer__insight-link:hover,
.sl-footer__insight-link:focus-visible {
	color: var(--gold);
}

.sl-footer__news-p {
	font-family: var(--font-body);
	font-size: var(--fs-14);
	color: var(--n-200);
	margin: 0 0 var(--sp-18);
	max-width: var(--mw-360);
}

.sl-footer__news-form {
	display: flex;
	flex-direction: column;
	gap: var(--sp-10);
	max-width: var(--mw-360);
}

.sl-footer__news-input {
	background: transparent;
	border: var(--bw-2) solid var(--gold);
	border-radius: var(--r-2);
	padding: var(--s-3) var(--sp-14);
	font-family: var(--font-body);
	font-size: var(--fs-14);
	color: var(--paper);
	outline: none;
}

/* Loading / success / error states (Faza 6.8, assets/js/newsletter.js).
   Scoped override, not a change to the shared .sl-btn atom: only the
   footer newsletter button also dims while a request is in flight. */
.sl-footer__news-form .sl-btn {
	transition: background-color .15s ease, color .15s ease, opacity .15s ease;
}

.sl-footer__news-form.is-loading .sl-btn {
	opacity: 0.6;
	pointer-events: none;
}

.sl-footer__news-error {
	font-family: var(--font-body);
	font-size: var(--fs-13);
	color: var(--danger-inv);
	margin: 0;
}

/* Replaces the form outright on success — an instant swap, not an
   animated one, so there is no motion for prefers-reduced-motion to
   need to disable in the first place. */
.sl-footer__news-success {
	font-family: var(--font-body);
	font-size: var(--fs-14);
	line-height: 1.5;
	color: var(--paper);
	max-width: var(--mw-360);
	margin: 0;
	padding: var(--s-3) var(--sp-14);
	border: var(--bw-2) solid var(--gold);
	border-radius: var(--r-2);
}

/* Button — primary-gold variant (common.jsx Button) */
.sl-btn {
	font-family: var(--font-body);
	font-weight: 600;
	cursor: pointer;
	border: none;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: var(--s-2);
	transition: background-color .15s ease, color .15s ease;
	text-decoration: none;
	line-height: 1;
	font-size: var(--fs-14);
	padding: var(--s-3) var(--sp-22);
}

.sl-btn--gold {
	background: var(--gold);
	color: var(--ink);
	border-radius: var(--r-pill);
}

.sl-btn--gold:hover,
.sl-btn--gold:focus-visible {
	background: var(--gold-deep);
}

/* ghost-dark variant (common.jsx Button) — gold outline on dark */
.sl-btn--ghost {
	background: transparent;
	color: var(--gold);
	border: var(--bw-2) solid var(--gold);
	border-radius: var(--r-2);
}

.sl-btn--ghost:hover,
.sl-btn--ghost:focus-visible {
	background: var(--gold);
	color: var(--ink);
}

.sl-btn--lg {
	font-size: var(--fs-16);
	padding: var(--s-4) var(--sp-28);
}

/* size="sm" variant (common.jsx Button) — hub TOC rail CTA */
.sl-btn--sm {
	font-size: var(--fs-13);
	padding: var(--s-2) var(--sp-14);
}

.sl-btn__arrow {
	font-weight: 700;
	display: inline-block;
	transform: translateY(-1px);
}

.sl-footer__bottom {
	max-width: var(--container-max);
	margin: var(--sp-56) auto 0;
	padding-top: var(--s-5);
	border-top: var(--bw-1) solid var(--border-inv-soft);
	display: flex;
	justify-content: space-between;
	flex-wrap: wrap;
	gap: var(--s-3);
}

.sl-footer__copy {
	font-family: var(--font-mono);
	font-size: var(--fs-11);
	color: var(--n-400);
	letter-spacing: 0.04em;
}

.sl-footer__legal {
	display: inline-flex;
	gap: var(--sp-18);
	flex-wrap: wrap;
}

.sl-footer__legal-link {
	font-family: var(--font-mono);
	font-size: var(--fs-11);
	color: var(--n-400);
	letter-spacing: 0.04em;
	text-decoration: none;
	transition: color .15s ease;
}

.sl-footer__legal-link:hover,
.sl-footer__legal-link:focus-visible {
	color: var(--gold);
}

/* ------------------------------------------------------------
   Responsive
   ------------------------------------------------------------ */

@media (max-width: 1100px) {
	.sl-footer__grid {
		grid-template-columns: 1fr 1fr;
	}
}

@media (max-width: 920px) {
	.sl-header__nav {
		display: none;
	}

	.sl-burger {
		display: inline-flex;
	}

	.sl-mega {
		display: none;
	}
}

@media (max-width: 640px) {
	.sl-footer__grid {
		grid-template-columns: 1fr;
	}
}
