/*
Theme Name: Akademia Marzeń
Theme URI: https://akademiamarzen.pl
Description: Motyw serwisu Akademii Marzeń we Wrocławiu — kursy egzaminacyjne, korepetycje, warsztaty rozwojowe OMG! Academy, tutoring i programowanie. Paleta wyprowadzona z logo, fonty hostowane lokalnie (RODO), oferta zarządzana z panelu.
Author: Akademia Marzeń
Version: 1.1.0
Requires at least: 6.7
Tested up to: 7.0
Requires PHP: 7.4
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: akademia-marzen
*/

/* ==========================================================================
   01. Fonty (lokalnie — bez połączeń do fonts.gstatic.com)
   ========================================================================== */

@font-face {
	font-family: 'Figtree';
	font-style: normal;
	font-weight: 300 800;
	font-display: swap;
	src: url('assets/fonts/figtree-latin-ext.woff2') format('woff2');
	unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304,
		U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0,
		U+2113, U+2C60-2C7F, U+A720-A7FF;
}

@font-face {
	font-family: 'Figtree';
	font-style: normal;
	font-weight: 300 800;
	font-display: swap;
	src: url('assets/fonts/figtree-latin.woff2') format('woff2');
	unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304,
		U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

@font-face {
	font-family: 'Bricolage Grotesque';
	font-style: normal;
	font-weight: 400 800;
	font-display: swap;
	src: url('assets/fonts/bricolage-grotesque-latin-ext.woff2') format('woff2');
	unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304,
		U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0,
		U+2113, U+2C60-2C7F, U+A720-A7FF;
}

@font-face {
	font-family: 'Bricolage Grotesque';
	font-style: normal;
	font-weight: 400 800;
	font-display: swap;
	src: url('assets/fonts/bricolage-grotesque-latin.woff2') format('woff2');
	unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304,
		U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}


/* ==========================================================================
   02. Tokeny
   ========================================================================== */

:root {
	--am-r: 6px;
	--am-r-duzy: 10px;
	--am-linia: 1px solid var(--wp--preset--color--linia);
	--am-krzywa: cubic-bezier(.2, .7, .3, 1);
	--am-naglowek-h: 4.5rem;
	--am-cien: 0 1px 2px rgba(26, 29, 43, .05), 0 8px 24px rgba(26, 29, 43, .06);
	--am-max: 1280px;
}


/* ==========================================================================
   03. Podstawy
   ========================================================================== */

html {
	scroll-behavior: smooth;
}

body {
	-webkit-font-smoothing: antialiased;
	text-rendering: optimizeLegibility;
}

::selection {
	background: var(--wp--preset--color--zolty);
	color: var(--wp--preset--color--atrament);
}

h1, h2, h3, h4,
.wp-block-heading {
	font-variation-settings: 'opsz' 40;
}

main p {
	text-wrap: pretty;
}

h1, h2, h3 {
	text-wrap: balance;
}

[id] {
	scroll-margin-top: calc(var(--am-naglowek-h) + 1.5rem);
}

img {
	max-width: 100%;
	height: auto;
}

/* Cyfry o stałej szerokości — ceny, godziny i liczby miejsc równają się w kolumnach. */
.am-liczby,
.am-cena,
.am-tabela td,
.am-tabela th {
	font-variant-numeric: tabular-nums;
	font-feature-settings: 'tnum' 1;
}

a:focus-visible,
button:focus-visible,
summary:focus-visible,
input:focus-visible,
select:focus-visible,
textarea:focus-visible,
.wp-block-button__link:focus-visible {
	outline: 3px solid var(--wp--preset--color--malina);
	outline-offset: 2px;
	border-radius: 3px;
}

.am-ciemna a:focus-visible,
.am-ciemna button:focus-visible,
.am-ciemna .wp-block-button__link:focus-visible {
	outline-color: var(--wp--preset--color--zolty);
}

.am-skip {
	position: absolute;
	left: 1rem;
	top: 0;
	z-index: 1000;
	transform: translateY(-140%);
	padding: .75rem 1.25rem;
	background: var(--wp--preset--color--granat);
	color: #fff;
	font-weight: 600;
	font-size: .9375rem;
	text-decoration: none;
	border-radius: 0 0 var(--am-r) var(--am-r);
	transition: transform .2s var(--am-krzywa);
}

.am-skip:focus {
	transform: translateY(0);
}

/* Przyciski — prostokątne, bez cieni i uniesień. */
.wp-block-button__link {
	transition: background .18s var(--am-krzywa), color .18s var(--am-krzywa),
		border-color .18s var(--am-krzywa);
}

.wp-block-button.is-style-outline > .wp-block-button__link {
	border-width: 1.5px;
	font-weight: 600;
}

.am-btn-strzalka .wp-block-button__link::after {
	content: '→';
	margin-left: .5rem;
	display: inline-block;
	transition: transform .18s var(--am-krzywa);
}

.am-btn-strzalka .wp-block-button__link:hover::after {
	transform: translateX(.2rem);
}


/* ==========================================================================
   04. Znaki graficzne wyprowadzone z logo (origami-ptak)
   ========================================================================== */

/* Etykieta sekcji: kreska + tekst wersalikami. Bez pigułek. */
.am-etykieta {
	display: flex;
	align-items: flex-start;
	gap: .85rem;
	margin: 0 0 1.1rem !important;
	font-family: var(--wp--preset--font-family--figtree);
	font-size: .8125rem !important;
	font-weight: 700;
	letter-spacing: .14em;
	text-transform: uppercase;
	color: var(--wp--preset--color--malina) !important;
}

.am-etykieta::before {
	content: '';
	width: 2.25rem;
	height: 2px;
	margin-top: .6em;
	background: currentColor;
	flex: 0 0 auto;
}

.am-ciemna .am-etykieta {
	color: var(--wp--preset--color--zolty) !important;
}

/* Trójkąt — motyw ze skrzydła w logo. Używany jako punktor i drobny akcent. */
.am-trojkat {
	display: inline-block;
	width: 0;
	height: 0;
	border-style: solid;
	border-width: .45rem 0 .45rem .75rem;
	border-color: transparent transparent transparent var(--wp--preset--color--zolty);
}

.am-lista-trojkaty {
	list-style: none;
	padding-left: 0 !important;
	margin: 0;
}

.am-lista-trojkaty li {
	position: relative;
	padding-left: 1.75rem;
	margin-bottom: .7rem;
}

.am-lista-trojkaty li::before {
	content: '';
	position: absolute;
	left: 0;
	top: .55em;
	width: 0;
	height: 0;
	border-style: solid;
	border-width: .35rem 0 .35rem .6rem;
	border-color: transparent transparent transparent var(--wp--preset--color--malina);
}

.am-ciemna .am-lista-trojkaty li::before {
	border-left-color: var(--wp--preset--color--zolty);
}

/* Podkreślenie kluczowego słowa w nagłówku — kreska w kolorze akcentu. */
.am-podkreslenie {
	background-image: linear-gradient(var(--wp--preset--color--zolty), var(--wp--preset--color--zolty));
	background-repeat: no-repeat;
	background-size: 100% .22em;
	background-position: 0 88%;
}


/* ==========================================================================
   05. Nagłówek serwisu i nawigacja
   ========================================================================== */

.am-header {
	position: sticky;
	top: 0;
	z-index: 200;
	background: rgba(251, 250, 248, .94);
	backdrop-filter: saturate(160%) blur(10px);
	-webkit-backdrop-filter: saturate(160%) blur(10px);
	border-bottom: var(--am-linia);
	transition: box-shadow .2s var(--am-krzywa);
}

.admin-bar .am-header {
	top: 32px;
}

@media (max-width: 782px) {
	.admin-bar .am-header {
		top: 46px;
	}
}

.am-header--przewiniety {
	box-shadow: 0 6px 20px rgba(26, 29, 43, .07);
}

.am-header__pas {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 1.5rem;
	max-width: var(--am-max);
	margin: 0 auto;
	padding: .85rem var(--wp--preset--spacing--40);
}

.am-logo {
	display: inline-flex;
	align-items: center;
	gap: .7rem;
	text-decoration: none;
	color: var(--wp--preset--color--granat);
}

.am-logo img,
.am-logo svg {
	width: 2.6rem;
	height: auto;
	flex: 0 0 auto;
}

.am-logo__nazwa {
	font-family: var(--wp--preset--font-family--bricolage);
	font-weight: 700;
	font-size: 1.1875rem;
	letter-spacing: -.02em;
	line-height: 1.05;
}

.am-logo__haslo {
	display: block;
	font-family: var(--wp--preset--font-family--figtree);
	font-size: .6875rem;
	font-weight: 600;
	letter-spacing: .1em;
	text-transform: uppercase;
	color: var(--wp--preset--color--szary);
}

/* --- Menu główne -------------------------------------------------------- */
.am-menu {
	display: flex;
	align-items: center;
	gap: 1.75rem;
	list-style: none;
	margin: 0;
	padding: 0;
}

.am-menu > li {
	position: relative;
}

.am-menu a,
.am-menu > li > button {
	display: inline-flex;
	align-items: center;
	gap: .35rem;
	padding: .45rem 0;
	font-size: .9375rem;
	font-weight: 500;
	color: var(--wp--preset--color--atrament);
	text-decoration: none;
	background: none;
	border: 0;
	font-family: inherit;
	cursor: pointer;
	position: relative;
}

.am-menu > li > a::after,
.am-menu > li > button::after {
	content: '';
	position: absolute;
	left: 0;
	right: 0;
	bottom: .1rem;
	height: 2px;
	background: var(--wp--preset--color--malina);
	transform: scaleX(0);
	transform-origin: left;
	transition: transform .2s var(--am-krzywa);
}

.am-menu > li > a:hover::after,
.am-menu > li > button:hover::after,
.am-menu > li.am-aktywna > a::after,
.am-menu > li.am-aktywna > button::after {
	transform: scaleX(1);
}

.am-menu > li.am-aktywna > a,
.am-menu > li.am-aktywna > button {
	color: var(--wp--preset--color--granat);
	font-weight: 700;
}

.am-menu__strzalka {
	width: .5rem;
	height: .5rem;
	border-right: 1.5px solid currentColor;
	border-bottom: 1.5px solid currentColor;
	transform: rotate(45deg) translate(-2px, -2px);
	transition: transform .2s var(--am-krzywa);
}

.am-menu > li[aria-expanded="true"] .am-menu__strzalka,
.am-menu > li.am-otwarte .am-menu__strzalka {
	transform: rotate(-135deg) translate(-2px, -2px);
}

/* --- Megamenu ----------------------------------------------------------- */
.am-mega {
	position: absolute;
	left: 50%;
	top: calc(100% + .85rem);
	transform: translateX(-50%) translateY(-.4rem);
	width: min(58rem, calc(100vw - 3rem));
	background: #fff;
	border: var(--am-linia);
	border-radius: var(--am-r-duzy);
	box-shadow: var(--am-cien);
	padding: 1.75rem;
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 1.5rem 2rem;
	opacity: 0;
	visibility: hidden;
	transition: opacity .18s var(--am-krzywa), transform .18s var(--am-krzywa), visibility .18s;
}

.am-menu > li.am-otwarte > .am-mega,
.am-menu > li:hover > .am-mega,
.am-menu > li:focus-within > .am-mega {
	opacity: 1;
	visibility: visible;
	transform: translateX(-50%) translateY(0);
}

.am-mega__grupa-tytul {
	display: block;
	margin-bottom: .5rem;
	font-size: .75rem;
	font-weight: 700;
	letter-spacing: .12em;
	text-transform: uppercase;
	color: var(--wp--preset--color--szary);
}

.am-mega__lista {
	list-style: none;
	margin: 0;
	padding: 0;
}

.am-mega__lista li + li {
	margin-top: .15rem;
}

.am-mega a {
	display: block;
	padding: .4rem .6rem;
	margin-left: -.6rem;
	border-radius: var(--am-r);
	font-size: .9375rem;
	font-weight: 500;
	line-height: 1.35;
	color: var(--wp--preset--color--atrament);
	text-decoration: none;
	transition: background .15s var(--am-krzywa), color .15s var(--am-krzywa);
}

.am-mega a:hover {
	background: var(--wp--preset--color--kreda);
	color: var(--wp--preset--color--granat);
}

.am-mega a small {
	display: block;
	font-size: .8125rem;
	font-weight: 400;
	color: var(--wp--preset--color--szary);
}

.am-mega__stopka {
	grid-column: 1 / -1;
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: space-between;
	gap: 1rem;
	margin-top: .25rem;
	padding-top: 1.25rem;
	border-top: var(--am-linia);
	font-size: .9375rem;
}

/* --- Przycisk menu na telefonie ---------------------------------------- */
.am-burger {
	display: none;
	align-items: center;
	gap: .55rem;
	padding: .55rem .85rem;
	background: none;
	border: var(--am-linia);
	border-radius: var(--am-r);
	font: inherit;
	font-size: .9375rem;
	font-weight: 600;
	color: var(--wp--preset--color--granat);
	cursor: pointer;
}

.am-burger__kreski {
	display: block;
	width: 1.1rem;
	height: 2px;
	background: currentColor;
	position: relative;
}

.am-burger__kreski::before,
.am-burger__kreski::after {
	content: '';
	position: absolute;
	left: 0;
	width: 100%;
	height: 2px;
	background: currentColor;
	transition: transform .2s var(--am-krzywa);
}

.am-burger__kreski::before { top: -.35rem; }
.am-burger__kreski::after { top: .35rem; }

.am-header--menu-otwarte .am-burger__kreski { background: transparent; }
.am-header--menu-otwarte .am-burger__kreski::before { transform: translateY(.35rem) rotate(45deg); }
.am-header--menu-otwarte .am-burger__kreski::after { transform: translateY(-.35rem) rotate(-45deg); }

.am-header__akcje {
	display: flex;
	align-items: center;
	gap: 1rem;
}

.am-btn-cta {
	display: inline-block;
	padding: .7rem 1.35rem;
	background: var(--wp--preset--color--malina);
	color: #fff;
	border-radius: var(--am-r);
	font-size: .9375rem;
	font-weight: 600;
	text-decoration: none;
	white-space: nowrap;
	transition: background .18s var(--am-krzywa);
}

.am-btn-cta:hover {
	background: #8F2F68;
	color: #fff;
}

@media (max-width: 1080px) {
	/* backdrop-filter tworzy blok zawierający dla elementów position:fixed —
	   panel menu pozycjonowałby się względem nagłówka zamiast całego ekranu.
	   Na wąskich ekranach zastępujemy rozmycie pełnym tłem. */
	.am-header {
		backdrop-filter: none;
		-webkit-backdrop-filter: none;
		background: var(--wp--preset--color--papier);
	}

	.am-nawigacja {
		position: fixed;
		inset: var(--am-naglowek-h) 0 0;
		background: var(--wp--preset--color--papier);
		overflow-y: auto;
		padding: 1.5rem var(--wp--preset--spacing--40) 4rem;
		transform: translateY(-100%);
		visibility: hidden;
		transition: transform .28s var(--am-krzywa), visibility .28s;
	}

	.admin-bar .am-nawigacja {
		top: calc(var(--am-naglowek-h) + 32px);
	}

	.am-header--menu-otwarte .am-nawigacja {
		transform: translateY(0);
		visibility: visible;
		box-shadow: 0 12px 30px rgba(26, 29, 43, .12);
	}

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

	.am-menu {
		flex-direction: column;
		align-items: stretch;
		gap: 0;
	}

	.am-menu > li {
		border-bottom: var(--am-linia);
	}

	.am-menu > li > a,
	.am-menu > li > button {
		width: 100%;
		justify-content: space-between;
		padding: 1rem 0;
		font-family: var(--wp--preset--font-family--bricolage);
		font-size: 1.25rem;
		font-weight: 700;
		color: var(--wp--preset--color--granat);
	}

	.am-menu > li > a::after,
	.am-menu > li > button::after {
		display: none;
	}

	.am-mega {
		position: static;
		transform: none;
		width: auto;
		display: none;
		grid-template-columns: 1fr;
		border: 0;
		box-shadow: none;
		padding: 0 0 1rem;
		opacity: 1;
		visibility: visible;
		background: none;
	}

	.am-menu > li.am-otwarte > .am-mega {
		display: grid;
		transform: none;
	}

	.am-header__akcje .am-btn-cta {
		display: none;
	}
}


/* ==========================================================================
   06. Sekcje, okruszki, nagłówki podstron
   ========================================================================== */

.am-sekcja {
	padding-block: var(--wp--preset--spacing--60);
}

.am-sekcja--kreda { background: var(--wp--preset--color--kreda); }
.am-sekcja--biala { background: #fff; }

.am-ciemna {
	background: var(--wp--preset--color--granat);
	color: #fff;
}

.am-ciemna :is(h1, h2, h3, h4) { color: #fff; }
.am-ciemna a { color: #fff; }

/* Na ciemnym tle każdy akapit — także wstęp sekcji i lead — musi być jasny.
   Bez tej reguły wygrywała bardziej szczegółowa .am-naglowek-sekcji p (szary
   na granacie dawał kontrast 1,4:1). */
.am-ciemna p,
.am-ciemna .am-naglowek-sekcji p,
.am-ciemna .am-naglowek-strony__wstep,
.am-ciemna li,
.am-ciemna dd {
	color: #D7DEEE;
}

/* Okruszki */
.am-okruszki {
	font-size: .875rem;
	color: var(--wp--preset--color--szary);
	padding-block: 1rem;
}

.am-okruszki ol {
	display: flex;
	flex-wrap: wrap;
	gap: .5rem;
	list-style: none;
	margin: 0;
	padding: 0;
}

.am-okruszki li + li::before {
	content: '/';
	margin-right: .5rem;
	color: var(--wp--preset--color--linia);
}

.am-okruszki a {
	color: var(--wp--preset--color--szary);
	text-decoration: none;
}

.am-okruszki a:hover { text-decoration: underline; }

.am-okruszki [aria-current] { color: var(--wp--preset--color--atrament); }

/* Nagłówek podstrony: tytuł + wstęp w dwóch kolumnach, oddzielony kreską. */
.am-naglowek-strony {
	display: grid;
	grid-template-columns: minmax(0, 1.15fr) minmax(0, 1fr);
	gap: 1.5rem 4rem;
	align-items: end;
	padding-block: var(--wp--preset--spacing--50) var(--wp--preset--spacing--50);
	border-bottom: var(--am-linia);
}

.am-naglowek-strony h1 { margin: 0; }

.am-naglowek-strony__wstep {
	font-size: var(--wp--preset--font-size--large);
	color: var(--wp--preset--color--szary);
	margin: 0;
	line-height: 1.55;
}

@media (max-width: 860px) {
	.am-naglowek-strony {
		grid-template-columns: minmax(0, 1fr);
		align-items: start;
	}
}


/* ==========================================================================
   07. Hero strony głównej — układ asymetryczny, zdjęcie i pasek faktów
   ========================================================================== */

.am-hero {
	position: relative;
	padding-block: var(--wp--preset--spacing--60) 0;
	overflow: hidden;
}

.am-hero__siatka {
	display: grid;
	grid-template-columns: minmax(0, 1.05fr) minmax(0, .95fr);
	gap: 3rem 4rem;
	align-items: center;
}

.am-hero__tytul {
	margin: 0 0 1.25rem;
	max-width: 14ch;
}

.am-hero__wstep {
	font-size: var(--wp--preset--font-size--large);
	color: var(--wp--preset--color--szary);
	max-width: 44ch;
	margin: 0 0 2rem;
}

.am-hero__akcje {
	display: flex;
	flex-wrap: wrap;
	gap: .85rem;
	align-items: center;
}

.am-hero__foto {
	position: relative;
}

.am-hero__foto img {
	display: block;
	width: 100%;
	border-radius: var(--am-r-duzy);
}

/* Panel z komunikatem o zapisach nachodzi na zdjęcie — łamie prostokątny rytm. */
.am-hero__panel {
	position: absolute;
	left: -1.5rem;
	bottom: -1.75rem;
	max-width: 19rem;
	padding: 1.15rem 1.35rem;
	background: #fff;
	border: var(--am-linia);
	border-left: 4px solid var(--wp--preset--color--zolty);
	border-radius: var(--am-r);
	box-shadow: var(--am-cien);
}

.am-hero__panel p {
	margin: 0;
	font-size: .9375rem;
	line-height: 1.5;
}

.am-hero__panel strong {
	display: block;
	font-family: var(--wp--preset--font-family--bricolage);
	font-size: 1.0625rem;
	color: var(--wp--preset--color--granat);
	margin-bottom: .15rem;
}

/* Pasek faktów pod hero — kreski zamiast kart. */
.am-fakty {
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	gap: 0;
	margin-top: var(--wp--preset--spacing--60);
	border-top: var(--am-linia);
	border-bottom: var(--am-linia);
}

.am-fakty > div {
	padding: 1.5rem 1.5rem 1.5rem 0;
}

.am-fakty > div + div {
	border-left: var(--am-linia);
	padding-left: 1.5rem;
}

.am-fakt__wartosc {
	display: block;
	font-family: var(--wp--preset--font-family--bricolage);
	font-size: clamp(1.75rem, 1.3rem + 1.6vw, 2.375rem);
	font-weight: 700;
	line-height: 1;
	letter-spacing: -.03em;
	color: var(--wp--preset--color--granat);
}

.am-fakt__opis {
	display: block;
	margin-top: .4rem;
	font-size: .9375rem;
	color: var(--wp--preset--color--szary);
}

@media (max-width: 980px) {
	.am-hero__siatka { grid-template-columns: 1fr; }
	.am-hero__tytul { max-width: 18ch; }
	.am-hero__panel { position: static; max-width: none; margin-top: 1rem; }
	.am-fakty { grid-template-columns: repeat(2, 1fr); }
	.am-fakty > div:nth-child(3) { border-left: 0; padding-left: 0; }
	.am-fakty > div:nth-child(n+3) { border-top: var(--am-linia); }
}

@media (max-width: 520px) {
	.am-fakty { grid-template-columns: 1fr; }
	.am-fakty > div + div { border-left: 0; padding-left: 0; border-top: var(--am-linia); }
}


/* ==========================================================================
   08. Ścieżki wyboru — lista pozycji z kreską, nie kafelki
   ========================================================================== */

.am-sciezki {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(17rem, 1fr));
	gap: 0;
	border-top: var(--am-linia);
}

.am-sciezka {
	position: relative;
	display: block;
	padding: 1.75rem 1.5rem 1.75rem 0;
	border-bottom: var(--am-linia);
	text-decoration: none;
	color: inherit;
	transition: background .18s var(--am-krzywa);
}

.am-sciezka + .am-sciezka { border-left: 0; }

.am-sciezka:hover {
	background: var(--wp--preset__color--kreda, var(--wp--preset--color--kreda));
}

.am-sciezka__nadtytul {
	display: block;
	font-size: .75rem;
	font-weight: 700;
	letter-spacing: .12em;
	text-transform: uppercase;
	color: var(--wp--preset--color--malina);
	margin-bottom: .5rem;
}

.am-sciezka__tytul {
	font-family: var(--wp--preset--font-family--bricolage);
	font-size: 1.375rem;
	font-weight: 700;
	letter-spacing: -.02em;
	color: var(--wp--preset--color--granat);
	margin: 0 0 .45rem;
	display: flex;
	align-items: baseline;
	gap: .5rem;
}

.am-sciezka__tytul::after {
	content: '→';
	font-size: 1rem;
	color: var(--wp--preset--color--malina);
	transition: transform .18s var(--am-krzywa);
	display: inline-block;
}

.am-sciezka:hover .am-sciezka__tytul::after { transform: translateX(.25rem); }

.am-sciezka__opis {
	margin: 0;
	font-size: .9375rem;
	color: var(--wp--preset--color--szary);
	max-width: 34ch;
}


/* ==========================================================================
   09. Indeks kursów — wiersze katalogu z ceną po prawej
   ========================================================================== */

.am-kursy {
	border-top: 2px solid var(--wp--preset--color--atrament);
}

.am-kurs {
	display: grid;
	grid-template-columns: minmax(0, 1fr) auto;
	gap: .5rem 2rem;
	align-items: start;
	padding: 1.5rem 0;
	border-bottom: var(--am-linia);
	position: relative;
}

.am-kurs:hover { background: rgba(242, 239, 234, .55); }

.am-kurs__glowna { min-width: 0; }

.am-kurs__tytul {
	font-family: var(--wp--preset--font-family--bricolage);
	font-size: 1.3125rem;
	font-weight: 700;
	letter-spacing: -.02em;
	margin: 0 0 .35rem;
	line-height: 1.2;
}

.am-kurs__tytul a {
	color: var(--wp--preset--color--granat);
	text-decoration: none;
}

.am-kurs__tytul a::after {
	content: '';
	position: absolute;
	inset: 0;
}

.am-kurs__tytul a:hover { text-decoration: underline; }

.am-kurs__meta {
	display: flex;
	flex-wrap: wrap;
	gap: .35rem 1rem;
	margin: 0;
	font-size: .875rem;
	color: var(--wp--preset--color--szary);
}

.am-kurs__meta span { display: inline-flex; align-items: center; gap: .4rem; }

.am-kurs__meta span + span::before {
	content: '';
	width: 3px;
	height: 3px;
	border-radius: 50%;
	background: var(--wp--preset--color--linia);
	margin-right: .6rem;
}

.am-kurs__opis {
	margin: .55rem 0 0;
	font-size: .9375rem;
	color: var(--wp--preset--color--szary);
	max-width: 62ch;
}

.am-kurs__prawa {
	text-align: right;
	white-space: nowrap;
}

.am-cena {
	font-family: var(--wp--preset--font-family--bricolage);
	font-size: 1.25rem;
	font-weight: 700;
	color: var(--wp--preset--color--atrament);
	display: block;
	line-height: 1.2;
}

.am-cena small {
	display: block;
	font-family: var(--wp--preset--font-family--figtree);
	font-size: .8125rem;
	font-weight: 400;
	color: var(--wp--preset--color--szary);
}

@media (max-width: 720px) {
	.am-kurs { grid-template-columns: 1fr; }
	.am-kurs__prawa { text-align: left; }
}


/* ==========================================================================
   10. Statusy zapisów
   ========================================================================== */

.am-status {
	display: inline-flex;
	align-items: center;
	gap: .4rem;
	padding: .2rem .6rem;
	border: 1px solid;
	border-radius: 3px;
	font-size: .75rem;
	font-weight: 700;
	letter-spacing: .06em;
	text-transform: uppercase;
	white-space: nowrap;
}

.am-status::before {
	content: '';
	width: .4rem;
	height: .4rem;
	border-radius: 50%;
	background: currentColor;
}

.am-status--otwarte { color: var(--wp--preset--color--zielony); border-color: rgba(22, 121, 79, .35); background: rgba(22, 121, 79, .07); }
.am-status--ostatnie { color: #9A5B00; border-color: rgba(154, 91, 0, .35); background: rgba(245, 197, 24, .16); }
.am-status--brak { color: #8F2F68; border-color: rgba(143, 47, 104, .35); background: rgba(179, 61, 130, .08); }
.am-status--wkrotce { color: var(--wp--preset--color--granat); border-color: rgba(36, 71, 143, .3); background: rgba(36, 71, 143, .07); }
.am-status--archiwum { color: var(--wp--preset--color--szary); border-color: var(--wp--preset--color--linia); background: transparent; }


/* ==========================================================================
   11. Karta faktów kursu (dla kogo / forma / czas / cena)
   ========================================================================== */

.am-parametry {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(11rem, 1fr));
	gap: 0;
	margin: 0;
	border: var(--am-linia);
	border-radius: var(--am-r-duzy);
	overflow: hidden;
	background: #fff;
}

.am-parametr {
	padding: 1.1rem 1.25rem;
	border-right: var(--am-linia);
	border-bottom: var(--am-linia);
}

.am-parametr dt {
	font-size: .75rem;
	font-weight: 700;
	letter-spacing: .1em;
	text-transform: uppercase;
	color: var(--wp--preset--color--szary);
	margin-bottom: .3rem;
}

.am-parametr dd {
	margin: 0;
	font-size: 1.0625rem;
	font-weight: 600;
	color: var(--wp--preset--color--atrament);
	line-height: 1.35;
}


/* ==========================================================================
   12. Tabele (harmonogram, porównania)
   ========================================================================== */

.am-tabela-obudowa {
	overflow-x: auto;
	border: var(--am-linia);
	border-radius: var(--am-r-duzy);
	background: #fff;
	/* Cień przy prawej krawędzi znika po przewinięciu do końca — podpowiada,
	   że na wąskim ekranie tabelę można przesunąć w bok. */
	background-image: linear-gradient(to left, rgba(26, 29, 43, .12), rgba(26, 29, 43, 0));
	background-repeat: no-repeat;
	background-position: right center;
	background-size: 1.75rem 100%;
	background-attachment: local;
	-webkit-overflow-scrolling: touch;
}

.am-tabela {
	width: 100%;
	min-width: 34rem;
	border-collapse: collapse;
	margin: 0;
	font-size: .9375rem;
}

.am-tabela caption {
	caption-side: top;
	text-align: left;
	padding: 1rem 1.25rem;
	font-weight: 600;
	color: var(--wp--preset--color--szary);
	border-bottom: var(--am-linia);
}

.am-tabela th,
.am-tabela td {
	padding: .85rem 1.25rem;
	text-align: left;
	vertical-align: top;
	border-bottom: var(--am-linia);
}

.am-tabela thead th {
	font-size: .75rem;
	font-weight: 700;
	letter-spacing: .1em;
	text-transform: uppercase;
	color: var(--wp--preset--color--szary);
	background: var(--wp--preset--color--kreda);
}

.am-tabela tbody th {
	font-weight: 600;
	color: var(--wp--preset--color--granat);
}

.am-tabela tbody tr:last-child th,
.am-tabela tbody tr:last-child td { border-bottom: 0; }

.am-tabela tbody tr:hover { background: rgba(242, 239, 234, .6); }


/* ==========================================================================
   13. Zakładki (moduły kursu, warianty) — bez JavaScriptu wymagane
   ========================================================================== */

.am-zakladki {
	border-bottom: var(--am-linia);
	display: flex;
	flex-wrap: wrap;
	gap: 1.75rem;
	margin-bottom: 1.75rem;
}

.am-zakladka {
	appearance: none;
	background: none;
	border: 0;
	border-bottom: 2px solid transparent;
	padding: .65rem 0;
	margin-bottom: -1px;
	font: inherit;
	font-size: .9375rem;
	font-weight: 600;
	color: var(--wp--preset--color--szary);
	cursor: pointer;
}

.am-zakladka[aria-selected="true"] {
	color: var(--wp--preset--color--granat);
	border-bottom-color: var(--wp--preset--color--malina);
}

.am-panel[hidden] { display: none; }


/* ==========================================================================
   14. Treść redakcyjna: cytat, wyróżnienie, notatka
   ========================================================================== */

.am-cytat {
	position: relative;
	margin: 0;
	padding-left: 2.25rem;
	border-left: 3px solid var(--wp--preset--color--zolty);
	font-family: var(--wp--preset--font-family--bricolage);
	font-size: clamp(1.25rem, 1rem + 1vw, 1.75rem);
	font-weight: 500;
	line-height: 1.32;
	letter-spacing: -.02em;
	color: var(--wp--preset--color--granat);
}

.am-cytat p {
	margin: 0;
}

.am-cytat footer {
	margin-top: 1rem;
	font-family: var(--wp--preset--font-family--figtree);
	font-size: .9375rem;
	font-weight: 400;
	color: var(--wp--preset--color--szary);
	letter-spacing: 0;
}

.am-wyroznienie {
	padding: 1.5rem 1.75rem;
	background: var(--wp--preset--color--kreda);
	border-radius: var(--am-r-duzy);
}

.am-wyroznienie > :first-child { margin-top: 0; }
.am-wyroznienie > :last-child { margin-bottom: 0; }

/* Informacja dla właściciela serwisu — widoczna, ale nienachalna. */
.am-notatka {
	position: relative;
	padding: 1rem 1.25rem 1rem 3rem;
	border: 1px dashed rgba(179, 61, 130, .5);
	border-radius: var(--am-r);
	background: rgba(179, 61, 130, .05);
	color: #7C2A5A;
	font-size: .9375rem;
	line-height: 1.55;
}

.am-notatka::before {
	content: 'i';
	position: absolute;
	left: 1rem;
	top: 1rem;
	width: 1.25rem;
	height: 1.25rem;
	display: grid;
	place-content: center;
	border-radius: 50%;
	background: var(--wp--preset--color--malina);
	color: #fff;
	font-size: .75rem;
	font-weight: 700;
	font-style: italic;
}

.am-notatka strong { color: #622047; }

/* Komunikat o braku aktualnej edycji */
.am-komunikat {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: space-between;
	gap: 1.25rem;
	padding: 1.5rem 1.75rem;
	border: var(--am-linia);
	border-left: 4px solid var(--wp--preset--color--granat);
	border-radius: var(--am-r);
	background: #fff;
}

.am-komunikat p { margin: 0; max-width: 52ch; }

.am-komunikat strong {
	display: block;
	font-family: var(--wp--preset--font-family--bricolage);
	font-size: 1.125rem;
	color: var(--wp--preset--color--granat);
	margin-bottom: .2rem;
}


/* ==========================================================================
   15. Kroki, FAQ
   ========================================================================== */

.am-kroki {
	counter-reset: krok;
	list-style: none;
	padding: 0;
	margin: 0;
	display: grid;
	gap: 0;
}

.am-kroki li {
	counter-increment: krok;
	position: relative;
	padding: 1.5rem 0 1.5rem 4rem;
	border-bottom: var(--am-linia);
}

.am-kroki li:first-child { border-top: var(--am-linia); }

.am-kroki li::before {
	content: counter(krok);
	position: absolute;
	left: 0;
	top: 1.45rem;
	font-family: var(--wp--preset--font-family--bricolage);
	font-size: 1.5rem;
	font-weight: 700;
	color: var(--wp--preset--color--zolty);
	line-height: 1;
	-webkit-text-stroke: 0;
}

.am-kroki strong {
	display: block;
	font-family: var(--wp--preset--font-family--bricolage);
	font-size: 1.1875rem;
	color: var(--wp--preset--color--granat);
	margin-bottom: .25rem;
	letter-spacing: -.01em;
}

.am-kroki p { margin: 0; color: var(--wp--preset--color--szary); }

.am-faq details {
	border-bottom: var(--am-linia);
	padding: 1.15rem 0;
}

.am-faq details:first-of-type { border-top: var(--am-linia); }

.am-faq summary {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 1.5rem;
	cursor: pointer;
	list-style: none;
	font-family: var(--wp--preset--font-family--bricolage);
	font-size: 1.0625rem;
	font-weight: 600;
	letter-spacing: -.01em;
	color: var(--wp--preset--color--granat);
}

.am-faq summary::-webkit-details-marker { display: none; }

.am-faq summary::after {
	content: '';
	flex: 0 0 auto;
	width: .7rem;
	height: .7rem;
	border-right: 2px solid var(--wp--preset--color--malina);
	border-bottom: 2px solid var(--wp--preset--color--malina);
	transform: rotate(45deg) translateY(-.15rem);
	transition: transform .22s var(--am-krzywa);
}

.am-faq details[open] summary::after { transform: rotate(-135deg) translateY(-.15rem); }

.am-faq details[open] summary { margin-bottom: .75rem; }

.am-faq details > *:not(summary) { color: var(--wp--preset--color--szary); max-width: 70ch; }

.am-faq details p:last-child { margin-bottom: 0; }


/* ==========================================================================
   16. Blog
   ========================================================================== */

.am-wpisy {
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(19rem, 1fr));
	gap: 2.5rem 2rem;
}

.am-wpis__data {
	font-size: .8125rem;
	font-weight: 600;
	letter-spacing: .08em;
	text-transform: uppercase;
	color: var(--wp--preset--color--szary);
}

.am-wpis__tytul {
	font-family: var(--wp--preset--font-family--bricolage);
	font-size: 1.25rem;
	font-weight: 700;
	letter-spacing: -.02em;
	line-height: 1.25;
	margin: .5rem 0 .5rem;
}

.am-wpis__tytul a { color: var(--wp--preset--color--granat); text-decoration: none; }
.am-wpis__tytul a:hover { text-decoration: underline; }

.am-wpis__zajawka { margin: 0; font-size: .9375rem; color: var(--wp--preset--color--szary); }

.am-artykul { max-width: 42rem; }
.am-artykul h2 { margin-top: 2.25rem; }
.am-artykul h3 { margin-top: 1.75rem; }


/* ==========================================================================
   17. Formularze (Contact Form 7)
   ========================================================================== */

.am-formularz,
.am-formularz * { box-sizing: border-box; }

.am-formularz {
	background: #fff;
	border: var(--am-linia);
	border-radius: var(--am-r-duzy);
	padding: clamp(1.5rem, 1rem + 2vw, 2.5rem);
}

.am-formularz .wpcf7 { margin: 0; }

.am-pole { margin: 0 0 1.15rem; border: 0; padding: 0; min-width: 0; }

/* Contact Form 7 opakowuje pola ukryte we własny fieldset — bez resetu
   przeglądarka rysuje wokół nich pustą ramkę nad formularzem. */
.am-formularz fieldset {
	border: 0;
	margin: 0;
	padding: 0;
	min-width: 0;
}

.am-formularz .hidden-fields-container {
	display: none;
}

/* Komunikat pojawia się dopiero po wysłaniu — pusty nie zajmuje miejsca. */
.am-formularz .wpcf7-response-output:empty {
	display: none;
}

.am-pole__etykieta,
.am-formularz label.am-etykieta-pola {
	display: block;
	margin-bottom: .4rem;
	padding: 0;
	font-size: .9375rem;
	font-weight: 600;
	color: var(--wp--preset--color--granat);
}

.am-req { color: var(--wp--preset--color--malina); }

.am-podpowiedz {
	display: block;
	margin-top: .35rem;
	font-size: .8125rem;
	color: var(--wp--preset--color--szary);
}

.am-wiersz {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(12rem, 1fr));
	gap: 0 1rem;
}

.am-formularz input[type="text"],
.am-formularz input[type="email"],
.am-formularz input[type="tel"],
.am-formularz input[type="number"],
.am-formularz input[type="search"],
.am-formularz select,
.am-formularz textarea {
	width: 100%;
	padding: .8rem .95rem;
	border: 1.5px solid var(--wp--preset--color--linia);
	border-radius: var(--am-r);
	background: #fff;
	font: inherit;
	font-size: 1rem;
	color: var(--wp--preset--color--atrament);
	transition: border-color .16s var(--am-krzywa), box-shadow .16s var(--am-krzywa);
}

.am-formularz select {
	appearance: none;
	background-image: linear-gradient(45deg, transparent 50%, var(--wp--preset--color--granat) 50%),
		linear-gradient(135deg, var(--wp--preset--color--granat) 50%, transparent 50%);
	background-position: calc(100% - 1.15rem) 1.35rem, calc(100% - .8rem) 1.35rem;
	background-size: .35rem .35rem, .35rem .35rem;
	background-repeat: no-repeat;
	padding-right: 2.5rem;
}

.am-formularz input:focus,
.am-formularz select:focus,
.am-formularz textarea:focus {
	outline: none;
	border-color: var(--wp--preset--color--granat);
	box-shadow: 0 0 0 3px rgba(36, 71, 143, .14);
}

.am-formularz textarea { min-height: 7rem; resize: vertical; }

.am-formularz .wpcf7-radio,
.am-formularz .wpcf7-checkbox {
	display: flex;
	flex-wrap: wrap;
	gap: .5rem .75rem;
}

.am-formularz .wpcf7-list-item { margin: 0; }

.am-formularz .wpcf7-radio .wpcf7-list-item label,
.am-formularz .wpcf7-checkbox .wpcf7-list-item label {
	display: inline-flex;
	align-items: center;
	gap: .5rem;
	padding: .55rem .9rem;
	border: 1.5px solid var(--wp--preset--color--linia);
	border-radius: var(--am-r);
	font-size: .9375rem;
	cursor: pointer;
	transition: border-color .16s var(--am-krzywa), background .16s var(--am-krzywa);
}

.am-formularz .wpcf7-radio .wpcf7-list-item label:hover,
.am-formularz .wpcf7-checkbox .wpcf7-list-item label:hover { border-color: #C7BFB4; }

.am-formularz input[type="radio"],
.am-formularz input[type="checkbox"] {
	appearance: none;
	width: 1.05rem;
	height: 1.05rem;
	margin: 0;
	border: 1.5px solid #B9B1A6;
	background: #fff;
	display: grid;
	place-content: center;
	flex: 0 0 auto;
}

.am-formularz input[type="radio"] { border-radius: 50%; }
.am-formularz input[type="checkbox"] { border-radius: 3px; }

.am-formularz input[type="radio"]::before {
	content: '';
	width: .5rem;
	height: .5rem;
	border-radius: 50%;
	background: #fff;
	transform: scale(0);
	transition: transform .15s var(--am-krzywa);
}

.am-formularz input[type="checkbox"]::before {
	content: '';
	width: .6rem;
	height: .35rem;
	margin-top: -.12rem;
	border-left: 2px solid #fff;
	border-bottom: 2px solid #fff;
	transform: rotate(-45deg) scale(0);
	transition: transform .15s var(--am-krzywa);
}

.am-formularz input[type="radio"]:checked,
.am-formularz input[type="checkbox"]:checked {
	background: var(--wp--preset--color--granat);
	border-color: var(--wp--preset--color--granat);
}

.am-formularz input[type="radio"]:checked::before,
.am-formularz input[type="checkbox"]:checked::before { transform: rotate(0) scale(1); }
.am-formularz input[type="checkbox"]:checked::before { transform: rotate(-45deg) scale(1); }

.am-formularz .wpcf7-radio .wpcf7-list-item label:has(input:checked),
.am-formularz .wpcf7-checkbox .wpcf7-list-item label:has(input:checked) {
	border-color: var(--wp--preset--color--granat);
	background: rgba(36, 71, 143, .05);
}

.am-formularz .wpcf7-acceptance .wpcf7-list-item label {
	display: flex;
	align-items: flex-start;
	gap: .7rem;
	padding: .9rem 1rem;
	border: var(--am-linia);
	border-radius: var(--am-r);
	font-size: .875rem;
	line-height: 1.55;
	color: var(--wp--preset--color--szary);
}

.am-formularz .wpcf7-acceptance input[type="checkbox"] { margin-top: .15rem; }

.am-formularz input[type="submit"] {
	padding: .9rem 1.85rem;
	border: 0;
	border-radius: var(--am-r);
	background: var(--wp--preset--color--malina);
	color: #fff;
	font: inherit;
	font-size: 1.0625rem;
	font-weight: 600;
	cursor: pointer;
	transition: background .18s var(--am-krzywa);
}

.am-formularz input[type="submit"]:hover { background: #8F2F68; }
.am-formularz .wpcf7-form.submitting input[type="submit"] { opacity: .6; pointer-events: none; }

.am-formularz .wpcf7-not-valid { border-color: var(--wp--preset--color--malina) !important; }

.am-formularz .wpcf7-not-valid-tip {
	margin-top: .35rem;
	font-size: .8125rem;
	font-weight: 600;
	color: #8F2F68;
}

.am-formularz .wpcf7-response-output {
	margin: 1.5rem 0 0 !important;
	padding: 1rem 1.15rem !important;
	border: 0 !important;
	border-left: 4px solid var(--wp--preset--color--szary) !important;
	border-radius: 0 var(--am-r) var(--am-r) 0;
	background: var(--wp--preset--color--kreda);
	font-size: .9375rem;
}

.am-formularz .wpcf7-form.sent .wpcf7-response-output {
	border-left-color: var(--wp--preset--color--zielony) !important;
	background: rgba(22, 121, 79, .08);
	color: #0F5537;
	font-weight: 600;
}

.am-formularz .wpcf7-form.invalid .wpcf7-response-output,
.am-formularz .wpcf7-form.unaccepted .wpcf7-response-output,
.am-formularz .wpcf7-form.failed .wpcf7-response-output {
	border-left-color: var(--wp--preset--color--malina) !important;
	background: rgba(179, 61, 130, .07);
	color: #8F2F68;
	font-weight: 600;
}


/* ==========================================================================
   18. Stopka
   ========================================================================== */

.am-stopka {
	background: var(--wp--preset--color--granat);
	color: #D7DEEE;
	padding-block: var(--wp--preset--spacing--60) var(--wp--preset--spacing--50);
	margin-top: var(--wp--preset--spacing--70);
}

.am-stopka__siatka {
	display: grid;
	grid-template-columns: 1.4fr 1fr 1fr 1.2fr;
	gap: 2.5rem 2rem;
}

.am-stopka a { color: #fff; text-decoration: none; }
.am-stopka a:hover { text-decoration: underline; }

.am-stopka__tytul {
	font-size: .75rem;
	font-weight: 700;
	letter-spacing: .12em;
	text-transform: uppercase;
	color: #C4CFE9;
	margin: 0 0 .9rem;
}

.am-stopka ul { list-style: none; margin: 0; padding: 0; }
.am-stopka li + li { margin-top: .5rem; }
.am-stopka p { margin: 0 0 .6rem; font-size: .9375rem; }

.am-stopka__dol {
	display: flex;
	flex-wrap: wrap;
	gap: 1rem 2rem;
	justify-content: space-between;
	margin-top: 3rem;
	padding-top: 1.5rem;
	border-top: 1px solid rgba(255, 255, 255, .16);
	font-size: .8125rem;
	color: #C4CFE9;
}

.am-stopka__dol a { color: #C4CFE9; }

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

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


/* ==========================================================================
   19. Mobilny pasek akcji: Zadzwoń / Zapytaj o miejsce
   ========================================================================== */

.am-pasek-mobilny {
	position: fixed;
	left: 0;
	right: 0;
	bottom: 0;
	z-index: 150;
	display: grid;
	grid-template-columns: 1fr 1fr;
	background: #fff;
	border-top: var(--am-linia);
	box-shadow: 0 -6px 18px rgba(26, 29, 43, .08);
	transform: translateY(110%);
	transition: transform .28s var(--am-krzywa);
	padding-bottom: env(safe-area-inset-bottom);
}

.am-pasek-mobilny--widoczny { transform: translateY(0); }

.am-pasek-mobilny a {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: .5rem;
	padding: .95rem .5rem;
	font-size: .9375rem;
	font-weight: 600;
	text-decoration: none;
	color: var(--wp--preset--color--granat);
}

.am-pasek-mobilny a + a {
	background: var(--wp--preset--color--malina);
	color: #fff;
}

@media (min-width: 900px) {
	.am-pasek-mobilny { display: none; }
}


/* ==========================================================================
   20. Ograniczony ruch
   ========================================================================== */

@media (prefers-reduced-motion: reduce) {
	*, *::before, *::after {
		animation-duration: .01ms !important;
		transition-duration: .01ms !important;
		scroll-behavior: auto !important;
	}

	html { scroll-behavior: auto; }
}


/* ==========================================================================
   21. Kontener i siatka treści
   ========================================================================== */

.am-kontener {
	max-width: var(--am-max);
	margin-inline: auto;
	padding-inline: var(--wp--preset--spacing--40);
}

.am-kontener--waski {
	max-width: 46rem;
}

.am-tresc > * + * { margin-top: 1.15rem; }

/* Długość wiersza tekstu ograniczona do wygodnej miary; tabele, listy kursów
   i inne szerokie elementy zachowują pełną szerokość kolumny. */
.am-tresc > p,
.am-tresc > ul,
.am-tresc > ol,
.am-tresc > h2,
.am-tresc > h3,
.am-tresc > h4,
.am-tresc > blockquote,
.am-tresc > .am-faq,
.am-tresc > .am-notatka,
.am-tresc > .am-wyroznienie {
	max-width: 74ch;
}
.am-tresc h2 { margin-top: 2.5rem; }
.am-tresc h3 { margin-top: 2rem; }
.am-tresc ul, .am-tresc ol { padding-left: 1.15rem; }
.am-tresc li + li { margin-top: .4rem; }
.am-tresc a { color: var(--wp--preset--color--granat); }

/* Przycisk w treści zachowuje swój biały tekst — inaczej dziedziczyłby
   granatowy kolor odnośników i znikał na malinowym tle. */
.am-tresc a.am-btn-cta,
.am-ciemna a.am-btn-cta {
	color: #fff;
}

/* Układ dwukolumnowy: treść + kolumna boczna (np. parametry kursu). */
.am-uklad {
	display: grid;
	grid-template-columns: minmax(0, 1fr) 20rem;
	gap: 3rem;
	align-items: start;
}

/* Bez min-width:0 element siatki nie zwęża się poniżej szerokości swojej
   treści — szeroka tabela rozpychałaby wtedy stronę w poziomie. */
.am-uklad > *,
.am-naglowek-strony > *,
.am-naglowek-sekcji > *,
.am-dwie-kolumny > *,
.am-wpisy > * {
	min-width: 0;
}

.am-bok {
	position: sticky;
	top: calc(var(--am-naglowek-h) + 1.5rem);
	border: var(--am-linia);
	border-radius: var(--am-r-duzy);
	padding: 1.5rem;
	background: #fff;
}

.am-bok h2 {
	font-size: 1.125rem;
	margin: 0 0 1rem;
}

@media (max-width: 1000px) {
	.am-uklad { grid-template-columns: minmax(0, 1fr); }
	.am-bok { position: static; }
}

/* Nagłówek sekcji z opisem po prawej — układ redakcyjny, nie wyśrodkowany. */
.am-naglowek-sekcji {
	display: grid;
	grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
	gap: 1rem 4rem;
	align-items: end;
	margin-bottom: 2.5rem;
}

.am-naglowek-sekcji h2 { margin: 0; }

.am-naglowek-sekcji p {
	margin: 0;
	color: var(--wp--preset--color--szary);
	font-size: var(--wp--preset--font-size--large);
	line-height: 1.5;
}

@media (max-width: 860px) {
	.am-naglowek-sekcji { grid-template-columns: minmax(0, 1fr); align-items: start; }
}

/* Dwie kolumny tekstu — do dłuższych opisów redakcyjnych. */
.am-dwie-kolumny {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(19rem, 1fr));
	gap: 2rem 3rem;
}


/* ==========================================================================
   22. Korekty dla wąskich ekranów
   ========================================================================== */

@media (max-width: 720px) {
	/* Nagłówek strony i sekcji: tytuł nad opisem, bez sztucznego wyrównania do dołu. */
	.am-naglowek-strony,
	.am-naglowek-sekcji {
		gap: .85rem;
	}

	/* Cena i status w jednym wierszu — oszczędza wysokość na liście kursów. */
	.am-kurs__prawa {
		display: flex;
		align-items: center;
		gap: .85rem;
		flex-wrap: wrap;
	}

	.am-kurs__prawa > div {
		margin-top: 0 !important;
	}

	.am-cena {
		display: flex;
		align-items: baseline;
		gap: .35rem;
	}

	.am-cena small {
		display: inline;
	}

	/* Parametry kursu: jedna kolumna, bez wiszących ramek. */
	.am-parametr {
		border-right: 0;
	}

	/* Cytat bez wcięcia, które zjada połowę szerokości. */
	.am-cytat {
		padding-left: 1.25rem;
	}

	/* Filtry oferty: pełna szerokość pól i przycisku. */
	[data-am-filtry] .am-wiersz {
		grid-template-columns: 1fr;
	}

	[data-am-filtry] .am-btn-cta {
		width: 100%;
		text-align: center;
	}

	.am-formularz input[type="submit"] {
		width: 100%;
	}
}

@media (max-width: 560px) {
	/* Nagłówek: logo bez hasła, żeby zostało miejsce na przycisk menu. */
	.am-logo__haslo {
		display: none;
	}

	.am-logo img,
	.am-logo svg {
		width: 2.2rem;
	}

	.am-hero {
		padding-top: var(--wp--preset--spacing--50);
	}

	.am-hero__tytul {
		max-width: none;
	}

	.am-etykieta::before {
		width: 1.5rem;
	}

	/* Okruszki na jednej linii z możliwością zawinięcia. */
	.am-okruszki {
		font-size: .8125rem;
	}

	/* Stopka: przycisk na pełną szerokość kolumny. */
	.am-stopka .am-btn-cta {
		display: block;
		text-align: center;
	}

	/* Miejsce na przyklejony pasek akcji, żeby nie zasłaniał ostatniej sekcji. */
	.am-stopka {
		padding-bottom: calc(var(--wp--preset--spacing--50) + 3.5rem);
	}
}


/* ==========================================================================
   23. Grafika hero — kompozycja zamiast zdjęcia
   ========================================================================== */

.am-hero__grafika {
	display: block;
	width: 100%;
	height: auto;
	border-radius: var(--am-r-duzy);
	box-shadow: var(--am-cien);
}


/* ==========================================================================
   24. Ścieżki wyboru: dwa wiersze po cztery + „Cała oferta” na pełną szerokość
   ========================================================================== */

.am-sciezki {
	grid-template-columns: repeat(4, minmax(0, 1fr));
}

/* Pionowe kreski między kolumnami — bez nich cztery kolumny się zlewają. */
.am-sciezki > *:not(:nth-child(4n+1)) {
	border-left: var(--am-linia);
	padding-left: 1.5rem;
}

/* Pozycja zewnętrzna prowadzi poza serwis — inna strzałka. */
.am-sciezka--zewnetrzna .am-sciezka__tytul::after {
	content: '↗';
}

/* Pozycja jeszcze nieuruchomiona: bez odnośnika i bez strzałki. */
.am-sciezka--wkrotce {
	cursor: default;
}

.am-sciezka--wkrotce .am-sciezka__tytul {
	color: var(--wp--preset--color--szary);
}

.am-sciezka--wkrotce .am-sciezka__tytul::after {
	display: none;
}

.am-sciezka--wkrotce:hover {
	background: transparent;
}

/* „Cała oferta” — osobny, pełnej szerokości wiersz pod kaflami. */
.am-sciezka--pelna {
	grid-column: 1 / -1;
	display: flex;
	flex-wrap: wrap;
	align-items: baseline;
	gap: .35rem 1.5rem;
	background: var(--wp--preset--color--kreda);
	padding-left: 1.5rem;
}

.am-sciezka--pelna .am-sciezka__nadtytul {
	margin-bottom: 0;
}

.am-sciezka--pelna .am-sciezka__opis {
	max-width: 56ch;
	margin-left: auto;
}

.am-sciezka--pelna:hover {
	background: #fff;
}

@media (max-width: 1080px) {
	.am-sciezki { grid-template-columns: repeat(2, minmax(0, 1fr)); }

	.am-sciezki > *:not(:nth-child(4n+1)) { border-left: 0; padding-left: 0; }
	.am-sciezki > *:not(:nth-child(2n+1)) { border-left: var(--am-linia); padding-left: 1.5rem; }
	.am-sciezka--pelna { padding-left: 1.5rem; }
}

@media (max-width: 620px) {
	.am-sciezki { grid-template-columns: 1fr; }

	.am-sciezki > * { border-left: 0 !important; padding-left: 0 !important; }
	.am-sciezka--pelna { padding-left: 1.25rem !important; }
	.am-sciezka--pelna .am-sciezka__opis { margin-left: 0; }
}


/* ==========================================================================
   25. Wolne miejsca w rozbiciu na lokalizacje
   ========================================================================== */

.am-kurs__miejsca {
	margin: .6rem 0 0;
	font-size: .875rem;
	color: var(--wp--preset--color--szary);
}

.am-kurs__miejsca strong {
	color: var(--wp--preset--color--malina);
	font-weight: 700;
}

.am-miejsca-lista {
	list-style: none;
	margin: .5rem 0 0;
	padding: 0;
	font-size: .9375rem;
}

.am-miejsca-lista li {
	display: flex;
	align-items: baseline;
	justify-content: space-between;
	gap: .75rem;
	padding: .35rem 0;
	border-bottom: var(--am-linia);
}

.am-miejsca-lista li:last-child {
	border-bottom: 0;
}

.am-miejsca-lista strong {
	font-family: var(--wp--preset--font-family--bricolage);
	font-size: 1.125rem;
	color: var(--wp--preset--color--granat);
}


/* ==========================================================================
   26. Opinie rodziców i uczniów
   ========================================================================== */

.am-opinie {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(18rem, 1fr));
	gap: 1.25rem;
}

.am-opinia {
	margin: 0;
	padding: 1.5rem;
	background: #fff;
	border: var(--am-linia);
	border-top: 3px solid var(--wp--preset--color--zolty);
	border-radius: var(--am-r);
	display: flex;
	flex-direction: column;
	gap: .75rem;
}

.am-opinia__ocena {
	color: #B8860B;
	letter-spacing: .1em;
	font-size: 1rem;
	line-height: 1;
}

.am-opinia blockquote {
	margin: 0;
	padding: 0;
	border: 0;
	font-size: 1rem;
	line-height: 1.6;
	color: var(--wp--preset--color--tekst);
}

.am-opinia blockquote::before {
	content: '„';
}

.am-opinia blockquote::after {
	content: '”';
}

.am-opinia figcaption {
	margin-top: auto;
	padding-top: .5rem;
	border-top: var(--am-linia);
	font-size: .875rem;
}

.am-opinia__autor {
	display: block;
	font-weight: 700;
	color: var(--wp--preset--color--granat);
}

.am-opinia__zrodlo {
	display: block;
	color: var(--wp--preset--color--szary);
}


/* ==========================================================================
   27. Mapa dojazdu — wczytywana dopiero po kliknięciu (bez śledzenia na wejściu)
   ========================================================================== */

.am-mapa {
	position: relative;
	margin-top: 1.5rem;
	border: var(--am-linia);
	border-radius: var(--am-r);
	overflow: hidden;
	background: var(--wp--preset--color--kreda);
}

.am-mapa__plansza {
	display: grid;
	place-items: center;
	gap: .75rem;
	min-height: 22rem;
	padding: 2rem 1.5rem;
	text-align: center;
}

.am-mapa__plansza p {
	margin: 0;
	max-width: 46ch;
	font-size: .9375rem;
	color: var(--wp--preset--color--szary);
}

.am-mapa__ramka {
	display: block;
	width: 100%;
	height: 26rem;
	border: 0;
}

.am-mapa__adresy {
	list-style: none;
	margin: 1rem 0 0;
	padding: 0;
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(14rem, 1fr));
	gap: .5rem 1.5rem;
	font-size: .9375rem;
}

.am-mapa__adresy li {
	padding: .5rem 0;
	border-top: var(--am-linia);
}

.am-mapa__adresy strong {
	display: block;
	color: var(--wp--preset--color--granat);
}


/* ==========================================================================
   28. Hero ze zdjęciem — karty roku szkolnego i wielkości grupy na wierzchu
   ========================================================================== */

.am-hero__zdjecie {
	position: relative;
	margin: 0;
}

/* Zdjęcie zachowuje własne proporcje — kadr grupowy z osobami przy krawędziach
   nie może zostać przycięty. Przycinamy dopiero, gdy zdjęcie jest bardzo wysokie. */
.am-hero__zdjecie img {
	display: block;
	width: 100%;
	height: auto;
	max-height: 34rem;
	object-fit: cover;
	object-position: center 35%;
	border-radius: var(--am-r-duzy);
	box-shadow: var(--am-cien);
}

/* Karty wychodzą poza obrys zdjęcia — czytelne nawet, gdy zdjęcie jest słabsze. */
.am-hero__karta {
	position: absolute;
	display: flex;
	flex-direction: column;
	gap: .1rem;
	padding: .9rem 1.15rem;
	border-radius: var(--am-r);
	box-shadow: 0 6px 24px rgba(26, 29, 43, .18);
	max-width: 14rem;
}

.am-hero__karta--rok {
	top: -1.25rem;
	left: -1.5rem;
	background: var(--wp--preset--color--granat);
	color: #fff;
}

.am-hero__karta--grupa {
	bottom: -1.5rem;
	right: -1.25rem;
	background: var(--wp--preset--color--malina);
	color: #fff;
	text-align: right;
	align-items: flex-end;
}

.am-hero__karta-etykieta {
	font-size: .6875rem;
	font-weight: 700;
	letter-spacing: .14em;
	text-transform: uppercase;
	opacity: .85;
}

.am-hero__karta-wartosc {
	font-family: var(--wp--preset--font-family--bricolage);
	font-size: 1.5rem;
	font-weight: 700;
	letter-spacing: -.02em;
	line-height: 1.1;
}

.am-hero__karta-opis {
	font-size: .8125rem;
	opacity: .9;
}

@media (max-width: 980px) {
	.am-hero__karta--rok { top: -1rem; left: -.5rem; }
	.am-hero__karta--grupa { bottom: -1rem; right: -.5rem; }
}

@media (max-width: 520px) {
	.am-hero__zdjecie img { max-height: 20rem; }
	.am-hero__karta { position: static; max-width: none; margin-top: .75rem; text-align: left; align-items: flex-start; }
	.am-hero__karta--grupa { text-align: left; }
}


/* ==========================================================================
   29. Karuzela opinii
   ========================================================================== */

.am-karuzela {
	position: relative;
}

/* Nadpisujemy siatkę z sekcji 26 — opinie przewijają się w poziomie. */
.am-opinie {
	display: flex;
	grid-template-columns: none;
	gap: 1.25rem;
	overflow-x: auto;
	scroll-snap-type: x mandatory;
	scroll-padding-left: 0;
	padding-bottom: .5rem;
	scrollbar-width: thin;
}

.am-opinie::-webkit-scrollbar { height: 6px; }
.am-opinie::-webkit-scrollbar-thumb { background: var(--wp--preset--color--linia); border-radius: 3px; }

.am-opinie .am-opinia {
	flex: 0 0 clamp(17rem, 30%, 22rem);
	scroll-snap-align: start;
}

.am-opinie:focus-visible {
	outline: 2px solid var(--wp--preset--color--malina);
	outline-offset: 4px;
}

.am-karuzela__sterowanie {
	display: flex;
	gap: .5rem;
	justify-content: flex-end;
	margin-top: 1rem;
}

.am-karuzela__strzalka {
	width: 2.5rem;
	height: 2.5rem;
	border: var(--am-linia);
	border-radius: 50%;
	background: #fff;
	color: var(--wp--preset--color--granat);
	font-size: 1.125rem;
	line-height: 1;
	cursor: pointer;
	transition: background .18s var(--am-krzywa), color .18s var(--am-krzywa);
}

.am-karuzela__strzalka:hover {
	background: var(--wp--preset--color--granat);
	color: #fff;
}


/* ==========================================================================
   30. „Cała oferta” — wyśrodkowany wiersz zamykający kafle
   ========================================================================== */

.am-sciezka--pelna {
	display: block;
	text-align: center;
	padding: 1.75rem 1.5rem;
}

.am-sciezka--pelna .am-sciezka__tytul {
	display: block;
	font-size: 1.5rem;
	margin-bottom: .35rem;
}

.am-sciezka--pelna .am-sciezka__tytul::after {
	content: ' →';
	display: inline;
}

.am-sciezka--pelna .am-sciezka__opis {
	max-width: 62ch;
	margin: 0 auto;
}

@media (max-width: 620px) {
	.am-sciezka--pelna { padding-left: 0 !important; }
}