/* =========================================================================
   I Kongres Prawa Migracyjnego i Uchodźczego
   -------------------------------------------------------------------------
   Paleta przeniesiona ze strony wzorcowej (granat / turkus / pomarańcz).
   Typografia: Lato — jeden krój na całą stronę (300 / 400 / 400 kursywa / 700).
   Uwaga: Lato ma grubości 300/400/700 — nie ma 500 ani 600.
   ========================================================================= */

/* ---------- 1. Tokeny ---------- */
:root {
	/* granaty — #05223e pobrany wprost z grafiki kluczowej Kongresu */
	--navy-900: #04192d;
	--navy-800: #05223e;
	--navy-700: #062944;
	--navy-600: #0a3557;
	--navy-500: #14456b;

	/* turkusy */
	--teal-700: #1f7a6f;
	--teal-600: #278f82;
	--teal-500: #3e9f93;
	--teal-400: #54b7aa;

	/* akcenty */
	--ember-600: #cc3f1b;
	--ember-700: #bd3612; /* wariant do drobnego tekstu na jasnym tle — kontrast AA */
	--ember-500: #e94f28;
	--amber-500: #f0a92a;
	--azure-500: #2a7cb8;

	/* neutralne */
	--paper: #f3f5f4;
	--shell: #e8edeb;
	--card: #ffffff;
	--line: #dae2e0;
	--line-strong: #c3cfcc;
	--ink: #0e2233;
	--ink-soft: #3c4d59;
	--muted: #5f6a70;

	/* neutralne na granacie */
	--on-navy: #eef3f6;
	--on-navy-muted: #9db2c2;
	--on-navy-line: rgba(255, 255, 255, .14);

	/* typografia */
	/* Jeden krój w całym projekcie. Hierarchię niesie grubość i stopień,
	   a nie zmiana rodziny — Lato ma 300, 400 i 700. */
	--font-display: 'Lato', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
	--font-body: 'Lato', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
	/* Etykiety składa ten sam krój co tekst — rolę niesie rozmiar,
	   grubość i światło, a nie osobna rodzina. */
	--font-label: 'Lato', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;

	/* rytm */
	--wrap: 1200px;
	--wrap-narrow: 780px;
	--gutter: clamp(1.25rem, 4vw, 2.5rem);
	--section-y: clamp(4.5rem, 8vw, 7.5rem);
	--topbar-h: 68px;

	/* kształt */
	--r-xs: 4px;
	--r-sm: 8px;
	--r-md: 14px;
	--r-lg: 22px;
	--shadow-card: 0 1px 2px rgba(6, 41, 68, .05), 0 12px 32px -12px rgba(6, 41, 68, .18);
	--shadow-lift: 0 2px 4px rgba(6, 41, 68, .06), 0 24px 56px -20px rgba(6, 41, 68, .32);
}

/* ---------- 2. Reset i baza ---------- */
*,
*::before,
*::after {
	box-sizing: border-box;
}

html {
	-webkit-text-size-adjust: 100%;
	scroll-behavior: smooth;
}

body {
	margin: 0;
	background: var(--paper);
	color: var(--ink);
	font-family: var(--font-body);
	font-size: 1.0625rem;
	line-height: 1.65;
	font-optical-sizing: auto;
	-webkit-font-smoothing: antialiased;
	overflow-x: hidden;
}

img,
svg {
	max-width: 100%;
}

img {
	height: auto;
}

h1, h2, h3, h4, h5 {
	margin: 0;
	font-weight: 700;
	line-height: 1.15;
	text-wrap: balance;
}

p {
	margin: 0;
}

ul, ol, dl, dd {
	margin: 0;
	padding: 0;
}

ul, ol {
	list-style: none;
}

a {
	color: var(--teal-700);
	text-decoration-thickness: 1px;
	text-underline-offset: .18em;
}

a:hover {
	color: var(--navy-700);
}

button {
	font: inherit;
	color: inherit;
}

:focus-visible {
	outline: 2px solid var(--ember-500);
	outline-offset: 3px;
	border-radius: var(--r-xs);
}

.skip-link {
	position: absolute;
	left: -9999px;
	z-index: 100;
	padding: .75rem 1.25rem;
	background: var(--navy-700);
	color: #fff;
	border-radius: 0 0 var(--r-sm) 0;
	text-decoration: none;
}

.skip-link:focus {
	left: 0;
	top: 0;
	color: #fff;
}

/* ---------- 3. Układ ---------- */
.wrap {
	width: 100%;
	max-width: var(--wrap);
	margin-inline: auto;
	padding-inline: var(--gutter);
}

.wrap--narrow {
	max-width: var(--wrap-narrow);
}

.section {
	position: relative;
	padding-block: var(--section-y);
	scroll-margin-top: calc(var(--topbar-h) + 8px);
}

/* Podstrona zaczyna się od razu treścią, więc musi zostawić miejsce
   na przyklejony pasek górny. */
.section--subpage { padding-top: calc(var(--topbar-h) + clamp(2.5rem, 5vw, 4.5rem)); }

.section--paper { background: var(--paper); }
.section--shell { background: var(--shell); }

.section--navy {
	background: var(--navy-800);
	color: var(--on-navy);
}

.section--navy a { color: var(--teal-400); }
.section--navy a:hover { color: #fff; }

/* ---------- 4. Typografia wspólna ---------- */
.eyebrow {
	margin: 0 0 1rem;
	font-family: var(--font-label);
	font-weight: 700;
	font-size: 1rem;
	letter-spacing: .09em;
	text-transform: uppercase;
	color: var(--ember-700);
}

.section-head {
	max-width: 46rem;
	margin-bottom: clamp(2.5rem, 4vw, 3.75rem);
}

.section-head .eyebrow {
	position: relative;
	padding-left: 2.75rem;
}

.section-head .eyebrow::before {
	content: '';
	position: absolute;
	left: 0;
	top: .52em;
	width: 2rem;
	height: 1px;
	background: var(--ember-500);
}

.section-title {
	font-family: var(--font-display);
	font-weight: 700;
	font-size: clamp(1.8rem, 1.15rem + 2.1vw, 2.7rem);
	letter-spacing: -.022em;
	line-height: 1.1;
	color: var(--navy-700);
}

.section-lead {
	margin-top: 1.25rem;
	max-width: 40rem;
	font-size: 1.125rem;
	color: var(--ink-soft);
}

.section-head--dark .eyebrow { color: var(--amber-500); }
.section-head--dark .eyebrow::before { background: var(--amber-500); }
.section-head--dark .section-title { color: #fff; }
.section-head--dark .section-lead { color: var(--on-navy-muted); }

.prose > * + * { margin-top: 1.15em; }

.prose {
	max-width: 62ch;
	color: var(--ink-soft);
}

/* Akapit wprowadzający, nie nagłówek — po zejściu na jeden krój trzeba go
   wyraźniej odsunąć stopniem od tytułu sekcji. */
.prose__lead {
	font-family: var(--font-display);
	font-weight: 400;
	font-size: clamp(1.15rem, 1.05rem + .4vw, 1.35rem);
	line-height: 1.6;
	color: var(--navy-700);
}

.prose--dark { color: var(--on-navy-muted); }
.prose--fine { font-size: .9375rem; }

.tag {
	display: inline-block;
	padding: .16em .55em;
	border: 1px solid var(--line-strong);
	border-radius: var(--r-xs);
	background: rgba(255, 255, 255, .6);
	font-family: var(--font-label);
	font-weight: 400;
	font-size: .75rem;
	letter-spacing: .02em;
	color: var(--navy-700);
	white-space: nowrap;
}

.tag--muted {
	background: transparent;
	color: var(--muted);
}

.tag--dark {
	border-color: var(--on-navy-line);
	background: rgba(255, 255, 255, .06);
	color: var(--on-navy);
}

.chips {
	display: flex;
	flex-wrap: wrap;
	gap: .5rem;
}

.chip {
	padding: .34em .8em;
	border: 1px solid var(--line-strong);
	border-radius: 999px;
	background: var(--card);
	font-size: .8125rem;
	line-height: 1.4;
	color: var(--ink-soft);
}

.chips--tight .chip {
	font-size: .78125rem;
	padding: .28em .7em;
}

.icon {
	width: 1.25em;
	height: 1.25em;
	flex: none;
}

.link-arrow {
	display: inline-flex;
	align-items: center;
	gap: .45rem;
	margin-top: .9rem;
	font-family: var(--font-label);
	font-weight: 400;
	font-size: .8125rem;
	letter-spacing: .04em;
	text-decoration: none;
	border-bottom: 1px solid currentColor;
	padding-bottom: 1px;
}

.link-arrow__icon {
	width: 1em;
	height: 1em;
	transition: transform .25s ease;
}

.link-arrow:hover .link-arrow__icon { transform: translateX(3px); }

/* ---------- 5. Przyciski ---------- */
.btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: .55rem;
	padding: .78rem 1.5rem;
	border: 1px solid transparent;
	border-radius: 999px;
	font-family: var(--font-body);
	font-size: .9375rem;
	font-weight: 700;
	letter-spacing: .005em;
	text-decoration: none;
	cursor: pointer;
	transition: background-color .2s ease, border-color .2s ease, color .2s ease, transform .2s ease;
}

.btn__icon {
	width: 1.05em;
	height: 1.05em;
	transition: transform .25s ease;
}

.btn:hover .btn__icon { transform: translateX(3px); }

.btn--primary {
	background: var(--ember-500);
	border-color: var(--ember-500);
	color: #fff;
}

.btn--primary:hover {
	background: var(--ember-600);
	border-color: var(--ember-600);
	color: #fff;
}

.btn--ghost {
	background: transparent;
	border-color: rgba(255, 255, 255, .35);
	color: #fff;
}

.btn--ghost:hover {
	background: rgba(255, 255, 255, .1);
	border-color: rgba(255, 255, 255, .6);
	color: #fff;
}

.btn--outline {
	background: transparent;
	border-color: var(--line-strong);
	color: var(--navy-700);
}

.btn--outline:hover {
	border-color: var(--navy-700);
	background: var(--navy-700);
	color: #fff;
}

.btn--sm { padding: .5rem 1rem; font-size: .84375rem; }
.btn--lg { padding: .95rem 2rem; font-size: 1rem; }

.btn.is-disabled,
.btn[aria-disabled='true'] {
	opacity: .5;
	cursor: default;
	pointer-events: none;
}

.btn[disabled] { opacity: .6; cursor: progress; }

/* ---------- 6. Górny pasek ---------- */
.topbar {
	position: fixed;
	inset: 0 0 auto;
	z-index: 50;
	transition: background-color .3s ease, box-shadow .3s ease, border-color .3s ease;
	border-bottom: 1px solid transparent;
}

.topbar__inner {
	display: flex;
	align-items: center;
	gap: 1.5rem;
	max-width: var(--wrap);
	min-height: var(--topbar-h);
	margin-inline: auto;
	padding-inline: var(--gutter);
}

.topbar.is-stuck {
	background: rgba(5, 34, 62, .92);
	backdrop-filter: saturate(1.4) blur(12px);
	border-bottom-color: var(--on-navy-line);
}

.topbar__progress {
	position: absolute;
	inset: auto 0 -1px;
	height: 2px;
	background: transparent;
	opacity: 0;
	transition: opacity .3s ease;
}

.topbar.is-stuck .topbar__progress { opacity: 1; }

.topbar__progress span {
	display: block;
	height: 100%;
	width: var(--progress, 0%);
	background: var(--ember-500);
	transition: width .1s linear;
}

.wordmark {
	display: grid;
	gap: 1px;
	margin-right: auto;
	text-decoration: none;
	color: #fff;
}

.wordmark__main {
	font-family: var(--font-display);
	font-weight: 700;
	font-size: 1.2rem;
	line-height: 1.1;
	letter-spacing: -.01em;
}

.wordmark__sub {
	font-family: var(--font-label);
	font-weight: 700;
	font-size: .625rem;
	letter-spacing: .11em;
	text-transform: uppercase;
	color: var(--on-navy-muted);
}

.nav {
	display: flex;
	align-items: center;
	gap: 1.5rem;
}

.nav__list {
	display: flex;
	align-items: center;
	gap: 1.35rem;
}

.nav__link {
	position: relative;
	display: block;
	padding-block: .35rem;
	font-size: .84375rem;
	letter-spacing: .005em;
	color: rgba(255, 255, 255, .78);
	text-decoration: none;
	white-space: nowrap;
	transition: color .2s ease;
}

.nav__link::after {
	content: '';
	position: absolute;
	left: 0;
	right: 0;
	bottom: 0;
	height: 1px;
	background: var(--amber-500);
	transform: scaleX(0);
	transform-origin: left;
	transition: transform .25s ease;
}

.nav__link:hover,
.nav__link.is-current {
	color: #fff;
}

.nav__link.is-current::after { transform: scaleX(1); }

.nav-toggle {
	display: none;
	align-items: center;
	gap: .55rem;
	padding: .5rem .9rem .5rem .75rem;
	background: transparent;
	border: 1px solid rgba(255, 255, 255, .3);
	border-radius: 999px;
	color: #fff;
	font-family: var(--font-label);
	font-weight: 700;
	font-size: .75rem;
	letter-spacing: .1em;
	text-transform: uppercase;
	cursor: pointer;
}

.nav-toggle__bars {
	display: grid;
	gap: 4px;
	width: 16px;
}

.nav-toggle__bars i {
	display: block;
	height: 1.5px;
	background: currentColor;
	transition: transform .25s ease, opacity .25s ease;
}

.nav-toggle[aria-expanded='true'] .nav-toggle__bars i:first-child { transform: translateY(2.75px) rotate(45deg); }
.nav-toggle[aria-expanded='true'] .nav-toggle__bars i:last-child { transform: translateY(-2.75px) rotate(-45deg); }

/* ---------- 7. Hero ---------- */
.hero {
	position: relative;
	display: flex;
	align-items: center;
	min-height: min(92svh, 860px);
	padding-block: calc(var(--topbar-h) + clamp(3rem, 7vw, 6rem)) clamp(3rem, 6vw, 5rem);
	background: var(--navy-800);
	color: var(--on-navy);
	overflow: hidden;
}

.hero::after {
	content: '';
	position: absolute;
	inset: 0;
	background:
		linear-gradient(100deg, var(--navy-800) 26%, rgba(5, 34, 62, .72) 46%, rgba(5, 34, 62, 0) 66%),
		linear-gradient(to bottom, rgba(4, 25, 45, .55), rgba(4, 25, 45, 0) 30%);
	pointer-events: none;
}

.hero__art {
	position: absolute;
	inset: 0;
}

.routes {
	width: 100%;
	height: 100%;
	display: block;
}

.hero__body {
	position: relative;
	z-index: 2;
	width: 100%;
	max-width: var(--wrap);
	margin-inline: auto;
	padding-inline: var(--gutter);
}

.hero__eyebrow {
	font-family: var(--font-label);
	font-weight: 700;
	font-size: .75rem;
	letter-spacing: .18em;
	text-transform: uppercase;
	color: var(--teal-400);
}

.hero__title {
	margin-top: 1.5rem;
	text-wrap: nowrap;
}

.hero__title-lead {
	display: block;
	font-family: var(--font-display);
	font-weight: 700;
	font-size: clamp(2.6rem, 1.4rem + 5.2vw, 5rem);
	line-height: 1;
	letter-spacing: -.03em;
	color: #fff;
}

.hero__title-rest {
	display: block;
	margin-top: .35rem;
	font-family: var(--font-body);
	font-size: clamp(1.35rem, .95rem + 1.7vw, 2.25rem);
	font-weight: 300;
	line-height: 1.2;
	letter-spacing: -.01em;
	color: rgba(255, 255, 255, .93);
}

.hero__claim {
	display: flex;
	align-items: center;
	gap: 1rem;
	margin-top: 1.75rem;
	font-family: var(--font-label);
	font-weight: 700;
	font-size: .8125rem;
	letter-spacing: .13em;
	text-transform: uppercase;
	color: var(--amber-500);
}

.hero__claim-rule {
	width: clamp(2.5rem, 8vw, 5.5rem);
	height: 1px;
	background: linear-gradient(90deg, var(--ember-500), var(--amber-500));
}

.hero__lead {
	margin-top: 1.5rem;
	max-width: 42ch;
	font-size: clamp(1rem, .95rem + .25vw, 1.1875rem);
	color: rgba(238, 243, 246, .82);
}

.hero__actions {
	display: flex;
	flex-wrap: wrap;
	gap: .85rem;
	margin-top: 2.25rem;
}

.hero__facts {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: clamp(1rem, 3vw, 2.5rem);
	max-width: 46rem;
	margin-top: clamp(3rem, 6vw, 4.5rem);
	padding-top: 1.6rem;
	border-top: 1px solid var(--on-navy-line);
}

.fact__label {
	font-family: var(--font-label);
	font-weight: 700;
	font-size: .6875rem;
	letter-spacing: .14em;
	text-transform: uppercase;
	color: var(--on-navy-muted);
}

.fact__value {
	margin-top: .45rem;
	font-size: .9375rem;
	line-height: 1.45;
	color: #fff;
}

/* trasy w grafice hero */
.route {
	fill: none;
	stroke-width: 2;
}

.route--dashed { stroke-dasharray: 5 11; stroke-width: 1.75; }
.route--teal  { stroke: var(--teal-500); opacity: .85; }
.route--white { stroke: rgba(226, 238, 245, .5); }
.route--pale  { stroke: rgba(157, 178, 194, .62); }
.route--dim   { stroke: #2f5b7a; }
.route--ember { stroke: url(#emberRoute); stroke-width: 2.25; }

.globe__rim,
.globe__grid {
	fill: none;
	stroke: rgba(84, 183, 170, .22);
	stroke-width: 1;
}

.globe__rim { stroke: rgba(84, 183, 170, .34); }

.node { stroke: none; }
.node--white { fill: #fff; }
.node--pale  { fill: #b9cbd8; }
.node--teal  { fill: var(--teal-400); }
.node--ember { fill: var(--ember-500); }
.node--amber { fill: var(--amber-500); }
.node--azure { fill: var(--azure-500); }

/* ---------- 8. O kongresie ---------- */
.about {
	display: grid;
	grid-template-columns: minmax(0, 1.55fr) minmax(0, 1fr);
	gap: clamp(2rem, 5vw, 4.5rem);
	align-items: start;
}

/* Sekcja korzysta z całej szerokości strony: opis w szerokiej kolumnie,
   warunki udziału i lista uczestników obok — zamiast pustego marginesu. */
.about--wide { grid-template-columns: minmax(0, 1.55fr) minmax(0, 1fr); }
.about--wide .about__prose { max-width: none; }
.about--wide .about__aside { display: grid; gap: 2rem; align-content: start; }
.about--wide .facts-list { margin-top: 0; }
.about--wide .audience { margin-top: 0; padding-top: 0; border-top: 0; }

/* pkt 8 — warunki udziału pod opisem */
.facts-list {
	display: grid;
	gap: .55rem;
	margin-top: 2rem;
	padding: 1.25rem 1.4rem;
	background: var(--card);
	border: 1px solid var(--line);
	border-radius: var(--r-sm);
}

.facts-list__item {
	position: relative;
	padding-left: 1.4rem;
	font-size: .9375rem;
	line-height: 1.55;
	color: var(--ink);
}

.facts-list__item::before {
	content: '';
	position: absolute;
	left: 0;
	top: .58em;
	width: 6px;
	height: 6px;
	border-radius: 50%;
	background: var(--teal-500);
}

.audience {
	margin-top: 2.5rem;
	padding-top: 1.75rem;
	border-top: 1px solid var(--line);
}

.audience__label {
	margin-bottom: .9rem;
	font-family: var(--font-label);
	font-weight: 700;
	font-size: .6875rem;
	letter-spacing: .14em;
	text-transform: uppercase;
	color: var(--muted);
}

/* ---------- 9. Program ---------- */
.program__bar {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: space-between;
	gap: 1rem;
	margin-bottom: 2.25rem;
}

.notice {
	display: flex;
	align-items: flex-start;
	gap: .7rem;
	padding: .85rem 1.1rem;
	border-radius: var(--r-sm);
	font-size: .875rem;
	line-height: 1.55;
}

.notice--inline {
	background: rgba(240, 169, 42, .12);
	border: 1px solid rgba(240, 169, 42, .38);
	color: var(--ink-soft);
}

.notice__icon { color: var(--ember-700); margin-top: .12em; }

.notice--warn {
	gap: 0;
	display: block;
	padding: 1.1rem 1.25rem 1.1rem 1.4rem;
	border: 1px solid rgba(233, 79, 40, .3);
	border-left: 3px solid var(--ember-500);
	border-radius: 0 var(--r-sm) var(--r-sm) 0;
	background: rgba(233, 79, 40, .07);
	color: var(--ink-soft);
	font-size: .9375rem;
}

.notice--warn strong {
	display: block;
	margin-bottom: .2rem;
	color: var(--ember-700);
}

/* ---- przełącznik dni ---- */
.daytabs {
	display: flex;
	flex-wrap: wrap;
	gap: .5rem;
	margin-bottom: 2rem;
}

.daytabs[hidden] { display: none; }

.daytabs__btn {
	display: grid;
	gap: .1rem;
	padding: .7rem 1.35rem;
	border: 1px solid var(--line-strong);
	border-radius: var(--r-sm);
	background: var(--card);
	text-align: left;
	cursor: pointer;
	transition: border-color .2s ease, background-color .2s ease, color .2s ease;
}

.daytabs__btn:hover { border-color: var(--navy-700); }

.daytabs__btn.is-active {
	background: var(--navy-800);
	border-color: var(--navy-800);
	color: #fff;
}

.daytabs__label {
	font-family: var(--font-label);
	font-weight: 700;
	font-size: .6875rem;
	letter-spacing: .14em;
	text-transform: uppercase;
	color: var(--ember-700);
}

.daytabs__btn.is-active .daytabs__label { color: var(--amber-500); }

.daytabs__date {
	font-family: var(--font-display);
	font-weight: 700;
	font-size: 1.2rem;
	line-height: 1.2;
	color: var(--navy-700);
}

.daytabs__btn.is-active .daytabs__date { color: #fff; }

/* ---- harmonogram dnia ---- */
.agenda[hidden] { display: none; }
.agenda + .agenda { margin-top: clamp(3rem, 6vw, 4.5rem); }

.agenda__head {
	padding-bottom: 1.25rem;
	margin-bottom: 1.75rem;
	border-bottom: 1px solid var(--line-strong);
}

.agenda__head[hidden] { display: none; }

.agenda__label {
	font-family: var(--font-label);
	font-weight: 700;
	font-size: .6875rem;
	letter-spacing: .16em;
	text-transform: uppercase;
	color: var(--ember-700);
}

.agenda__date {
	margin-top: .4rem;
	font-family: var(--font-display);
	font-weight: 700;
	font-size: clamp(1.45rem, 1.2rem + .9vw, 1.9rem);
	letter-spacing: -.015em;
	color: var(--navy-700);
}

.agenda__weekday { font-size: .875rem; color: var(--muted); }

.agenda__list { display: grid; gap: 1.25rem; }

/* Punkt programu: wąska kolumna czasu + treść na całej pozostałej szerokości. */
.slot {
	display: grid;
	grid-template-columns: 8.5rem minmax(0, 1fr);
	gap: clamp(1rem, 2.5vw, 2rem);
	padding: 1.35rem 1.5rem 1.35rem 1.25rem;
	background: var(--card);
	border: 1px solid var(--line);
	border-left: 3px solid var(--line-strong);
	border-radius: var(--r-sm);
}

.slot--opening { border-left-color: var(--navy-600); }
.slot--plenary { border-left-color: var(--teal-600); }
.slot--panels  { border-left-color: var(--teal-400); }
.slot--keynote { border-left-color: var(--ember-500); }
.slot--social  { border-left-color: var(--amber-500); }
.slot--film    { border-left-color: var(--azure-500); }

/* Przerwy i obiad to punkty porządkowe — mają być ciszej niż sesje. */
.slot--break,
.slot--lunch,
.slot--registration {
	padding-block: .9rem;
	background: transparent;
	border-color: transparent;
	border-left-color: var(--line-strong);
}

.slot--break .slot__title,
.slot--lunch .slot__title,
.slot--registration .slot__title {
	font-size: .9375rem;
	font-weight: 400;
	color: var(--muted);
}

.slot__when { display: grid; gap: .15rem; align-content: start; }

.slot__time {
	font-family: var(--font-label);
	font-weight: 700;
	font-size: 1rem;
	color: var(--navy-700);
	font-variant-numeric: tabular-nums;
	white-space: nowrap;
}

.slot--break .slot__time,
.slot--lunch .slot__time,
.slot--registration .slot__time { font-weight: 400; color: var(--muted); }

.slot__kind {
	font-family: var(--font-label);
	font-weight: 700;
	font-size: .625rem;
	letter-spacing: .12em;
	text-transform: uppercase;
	color: var(--muted);
}

.slot__main { min-width: 0; }

.slot__headline {
	display: flex;
	flex-wrap: wrap;
	align-items: baseline;
	gap: .5rem .75rem;
}

.slot__title {
	font-size: 1.0625rem;
	font-weight: 700;
	line-height: 1.35;
	color: var(--navy-700);
	max-width: 62ch;
}

.slot--keynote .slot__title,
.slot--plenary .slot__title {
	font-size: clamp(1.15rem, 1.05rem + .3vw, 1.35rem);
}

.slot__role {
	margin-top: 1rem;
	font-family: var(--font-label);
	font-weight: 700;
	font-size: .625rem;
	letter-spacing: .12em;
	text-transform: uppercase;
	color: var(--muted);
}

.slot__note {
	margin-top: .9rem;
	font-size: .9375rem;
	line-height: 1.6;
	color: var(--ink-soft);
	max-width: 68ch;
}

/* ---- osoby ---- */
.people { display: grid; gap: .35rem; margin-top: .45rem; }

/* Flex z zawijaniem, nie siatka kolumnowa: przy trzech prowadzących
   `grid-auto-columns: max-content` nie miało jak się złamać i rozpychało
   stronę w poziomie. */
.people--inline {
	display: flex;
	flex-wrap: wrap;
	gap: .35rem 1.75rem;
}

.people--inline .people__item { max-width: 100%; }

.people--tight { gap: .3rem; }

.people__item { font-size: .9375rem; line-height: 1.45; color: var(--ink); }

.people__org {
	display: block;
	font-size: .8125rem;
	color: var(--muted);
}

/* ---- ścieżki równoległe ---- */
/* Kolumny wprost, nie przez auto-fit z `min(…, 100%)`: ta konstrukcja
   wewnątrz zagnieżdżonej siatki nie ma do czego odnieść procentu i wymusza
   sztywne 20rem na ścieżkę, co rozpychało stronę w poziomie przy ~768 px. */
.tracks {
	display: grid;
	grid-template-columns: minmax(0, 1fr);
	gap: clamp(.85rem, 1.8vw, 1.25rem);
	margin-top: 1.1rem;
}

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

@media (min-width: 1200px) {
	.tracks--3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}

.track {
	display: flex;
	flex-direction: column;
	min-width: 0;
	padding: 1.1rem 1.15rem 1.25rem;
	background: var(--shell);
	border: 1px solid var(--line);
	border-radius: var(--r-sm);
}

.track--flagged {
	background: rgba(240, 169, 42, .09);
	border-color: rgba(240, 169, 42, .4);
}

.track__head {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: .5rem;
	margin-bottom: .7rem;
}

.track__badge {
	font-family: var(--font-label);
	font-weight: 700;
	font-size: .625rem;
	letter-spacing: .12em;
	text-transform: uppercase;
	color: var(--ember-700);
}

.track__title {
	font-family: var(--font-display);
	font-weight: 700;
	font-size: 1.125rem;
	line-height: 1.3;
	color: var(--navy-700);
}

.track__subtitle {
	margin-top: .35rem;
	font-size: .875rem;
	color: var(--ink-soft);
}

.track__role {
	margin-top: .9rem;
	font-family: var(--font-label);
	font-weight: 700;
	font-size: .625rem;
	letter-spacing: .12em;
	text-transform: uppercase;
	color: var(--muted);
}

.talks {
	display: grid;
	gap: .85rem;
	margin-top: 1rem;
	padding-top: .9rem;
	border-top: 1px solid var(--line-strong);
}

.talk__speaker { font-size: .9375rem; font-weight: 700; color: var(--navy-700); line-height: 1.4; }

.talk__org {
	display: block;
	font-size: .8125rem;
	font-weight: 400;
	color: var(--muted);
}

.talk__title {
	margin-top: .2rem;
	font-size: .875rem;
	line-height: 1.55;
	color: var(--ink-soft);
}

.talk__title--tbc { color: var(--muted); font-style: italic; }

/* ---------- 10. Formularz ---------- */
.card {
	background: var(--card);
	border-radius: var(--r-lg);
	box-shadow: var(--shadow-lift);
}

.card--form {
	padding: clamp(1.5rem, 4vw, 3rem);
	color: var(--ink);
}

.regform__hint {
	font-size: .875rem;
	color: var(--muted);
}

.required { color: var(--ember-500); }

/* Treść wyłącznie dla technologii asystujących. */
.sr-only {
	position: absolute;
	width: 1px;
	height: 1px;
	padding: 0;
	margin: -1px;
	overflow: hidden;
	clip-path: inset(50%);
	white-space: nowrap;
	border: 0;
}

.hp {
	position: absolute;
	width: 1px;
	height: 1px;
	overflow: hidden;
	clip-path: inset(50%);
	white-space: nowrap;
}

.alert {
	margin-top: 1.25rem;
	padding: .9rem 1.15rem;
	border: 1px solid rgba(204, 63, 27, .35);
	border-radius: var(--r-sm);
	background: rgba(233, 79, 40, .08);
	color: var(--ember-700);
	font-size: .9375rem;
}

.fieldset {
	margin: 0;
	padding: 2rem 0 0;
	border: 0;
}

.fieldset + .fieldset {
	margin-top: 2.25rem;
	border-top: 1px solid var(--line);
}

.fieldset__legend {
	display: flex;
	align-items: center;
	gap: .75rem;
	/* Odstęp pod legendą daje reguła `.fieldset > * + *` — własny margines
	   dokładałby się do niego i podwajał przerwę. */
	padding: 0;
	font-family: var(--font-display);
	font-weight: 700;
	font-size: 1.375rem;
	color: var(--navy-700);
}

.fieldset__num {
	display: grid;
	place-items: center;
	width: 1.6rem;
	height: 1.6rem;
	border: 1px solid var(--line-strong);
	border-radius: 50%;
	font-family: var(--font-label);
	font-weight: 400;
	font-size: .75rem;
	color: var(--muted);
}

.grid { display: grid; gap: 1.25rem; }
.grid--2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }

.field { display: block; min-width: 0; }

/* Odstępy tylko między bezpośrednimi blokami sekcji formularza —
   wewnątrz .grid odstępy daje `gap`, więc pola pozostają wyrównane. */
.fieldset > * + * { margin-top: 1.6rem; }

.field--group {
	margin-inline: 0;
	padding: 0;
	border: 0;
}

.field__label {
	display: block;
	margin-bottom: .5rem;
	padding: 0;
	font-size: .9375rem;
	font-weight: 700;
	line-height: 1.45;
	color: var(--navy-700);
}

.field__help {
	margin: -.2rem 0 .6rem;
	font-size: .84375rem;
	line-height: 1.55;
	color: var(--muted);
}

.field__error {
	margin-top: .45rem;
	font-size: .84375rem;
	font-weight: 700;
	color: var(--ember-700);
}

.input {
	display: block;
	width: 100%;
	padding: .75rem .9rem;
	border: 1px solid var(--line-strong);
	border-radius: var(--r-sm);
	background: #fbfcfc;
	font: inherit;
	font-size: 1rem;
	color: var(--ink);
	transition: border-color .2s ease, box-shadow .2s ease, background-color .2s ease;
}

.input::placeholder { color: #9aa5aa; }

.input:hover { border-color: var(--muted); }

.input:focus {
	outline: none;
	background: #fff;
	border-color: var(--teal-600);
	box-shadow: 0 0 0 3px rgba(39, 143, 130, .16);
}

.input[aria-invalid='true'] {
	border-color: var(--ember-500);
	box-shadow: 0 0 0 3px rgba(233, 79, 40, .12);
}

textarea.input { resize: vertical; min-height: 5.5rem; line-height: 1.6; }

.choices { display: grid; gap: .6rem; }

.choices--row {
	grid-auto-flow: column;
	grid-auto-columns: minmax(0, 1fr);
}

.choice {
	position: relative;
	display: flex;
	align-items: flex-start;
	gap: .7rem;
	padding: .7rem .9rem;
	border: 1px solid var(--line-strong);
	border-radius: var(--r-sm);
	background: #fbfcfc;
	font-size: .9375rem;
	line-height: 1.45;
	cursor: pointer;
	transition: border-color .2s ease, background-color .2s ease;
}

.choice:hover { border-color: var(--teal-600); background: #fff; }

.choice input {
	position: absolute;
	opacity: 0;
	width: 1px;
	height: 1px;
	margin: 0;
}

.choice__mark {
	position: relative;
	flex: none;
	width: 1.125rem;
	height: 1.125rem;
	margin-top: .1rem;
	border: 1.5px solid var(--line-strong);
	border-radius: 50%;
	background: #fff;
	transition: border-color .2s ease, background-color .2s ease;
}

.choice__mark--square { border-radius: var(--r-xs); }

.choice__mark::after {
	content: '';
	position: absolute;
	inset: 50%;
	width: .5rem;
	height: .5rem;
	margin: -.25rem 0 0 -.25rem;
	border-radius: 50%;
	background: #fff;
	transform: scale(0);
	transition: transform .18s ease;
}

.choice__mark--square::after {
	width: .5rem;
	height: .3rem;
	margin: -.24rem 0 0 -.25rem;
	border: 1.75px solid #fff;
	border-top: 0;
	border-right: 0;
	border-radius: 1px;
	background: none;
	transform: rotate(-45deg) scale(0);
}

.choice input:checked ~ .choice__mark {
	border-color: var(--teal-600);
	background: var(--teal-600);
}

.choice input:checked ~ .choice__mark::after { transform: scale(1); }
.choice input:checked ~ .choice__mark--square::after { transform: rotate(-45deg) scale(1); }

.choice:has(input:checked) {
	border-color: var(--teal-600);
	background: rgba(39, 143, 130, .06);
}

.choice input:focus-visible ~ .choice__mark {
	outline: 2px solid var(--ember-500);
	outline-offset: 2px;
}

.choice--check { align-items: flex-start; border: 0; background: none; padding: 0; }
.choice--check:hover { background: none; }
.choice--check:has(input:checked) { background: none; }

.choice__text--fine {
	font-size: .8125rem;
	line-height: 1.6;
	color: var(--muted);
}

.consent + .consent { margin-top: 1.25rem; }

.regform__submit {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 1rem 1.5rem;
	margin-top: 2.25rem;
	padding-top: 2rem;
	border-top: 1px solid var(--line);
}

.regform__note {
	font-size: .84375rem;
	color: var(--muted);
}

.is-conditional[hidden] { display: none; }

.thanks { text-align: center; padding-block: 1rem; }

.thanks__mark {
	display: grid;
	place-items: center;
	width: 3.25rem;
	height: 3.25rem;
	margin: 0 auto 1.25rem;
	border-radius: 50%;
	background: rgba(39, 143, 130, .12);
	color: var(--teal-700);
}

.thanks__mark svg { width: 1.75rem; height: 1.75rem; }

.thanks__title {
	font-family: var(--font-display);
	font-weight: 700;
	font-size: 1.75rem;
	color: var(--navy-700);
}

.thanks p {
	max-width: 34rem;
	margin: .7rem auto 1.75rem;
	color: var(--ink-soft);
}

/* ---------- 11. Organizatorzy i patronaty ---------- */
.orgs {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: clamp(1.25rem, 2.5vw, 1.75rem);
}

.org {
	display: grid;
	grid-template-rows: auto 1fr;
	gap: 1.5rem;
	padding: clamp(1.4rem, 2.5vw, 2rem);
	background: var(--card);
	border: 1px solid var(--line);
	border-radius: var(--r-md);
}

.org__mark {
	display: flex;
	align-items: center;
	min-height: 4.5rem;
}

.org__logo { max-height: 4.5rem; width: auto; object-fit: contain; }


.org__role {
	font-family: var(--font-label);
	font-weight: 700;
	font-size: .6875rem;
	letter-spacing: .14em;
	text-transform: uppercase;
	color: var(--muted);
}

.org__name {
	margin-top: .45rem;
	font-family: var(--font-display);
	font-weight: 700;
	font-size: 1.375rem;
	line-height: 1.25;
	color: var(--navy-700);
}

.org__name a { color: inherit; text-decoration: none; }
.org__name a:hover { color: var(--teal-700); text-decoration: underline; }

.org__desc {
	margin-top: .9rem;
	font-size: .9375rem;
	color: var(--ink-soft);
}

.org__desc--pending {
	display: inline-block;
	padding: .3rem .7rem;
	border: 1px dashed var(--line-strong);
	border-radius: var(--r-xs);
	font-family: var(--font-label);
	font-weight: 400;
	font-size: .75rem;
	color: var(--muted);
}

.org__tags-label {
	margin-top: 1.25rem;
	margin-bottom: .6rem;
	font-family: var(--font-label);
	font-weight: 700;
	font-size: .6875rem;
	letter-spacing: .12em;
	text-transform: uppercase;
	color: var(--muted);
}

.patronage {
	margin-top: clamp(2.5rem, 5vw, 4rem);
	padding-top: clamp(2rem, 4vw, 3rem);
	border-top: 1px solid var(--line);
	scroll-margin-top: calc(var(--topbar-h) + 8px);
}

.patronage__head {
	display: flex;
	flex-wrap: wrap;
	align-items: baseline;
	gap: .75rem 1.25rem;
	margin-bottom: 1.75rem;
}

.patronage__title {
	font-family: var(--font-display);
	font-weight: 700;
	font-size: 1.5rem;
	color: var(--navy-700);
}

.patronage__note {
	font-family: var(--font-label);
	font-weight: 700;
	font-size: .6875rem;
	letter-spacing: .1em;
	text-transform: uppercase;
	color: var(--muted);
}

.patronage__list {
	display: flex;
	flex-wrap: wrap;
	gap: 1.5rem 2rem;
}

.patronage__item {
	display: flex;
	align-items: center;
	gap: 1rem;
	min-width: 0;
}

.patronage__tile {
	/* Flex, nie grid: w gridzie procentowa wysokość obrazka nie miała
	   definitywnego pudełka odniesienia i logotyp pionowy (KIRP) wychodził
	   poza ramkę. W kontenerze flex `max-height: 100%` liczy się poprawnie. */
	display: flex;
	align-items: center;
	justify-content: center;
	flex: none; /* element flex domyślnie się kurczy — kafel musi trzymać rozmiar */
	width: 10rem;
	height: 8rem;
	padding: 1rem 1.15rem;
	background: var(--card);
	border: 1px solid var(--line);
	border-radius: var(--r-sm);
	transition: border-color .2s ease;
}

.patronage__tile:hover { border-color: var(--navy-700); }

.patronage__tile img {
	max-width: 100%;
	max-height: 100%;
	width: auto;
	height: auto;
	min-height: 0;
	object-fit: contain;
}

.patronage__name {
	max-width: 12rem;
	font-size: .875rem;
	line-height: 1.4;
	color: var(--ink-soft);
}

.partners {
	margin-top: clamp(2.5rem, 5vw, 4rem);
	padding-top: clamp(2rem, 4vw, 3rem);
	border-top: 1px solid var(--line);
	scroll-margin-top: calc(var(--topbar-h) + 8px);
}

.partners__head { margin-bottom: 1.75rem; }

.partners__title {
	font-family: var(--font-display);
	font-weight: 700;
	font-size: 1.5rem;
	color: var(--navy-700);
}

/* Pasek logotypów ma białe tło, więc siedzi na białym kaflu — bez obwódki
   z prześwitującym papierem wokół krawędzi grafiki. */
.partners__banner {
	padding: clamp(1.25rem, 3vw, 2.25rem) clamp(1.25rem, 3vw, 2.5rem);
	background: var(--card);
	border: 1px solid var(--line);
	border-radius: var(--r-md);
}

.partners__banner img {
	display: block;
	width: 100%;
	max-width: 62rem;
	margin-inline: auto;
	height: auto;
}

/* ---------- 12. Prelegenci ---------- */
.speakers__count {
	margin-bottom: 1.5rem;
	font-size: .875rem;
	color: var(--muted);
}

.speakers {
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(min(24rem, 100%), 1fr));
	gap: .75rem clamp(1rem, 2.5vw, 1.75rem);
	align-items: start;
}

.speaker { min-width: 0; }

.speaker__entry {
	background: var(--card);
	border: 1px solid var(--line);
	border-radius: var(--r-sm);
	transition: border-color .2s ease;
}

.speaker__entry[open],
.speaker__entry:hover { border-color: var(--line-strong); }
.speaker__entry[open] { border-color: var(--teal-600); }

.speaker__summary {
	display: flex;
	align-items: baseline;
	gap: .75rem;
	width: 100%;
	padding: .95rem 1.1rem;
	margin: 0;
	border: 0;
	background: none;
	font: inherit;
	text-align: left;
	color: inherit;
	cursor: pointer;
	list-style: none;
}

.speaker__summary::-webkit-details-marker { display: none; }

.speaker__summary:focus-visible {
	outline: 2px solid var(--ember-500);
	outline-offset: -2px;
	border-radius: var(--r-sm);
}

.speaker__name {
	font-family: var(--font-display);
	font-weight: 700;
	font-size: 1.1875rem;
	line-height: 1.25;
	color: var(--navy-700);
}

.speaker__affiliation {
	font-size: .8125rem;
	color: var(--muted);
}

.speaker__chevron {
	margin-left: auto;
	align-self: center;
	flex: none;
	color: var(--teal-700);
	transition: transform .25s ease;
}

.speaker__chevron svg { display: block; width: 1.15rem; height: 1.15rem; }
.speaker__entry:hover .speaker__chevron { transform: translateX(3px); }

/* Zachowanie dla wariantu bez JavaScriptu, gdzie pozycja jest elementem <details>. */
.speaker__entry[open] .speaker__chevron { transform: rotate(90deg); }

.speaker__body {
	padding: 0 1.1rem 1.15rem;
	border-top: 1px solid var(--line);
	margin-top: -1px;
	padding-top: 1rem;
}

.speaker__role {
	margin-bottom: .5rem;
	font-family: var(--font-label);
	font-weight: 700;
	font-size: .6875rem;
	letter-spacing: .12em;
	text-transform: uppercase;
	color: var(--teal-700);
}

.speaker__bio {
	font-size: .9375rem;
	line-height: 1.6;
	color: var(--ink-soft);
}

.speaker__entry--pending {
	display: flex;
	flex-wrap: wrap;
	align-items: baseline;
	gap: .35rem .75rem;
	padding: .95rem 1.1rem;
	border-style: dashed;
}

/* Etykieta jest długa — na wąskim ekranie schodzi pod nazwisko zamiast
   rozpychać kartę. */
.speaker__pending {
	margin-left: auto;
	font-family: var(--font-label);
	font-weight: 700;
	font-size: .625rem;
	letter-spacing: .12em;
	text-transform: uppercase;
	color: var(--muted);
}

@media (max-width: 420px) {
	.speaker__pending { margin-left: 0; }
}

.empty {
	max-width: 34rem;
	padding: clamp(2rem, 4vw, 3rem);
	background: var(--card);
	border: 1px dashed var(--line-strong);
	border-radius: var(--r-md);
	text-align: left;
}

.empty__mark {
	display: grid;
	place-items: center;
	width: 2.75rem;
	height: 2.75rem;
	margin-bottom: 1.25rem;
	border-radius: 50%;
	background: rgba(39, 143, 130, .1);
	color: var(--teal-700);
}

.empty__title {
	font-family: var(--font-display);
	font-weight: 700;
	font-size: 1.5rem;
	color: var(--navy-700);
}

.empty__text { margin-top: .75rem; font-size: .9375rem; color: var(--ink-soft); }
.empty .btn { margin-top: 1.75rem; }

/* Okno z biogramem */
.modal {
	/* Jedno źródło prawdy dla wysokości — używa jej też .modal__inner.
	   dvh zamiast vh: na telefonach pasek adresu nie ucina okna. */
	--modal-max-h: min(86vh, 46rem);
	--modal-max-h: min(86dvh, 46rem);
	width: min(46rem, calc(100vw - 2rem));
	max-height: var(--modal-max-h);
	padding: 0;
	border: 0;
	border-radius: var(--r-lg);
	background: var(--card);
	color: var(--ink);
	box-shadow: 0 32px 80px -24px rgba(4, 25, 45, .55);
	overflow: hidden;
}

.modal::backdrop {
	background: rgba(4, 25, 45, .62);
	backdrop-filter: blur(3px);
}

.modal__inner {
	display: flex;
	flex-direction: column;
	max-height: var(--modal-max-h);
}

.modal__head {
	display: flex;
	align-items: flex-start;
	gap: 1.25rem;
	padding: clamp(1.5rem, 3vw, 2rem) clamp(1.5rem, 3vw, 2.25rem) 1.25rem;
	border-bottom: 1px solid var(--line);
}

.modal__eyebrow {
	margin-bottom: .35rem;
	font-family: var(--font-label);
	font-weight: 700;
	font-size: .6875rem;
	letter-spacing: .14em;
	text-transform: uppercase;
	color: var(--ember-700);
}

.modal__title {
	font-family: var(--font-display);
	font-weight: 700;
	font-size: clamp(1.4rem, 1.15rem + .9vw, 1.8rem);
	letter-spacing: -.015em;
	line-height: 1.2;
	color: var(--navy-700);
}

.modal__close {
	flex: none;
	display: grid;
	place-items: center;
	width: 2.5rem;
	height: 2.5rem;
	margin-left: auto;
	padding: 0;
	border: 1px solid var(--line);
	border-radius: 50%;
	background: var(--card);
	color: var(--muted);
	cursor: pointer;
	transition: border-color .2s ease, color .2s ease, background-color .2s ease;
}

.modal__close:hover {
	border-color: var(--navy-700);
	background: var(--navy-700);
	color: #fff;
}

.modal__close .icon { width: 1.1rem; height: 1.1rem; }

.modal__body {
	padding: clamp(1.5rem, 3vw, 2rem) clamp(1.5rem, 3vw, 2.25rem);
	overflow-y: auto;
	overscroll-behavior: contain;
}

/* Biogram to jeden długi akapit — stąd szeroka interlinia i ograniczona miara. */
.modal__bio {
	max-width: 58ch;
	font-size: 1.0625rem;
	line-height: 1.75;
	color: var(--ink-soft);
	text-wrap: pretty;
}

/* Wejście okna.
   Świadomie na @keyframes, a nie na przejściu ze stanu zamkniętego: przy
   transition + @starting-style stan wyjściowy `opacity: 0` zostaje w kaskadzie
   i jeśli przejście nie wystartuje, okno zostaje niewidoczne. Animacja
   klatkowa nie ma tej wady — bez niej element po prostu jest widoczny. */
@media (prefers-reduced-motion: no-preference) {
	.modal[open] { animation: modal-in .22s ease both; }
	.modal[open]::backdrop { animation: modal-backdrop-in .22s ease both; }

	@media (max-width: 560px) {
		.modal[open] { animation-name: modal-sheet-in; }
	}
}

/* Animujemy wyłącznie `transform`. Gdyby klatki nie ruszyły (karta w tle,
   wydruk, narzędzie zrzutów), okno i tak zostaje widoczne — przesunięte
   o kilkanaście pikseli, nigdy przezroczyste. */
@keyframes modal-in {
	from { transform: translateY(10px) scale(.985); }
}

@keyframes modal-sheet-in {
	from { transform: translateY(20px); }
}

@keyframes modal-backdrop-in {
	from { opacity: 0; }
}

@media (max-width: 560px) {
	/* Na telefonie okno siada na dolnej krawędzi. Pozycjonujemy je wprost,
	   zamiast liczyć na domyślne `margin: auto` dialogu — to ono zostawiało
	   kilka pikseli luzu po bokach i wypychało okno poza dolny brzeg. */
	.modal {
		--modal-max-h: 92vh;
		--modal-max-h: 92dvh;
		position: fixed;
		inset: auto 0 0;
		width: 100%;
		max-width: none;
		margin: 0;
		border-radius: var(--r-lg) var(--r-lg) 0 0;
	}
}

/* ---------- 13. Gość specjalny ---------- */
.keynote {
	display: grid;
	grid-template-columns: minmax(0, 20rem) minmax(0, 1fr);
	gap: clamp(1.75rem, 4vw, 3.5rem);
	align-items: start;
}

.keynote__card {
	padding: clamp(1.5rem, 3vw, 2rem);
	border: 1px solid var(--on-navy-line);
	border-radius: var(--r-md);
	background: rgba(255, 255, 255, .04);
	position: sticky;
	top: calc(var(--topbar-h) + 1.5rem);
}

.keynote__eyebrow {
	font-family: var(--font-label);
	font-weight: 700;
	font-size: .6875rem;
	letter-spacing: .14em;
	text-transform: uppercase;
	color: var(--amber-500);
}

.keynote__person {
	margin-top: .85rem;
	font-family: var(--font-display);
	font-weight: 700;
	font-size: 2rem;
	color: #fff;
}

.keynote__affiliation { margin-top: .25rem; font-size: .9375rem; color: var(--on-navy-muted); }

.keynote__meta {
	display: grid;
	gap: 1.25rem;
	margin-top: 1.75rem;
	padding-top: 1.5rem;
	border-top: 1px solid var(--on-navy-line);
}

.keynote__meta dt {
	display: flex;
	align-items: center;
	gap: .5rem;
	font-family: var(--font-label);
	font-weight: 700;
	font-size: .6875rem;
	letter-spacing: .12em;
	text-transform: uppercase;
	color: var(--on-navy-muted);
}

.keynote__icon { width: 1rem; height: 1rem; color: var(--teal-400); }

.keynote__meta dd {
	margin-top: .4rem;
	font-size: .9375rem;
	line-height: 1.5;
	color: #fff;
}

.langswitch {
	display: inline-flex;
	gap: .25rem;
	padding: .25rem;
	margin-bottom: 1.75rem;
	border: 1px solid var(--on-navy-line);
	border-radius: 999px;
}

.langswitch__btn {
	padding: .4rem 1.1rem;
	border: 0;
	border-radius: 999px;
	background: transparent;
	color: var(--on-navy-muted);
	font-family: var(--font-label);
	font-weight: 700;
	font-size: .75rem;
	letter-spacing: .08em;
	text-transform: uppercase;
	cursor: pointer;
	transition: background-color .2s ease, color .2s ease;
}

.langswitch__btn:hover { color: #fff; }

.langswitch__btn.is-active {
	background: var(--teal-600);
	color: #fff;
}

.keynote__title {
	font-family: var(--font-display);
	font-weight: 400;
	font-size: clamp(1.5rem, 1.1rem + 1.3vw, 2.1rem);
	font-style: italic;
	line-height: 1.25;
	color: #fff;
	margin-bottom: 1.5rem;
	max-width: 30ch;
}

.keynote__biohead {
	margin-top: 2.25rem;
	padding-top: 1.5rem;
	border-top: 1px solid var(--on-navy-line);
	font-family: var(--font-label);
	font-weight: 700;
	font-size: .6875rem;
	letter-spacing: .14em;
	text-transform: uppercase;
	color: var(--amber-500);
	margin-bottom: 1rem;
}

.langpanel[hidden] { display: none; }

/* ---------- 14. Lokalizacja i mapa ---------- */
.place__warn { max-width: 46rem; margin-bottom: clamp(1.75rem, 3vw, 2.5rem); }

.place { display: grid; gap: clamp(2rem, 4vw, 3rem); }

/* Elementy siatki muszą móc zwęzić się poniżej swojej treści — inaczej
   szeroka mapa rozpycha całą stronę w poziomie zamiast przewijać się w środku. */
.place > * { min-width: 0; }

.map-figure { margin: 0; min-width: 0; }

.map-wrap {
	min-width: 0;
	overflow-x: auto;
	overscroll-behavior-x: contain;
	border-radius: var(--r-md);
	background: var(--navy-800);
	box-shadow: var(--shadow-card);
}

.map {
	display: block;
	width: 100%;
	min-width: 680px;
	height: auto;
}

.map-figure__caption {
	margin-top: .75rem;
	font-size: .8125rem;
	color: var(--muted);
}

/* Podpowiedź o przewijaniu pokazujemy tylko tam, gdzie mapa się nie mieści. */
.map-figure__hint { display: none; }

@media (max-width: 780px) {
	.map-figure__hint { display: block; margin-bottom: .2rem; color: var(--ink-soft); }
}

.map__ground { fill: var(--navy-800); }
.map__blocks rect { fill: rgba(255, 255, 255, .045); }

.map__street {
	fill: none;
	stroke: rgba(216, 231, 240, .17);
	stroke-width: 42;
	stroke-linecap: round;
}

.map__street--minor { stroke-width: 26; }

.map__green {
	fill: rgba(62, 159, 147, .13);
	stroke: rgba(62, 159, 147, .32);
	stroke-width: 1;
}

.map__building {
	fill: rgba(255, 255, 255, .1);
	stroke: rgba(255, 255, 255, .2);
	stroke-width: 1;
}

.map__building--wpia {
	fill: rgba(84, 183, 170, .3);
	stroke: var(--teal-400);
	stroke-width: 1.5;
}

.map__label-block {
	fill: rgba(216, 231, 240, .62);
	font-family: var(--font-body);
	font-size: 17px;
	font-weight: 400;
}

.map__label-wpia {
	fill: #fff;
	font-family: var(--font-body);
	font-size: 19px;
	font-weight: 700;
	letter-spacing: .01em;
}

.map__label-wpia-sub {
	fill: rgba(255, 255, 255, .78);
	font-family: var(--font-label);
	font-weight: 400;
	font-size: 13px;
}

.map__leader {
	stroke: var(--ember-500);
	stroke-width: 1.5;
	stroke-dasharray: 3 4;
	fill: none;
}

.map__leader--nope { stroke: rgba(216, 231, 240, .4); }

.map__pin-halo { fill: rgba(233, 79, 40, .22); }
.map__pin { fill: var(--ember-500); }
.map__pin-tick { stroke: #fff; stroke-width: 2; fill: none; stroke-linecap: round; stroke-linejoin: round; }

.map__callout-title {
	fill: #fff;
	font-family: var(--font-body);
	font-size: 17px;
	font-weight: 700;
}

.map__callout-sub {
	fill: var(--amber-500);
	font-family: var(--font-label);
	font-weight: 400;
	font-size: 13px;
}

.map__nope-dot { fill: rgba(255, 255, 255, .12); stroke: rgba(255, 255, 255, .35); stroke-width: 1; }
.map__nope-x { stroke: rgba(255, 255, 255, .8); stroke-width: 2; stroke-linecap: round; }

.map__nope-title {
	fill: rgba(216, 231, 240, .9);
	font-family: var(--font-body);
	font-size: 15px;
	font-weight: 700;
}

.map__nope-sub {
	fill: rgba(157, 178, 194, .85);
	font-family: var(--font-body);
	font-size: 14px;
}

.map__transit-dot { fill: rgba(42, 124, 184, .9); }
.map__transit-glyph { fill: none; stroke: #fff; stroke-width: 1.4; stroke-linecap: round; }

.map__transit-label {
	fill: rgba(216, 231, 240, .92);
	font-family: var(--font-body);
	font-size: 14px;
	font-weight: 700;
}

.map__transit-lines {
	fill: var(--teal-400);
	font-family: var(--font-label);
	font-weight: 400;
	font-size: 13px;
	letter-spacing: .04em;
}

.map__metro-arrow { stroke: var(--teal-400); stroke-width: 2; fill: none; stroke-linecap: round; stroke-linejoin: round; }

.map__metro-label {
	fill: rgba(216, 231, 240, .92);
	font-family: var(--font-body);
	font-size: 14px;
	font-weight: 700;
}

.map__metro-sub {
	fill: rgba(157, 178, 194, .85);
	font-family: var(--font-label);
	font-weight: 400;
	font-size: 12px;
}

.map__street-name {
	fill: rgba(216, 231, 240, .5);
	font-family: var(--font-label);
	font-weight: 700;
	font-size: 13px;
	letter-spacing: .22em;
	text-transform: uppercase;
}

.map__street-name--minor { font-size: 11px; }

.map__compass-ring { fill: none; stroke: rgba(255, 255, 255, .18); }
.map__compass-needle { fill: rgba(216, 231, 240, .6); }

.map__compass-n {
	fill: rgba(216, 231, 240, .6);
	font-family: var(--font-label);
	font-weight: 400;
	font-size: 10px;
	letter-spacing: .1em;
}

.place__info {
	display: grid;
	min-width: 0;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: clamp(1.75rem, 3vw, 2.75rem);
	align-items: start;
}

.info-block__title {
	margin-bottom: .75rem;
	font-family: var(--font-label);
	font-weight: 700;
	font-size: .6875rem;
	letter-spacing: .16em;
	text-transform: uppercase;
	color: var(--muted);
}

.info-block__body { font-size: .9375rem; line-height: 1.6; color: var(--ink-soft); }

.rooms { display: grid; gap: .6rem; }

.rooms__item {
	display: flex;
	flex-wrap: wrap;
	align-items: baseline;
	justify-content: space-between;
	gap: .5rem 1rem;
	padding-bottom: .6rem;
	border-bottom: 1px solid var(--line);
}

.rooms__item:last-child { border-bottom: 0; padding-bottom: 0; }
.rooms__what { font-size: .9375rem; color: var(--ink); }
.rooms__where { display: flex; flex-wrap: wrap; gap: .35rem; }

.transit { display: grid; gap: .9rem; }

.transit__item {
	display: flex;
	align-items: flex-start;
	gap: .7rem;
	font-size: .9375rem;
	line-height: 1.55;
	color: var(--ink-soft);
}

.transit__icon { color: var(--teal-700); margin-top: .15em; }
.transit strong { color: var(--ink); font-weight: 700; }

/* ---------- 15. Dostępność ---------- */
.a11y {
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(min(19rem, 100%), 1fr));
	gap: clamp(1.25rem, 2.5vw, 1.75rem);
}

.a11y__card {
	display: flex;
	flex-direction: column;
	padding: clamp(1.4rem, 2.5vw, 1.85rem);
	background: var(--card);
	border: 1px solid var(--line);
	border-radius: var(--r-md);
}

.a11y__icon {
	display: grid;
	place-items: center;
	width: 2.5rem;
	height: 2.5rem;
	margin-bottom: 1.1rem;
	border-radius: var(--r-sm);
	background: rgba(39, 143, 130, .1);
	color: var(--teal-700);
}

.a11y__title {
	font-family: var(--font-display);
	font-weight: 700;
	font-size: 1.25rem;
	line-height: 1.25;
	color: var(--navy-700);
}

.a11y__points {
	display: grid;
	gap: .6rem;
	margin-top: 1rem;
	font-size: .9375rem;
	color: var(--ink-soft);
}

.a11y__points li {
	position: relative;
	padding-left: 1.15rem;
	line-height: 1.55;
}

.a11y__points li::before {
	content: '';
	position: absolute;
	left: 0;
	top: .6em;
	width: 5px;
	height: 5px;
	border-radius: 50%;
	background: var(--teal-500);
}

.a11y__notes {
	margin-top: 1.25rem;
	padding: .9rem 1rem;
	border-radius: var(--r-sm);
	background: rgba(240, 169, 42, .1);
}

.a11y__notes-label {
	margin-bottom: .4rem;
	font-family: var(--font-label);
	font-weight: 700;
	font-size: .625rem;
	letter-spacing: .14em;
	text-transform: uppercase;
	color: var(--ember-700);
}

.a11y__notes ul { display: grid; gap: .4rem; font-size: .875rem; color: var(--ink-soft); }

.a11y__notes li {
	position: relative;
	padding-left: 1.05rem;
	line-height: 1.5;
}

.a11y__notes li::before {
	content: '';
	position: absolute;
	left: 0;
	top: .58em;
	width: 5px;
	height: 5px;
	border-radius: 50%;
	background: var(--amber-500);
}

.a11y__card .link-arrow { margin-top: auto; padding-top: 1.25rem; align-self: flex-start; }

.a11y__foot {
	max-width: 44rem;
	margin-top: clamp(2rem, 4vw, 3rem);
	font-size: .9375rem;
	color: var(--ink-soft);
}

/* ---------- 16. Zamknięcie i stopka ---------- */
.closing {
	padding-block: clamp(4rem, 7vw, 6.5rem);
	background: var(--navy-900);
	color: var(--on-navy);
	text-align: center;
}

.closing__eyebrow {
	font-family: var(--font-label);
	font-weight: 700;
	font-size: .6875rem;
	letter-spacing: .18em;
	text-transform: uppercase;
	color: var(--teal-400);
}

.closing__title {
	margin-top: 1rem;
	font-family: var(--font-display);
	font-weight: 700;
	font-size: clamp(1.8rem, 1.25rem + 2.2vw, 2.6rem);
	letter-spacing: -.02em;
	color: #fff;
}

.closing__text {
	max-width: 34rem;
	margin: 1rem auto 2rem;
	color: var(--on-navy-muted);
}

/* Bez akapitu pod nagłówkiem przycisk dotykał tytułu — odstęp dokładamy
   tylko wtedy, gdy następuje bezpośrednio po nim. */
.closing__title + .btn { margin-top: clamp(1.75rem, 3vw, 2.5rem); }

.footer {
	padding-block: clamp(3rem, 5vw, 4.5rem) 2.5rem;
	background: var(--navy-800);
	color: var(--on-navy-muted);
	font-size: .9375rem;
	border-top: 1px solid var(--on-navy-line);
}

.footer a { color: var(--teal-400); }
.footer a:hover { color: #fff; }

.footer__top {
	display: grid;
	grid-template-columns: minmax(0, 1.4fr) minmax(0, 1fr) minmax(0, 1fr);
	gap: clamp(1.75rem, 4vw, 3rem);
	padding-bottom: 2.5rem;
	margin-bottom: 2.5rem;
	border-bottom: 1px solid var(--on-navy-line);
}

.footer__name {
	font-family: var(--font-display);
	font-weight: 700;
	font-size: 1.25rem;
	color: #fff;
}

.footer__meta { margin-top: .5rem; font-size: .875rem; max-width: 26rem; }

.footer__nav ul { display: grid; gap: .5rem; }
.footer__nav a { text-decoration: none; font-size: .875rem; }
.footer__nav a:hover { text-decoration: underline; }

.footer__label {
	font-family: var(--font-label);
	font-weight: 700;
	font-size: .625rem;
	letter-spacing: .14em;
	text-transform: uppercase;
	color: rgba(157, 178, 194, .75);
	margin-bottom: .4rem;
}

.footer__label--spaced { margin-top: 1.1rem; }
.footer__contact p { font-size: .875rem; line-height: 1.7; }

/* Nota prawna po lewej, podpis platformy po prawej; na wąskich ekranach
   jedno pod drugim. */
.footer__bottom {
	display: flex;
	flex-wrap: wrap;
	align-items: baseline;
	justify-content: space-between;
	gap: .5rem 2rem;
}

.footer__legal { font-size: .8125rem; color: rgba(157, 178, 194, .7); }

.footer__credit {
	font-size: .8125rem;
	color: rgba(157, 178, 194, .7);
	white-space: nowrap;
}

/* ---------- 17. Animacje wejścia ----------
   Stan początkowy ustawiamy wyłącznie pod .js — bez JavaScriptu grafika
   i wszystkie sekcje są od razu widoczne. */
.js .route:not(.route--dashed),
.js .reveal {
	stroke-dasharray: 1;
	stroke-dashoffset: 1;
	animation: draw 1.5s cubic-bezier(.33, .1, .2, 1) forwards;
	animation-delay: calc(var(--i, 0) * .11s + .15s);
}

@keyframes draw {
	to { stroke-dashoffset: 0; }
}

.js .node {
	opacity: 0;
	transform-box: fill-box;
	transform-origin: center;
	animation: pop .5s cubic-bezier(.2, 1.3, .5, 1) forwards;
	animation-delay: calc(var(--i, 0) * .07s + .8s);
}

@keyframes pop {
	from { opacity: 0; transform: scale(.2); }
	to { opacity: 1; transform: scale(1); }
}

.js .globe {
	opacity: 0;
	animation: fade 1.6s ease forwards .2s;
}

@keyframes fade {
	to { opacity: 1; }
}

.js [data-reveal] {
	opacity: 0;
	transform: translateY(12px);
	transition: opacity .7s ease, transform .7s cubic-bezier(.2, .7, .3, 1);
}

.js [data-reveal].is-visible {
	opacity: 1;
	transform: none;
}

/* ---------- 18. Responsywność ---------- */
@media (max-width: 1080px) {
	.nav__list { gap: 1rem; }
	.nav__link { font-size: .8125rem; }
	.keynote { grid-template-columns: 1fr; }
	.keynote__card { position: static; }
}

@media (max-width: 900px) {
	:root { --topbar-h: 62px; }

	.nav-toggle { display: inline-flex; }

	.nav {
		position: fixed;
		inset: var(--topbar-h) 0 auto;
		display: grid;
		gap: 0;
		padding: 1rem var(--gutter) 1.75rem;
		background: rgba(5, 34, 62, .98);
		backdrop-filter: blur(12px);
		border-bottom: 1px solid var(--on-navy-line);
		transform: translateY(-8px);
		opacity: 0;
		visibility: hidden;
		transition: opacity .22s ease, transform .22s ease, visibility .22s;
		max-height: calc(100svh - var(--topbar-h));
		overflow-y: auto;
	}

	.nav.is-open { opacity: 1; visibility: visible; transform: none; }

	.nav__list { display: grid; gap: 0; }

	.nav__link {
		padding-block: .9rem;
		font-size: 1rem;
		border-bottom: 1px solid var(--on-navy-line);
	}

	.nav__link::after { display: none; }
	.nav__link.is-current { color: var(--amber-500); }
	.nav__cta { margin-top: 1.25rem; justify-self: start; }

	.about,
	.about--wide { grid-template-columns: 1fr; }
	.orgs { grid-template-columns: 1fr; }
	.place__info { grid-template-columns: 1fr; }
	.footer__top { grid-template-columns: 1fr 1fr; }
	.footer__brand { grid-column: 1 / -1; }
}

@media (max-width: 720px) {
	.hero { min-height: auto; }
	.hero__art { opacity: .62; }

	/* Na wąskim ekranie tekst zajmuje całą szerokość, więc przyciemniamy
	   grafikę pionowo, a nie od lewej krawędzi. */
	.hero::after {
		background: linear-gradient(to bottom, rgba(5, 34, 62, .88), rgba(5, 34, 62, .74) 55%, rgba(5, 34, 62, .6));
	}

	.hero__facts { grid-template-columns: 1fr; gap: 1.25rem; }
	.fact { display: flex; align-items: baseline; gap: .75rem; }
	.fact__label { flex: none; width: 7.5rem; }
	.fact__value { margin-top: 0; }
	.grid--2 { grid-template-columns: 1fr; }
	.choices--row { grid-auto-flow: row; }
	.slot { grid-template-columns: 1fr; gap: .5rem; }
	.slot__when { grid-auto-flow: column; justify-content: start; gap: .75rem; align-items: baseline; }
	.footer__top { grid-template-columns: 1fr; }
}

@media (max-width: 480px) {
	/* Pełna nazwa zostaje także na telefonie — druga linijka może się zawinąć,
	   dlatego pasek jest tu wyższy niż na większych ekranach. */
	:root { --topbar-h: 76px; }

	.wordmark__main { font-size: 1.05rem; }

	.wordmark__sub {
		font-size: .5625rem;
		letter-spacing: .06em;
		line-height: 1.35;
	}

	.nav-toggle { padding: .45rem .7rem .45rem .6rem; }
	.hero__actions .btn { width: 100%; }
	.patronage__item { width: 100%; }
}

@media (max-width: 340px) {
	.wordmark__sub { letter-spacing: .03em; }
}

/* ---------- 19. Preferencje użytkownika ---------- */
@media (prefers-reduced-motion: reduce) {
	html { scroll-behavior: auto; }

	*,
	*::before,
	*::after {
		animation-duration: .01ms !important;
		animation-iteration-count: 1 !important;
		transition-duration: .01ms !important;
	}

	.js .route:not(.route--dashed),
	.js .reveal { stroke-dashoffset: 0; }

	.js .node,
	.js .globe { opacity: 1; }

	.js [data-reveal] { opacity: 1; transform: none; }
}

@media print {
	.topbar, .hero__art, .closing, .nav-toggle { display: none; }

	.js [data-reveal] { opacity: 1 !important; transform: none !important; }
	body { background: #fff; color: #000; }
	.section { padding-block: 1.5rem; }
}