/*
 * Podstawy motywu: czcionki lokalne, tokeny z makiety nosidla-wp (assets/site.css i assets/tw.js), typografia,
 * przyciski, pola formularzy i drobne klasy pomocnicze. Tokeny są w zmiennych CSS, reszta plików z nich korzysta.
 */

/* Czcionki: Figtree i Young Serif, SIL Open Font License 1.1 (licencje w assets/fonts/). */
@font-face {
	font-family: "Figtree";
	font-style: normal;
	font-weight: 400 700;
	font-display: swap;
	src: url("../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-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
	font-family: "Figtree";
	font-style: normal;
	font-weight: 400 700;
	font-display: swap;
	src: url("../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: "Young Serif";
	font-style: normal;
	font-weight: 400;
	font-display: swap;
	src: url("../fonts/young-serif-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-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
	font-family: "Young Serif";
	font-style: normal;
	font-weight: 400;
	font-display: swap;
	src: url("../fonts/young-serif-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;
}

:root {
	color-scheme: light;

	/* Kolory (nazwa „pine” z makiety to tu „accent”). */
	--c-paper: #F5F1EB;
	--c-card: #FFFFFF;
	--c-ink: #2B2522;
	--c-muted: #6E6560;
	--c-line: #E6DED5;
	--c-accent: #C84654;
	--c-accent-dark: #A9384A;
	--c-accent-soft: #F9E1DF;
	--c-accent-faint: #FCF0EE;
	--c-sun: #F6C453;
	--c-sun-soft: #FDF0CC;
	--c-alert: #A8322F;
	--c-alert-soft: #F8E1DE;
	--c-ink-20: rgba(43, 37, 34, .2);
	--c-ink-25: rgba(43, 37, 34, .25);

	/* Czcionki */
	--font-display: "Young Serif", Georgia, serif;
	--font-sans: "Figtree", ui-sans-serif, system-ui, -apple-system, "Segoe UI", sans-serif;

	/* Promienie */
	--radius-sm: .5rem;
	--radius: .75rem;
	--radius-lg: 1rem;
	--radius-xl: 1.25rem;
	--radius-pill: 9999px;

	/* Układ i odstępy */
	--wrap: 1200px;
	--gutter-l: max(16px, env(safe-area-inset-left, 0px));
	--gutter-r: max(16px, env(safe-area-inset-right, 0px));
	--section-y: 4rem;
	--header-h: 72px;
	--nav-h: 48px;
	--admin-bar: var(--wp-admin--admin-bar--height, 0px);
	--shadow: 0 10px 30px rgba(43, 37, 34, .08);
}

*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; scroll-behavior: smooth; }
body {
	margin: 0;
	background: var(--c-paper);
	color: var(--c-ink);
	font-family: var(--font-sans);
	font-size: 16px;
	line-height: 1.55;
	-webkit-font-smoothing: antialiased;
}
[hidden] { display: none !important; }
img, svg, video { max-width: 100%; height: auto; }
a { color: inherit; }
a, button, input, select, textarea, summary { -webkit-tap-highlight-color: transparent; }
button { font: inherit; color: inherit; cursor: pointer; }
:focus-visible { outline: 2px solid var(--c-accent); outline-offset: 2px; border-radius: 6px; }

/* Young Serif ma jedną grubość: bez sztucznego pogrubienia. */
h1, h2, h3, .display {
	font-family: var(--font-display);
	font-weight: 400 !important;
	font-synthesis: none;
	text-wrap: balance;
	letter-spacing: 0;
	line-height: 1.15;
}
h4, h5, h6 { font-family: var(--font-sans); font-weight: 600; line-height: 1.3; }

/* Komponenty motywu mają własne odstępy (jak reset w Tailwindzie makiety); treść wpisów ma swoje w content.css. */
:where(.site-header, .site-footer, .front, .not-found, .page-header, .post-card, .chips) :where(h1, h2, h3, h4, p, ul, ol, dl, dd, figure) {
	margin: 0;
}
:where(.site-header, .site-footer, .front, .chips) :where(ul, ol) { padding: 0; list-style: none; }

/* Układ: margines boczny i szerokość treści */
.gutter { padding-left: var(--gutter-l); padding-right: var(--gutter-r); }
.wrap { width: 100%; max-width: var(--wrap); margin-inline: auto; }
.site-main { display: block; min-width: 0; }

/* Typografia pomocnicza */
.eyebrow { display: inline-block; font-size: .75rem; font-weight: 600; letter-spacing: .08em; text-transform: uppercase; color: var(--c-accent); }
.muted { color: var(--c-muted); }
.accent { color: var(--c-accent); }
.lead { font-size: 17px; }
.num { font-variant-numeric: tabular-nums; }

.link-underline {
	font-weight: 600;
	text-decoration: underline;
	text-underline-offset: 4px;
	text-decoration-thickness: 2px;
	text-decoration-color: rgba(200, 70, 84, .4);
}
.link-underline:hover { text-decoration-color: var(--c-accent); }

/* Przyciski */
.btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: .5rem;
	min-height: 44px;
	padding: 0 1.5rem;
	border: 1px solid transparent;
	border-radius: var(--radius-pill);
	font-weight: 600;
	font-size: 16px;
	line-height: 1.2;
	text-decoration: none;
	transition: background-color .15s ease, border-color .15s ease;
}
.btn--primary { background: var(--c-accent); color: #FFFFFF; }
.btn--primary:hover { background: var(--c-accent-dark); color: #FFFFFF; }
.btn--outline { background: transparent; border-color: var(--c-ink-25); color: var(--c-ink); }
.btn--outline:hover { border-color: var(--c-accent); }
.btn--lg { min-height: 48px; padding: 0 2rem; font-size: 17px; }

/* Pola formularzy */
input[type="text"], input[type="email"], input[type="search"], input[type="tel"], input[type="url"],
input[type="password"], input[type="number"], input[type="date"], select, textarea {
	font: inherit;
	color: var(--c-ink);
	max-width: 100%;
}

/* Wyszukiwarka w kształcie pigułki (nagłówek, menu, 404, wyniki wyszukiwania) */
.search-pill {
	display: flex;
	align-items: center;
	gap: .5rem;
	height: 44px;
	padding: 0 .5rem 0 1.25rem;
	border: 1px solid var(--c-line);
	border-radius: var(--radius-pill);
	background: var(--c-card);
	color: var(--c-muted);
	min-width: 0;
}
.search-pill:focus-within { border-color: var(--c-accent); }
.search-pill__input {
	flex: 1;
	min-width: 0;
	height: 100%;
	border: 0;
	background: transparent;
	outline: none;
	color: var(--c-ink);
	-webkit-appearance: none;
	appearance: none;
}
.search-pill__input::placeholder { color: var(--c-muted); opacity: 1; }
.search-pill__input::-webkit-search-cancel-button { -webkit-appearance: none; }
.search-pill__submit {
	display: grid;
	place-items: center;
	width: 34px;
	height: 34px;
	border: 0;
	border-radius: var(--radius-pill);
	background: transparent;
	color: var(--c-muted);
}
.search-pill__submit:hover { color: var(--c-accent); background: var(--c-accent-faint); }

/* Ikony */
.icon { width: 24px; height: 24px; flex-shrink: 0; display: block; }
.icon--sm { width: 18px; height: 18px; }
.icon--lg { width: 26px; height: 26px; }
.icon-circle {
	display: grid;
	place-items: center;
	width: 56px;
	height: 56px;
	flex-shrink: 0;
	border-radius: var(--radius-pill);
	background: var(--c-accent-faint);
	color: var(--c-accent);
}
.icon-circle--outline { width: 48px; height: 48px; background: var(--c-card); border: 1px solid var(--c-line); }

/* Zdjęcia w ramce z zaokrągleniem; obrazek wypełnia kadr */
.photo { position: relative; overflow: hidden; max-width: 100%; background: var(--c-line); border-radius: var(--radius-lg); }
.photo img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; transition: transform .5s ease; }
.photo--4x3 { aspect-ratio: 4 / 3; }
a:hover .photo img { transform: scale(1.03); }

/* Żółte kropki, jedyny ozdobnik (jak w sklepie referencyjnym klientki) */
.dots { position: absolute; display: flex; flex-direction: column; gap: 26px; pointer-events: none; }
.dots i { display: block; width: 46px; height: 46px; border-radius: var(--radius-pill); background: var(--c-sun); }

/* Tekst tylko dla czytników ekranu (standard WordPressa) */
.screen-reader-text {
	border: 0;
	clip: rect(1px, 1px, 1px, 1px);
	clip-path: inset(50%);
	height: 1px;
	margin: -1px;
	overflow: hidden;
	padding: 0;
	position: absolute !important;
	width: 1px;
	word-wrap: normal !important;
}
.skip-link:focus {
	clip: auto !important;
	clip-path: none;
	height: auto;
	width: auto;
	left: 8px;
	top: 8px;
	z-index: 100000;
	padding: .75rem 1rem;
	background: var(--c-card);
	color: var(--c-ink);
	border-radius: var(--radius);
	box-shadow: var(--shadow);
	font-weight: 600;
	text-decoration: none;
}

/* Kotwice sekcji nie chowają się pod przyklejonym nagłówkiem */
.anchor-target { scroll-margin-top: calc(var(--admin-bar) + var(--header-h) + var(--nav-h) + 16px); }

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