/**
 * Fundacja KOSMOS — tokeny i komponenty wspólne (księga identyfikacji 1.0, pkt 4–6, 9).
 *
 * Tu mieszka TYLKO to, co jest wspólne dla wielu sekcji: tokeny, przyciski, nadlinia,
 * logotyp, nagłówek i stopka Kadence. Style sekcji są w blocks/<slug>/style.css.
 *
 * Kolory = sloty palety Kadence (--global-paletteN, KSM_Setup::PALETTE) — zmiana
 * w Wygląd → Dostosuj → Kolory działa na całą stronę. Kolory kart projektów spoza
 * 9 slotów są tokenami tutaj.
 */

:root {
	--kosmos-copper-btn: var(--global-palette1, #ba7532);
	--kosmos-copper-deep: var(--global-palette2, #8b4c18);
	--kosmos-navy: var(--global-palette3, #17263b);
	--kosmos-ink: var(--global-palette4, #111923);
	--kosmos-muted: var(--global-palette5, #5a626b);
	--kosmos-line: var(--global-palette6, #d5d0c7);
	--kosmos-cream: var(--global-palette7, #f3efe6);
	--kosmos-page: var(--global-palette8, #f6f0e7);
	--kosmos-white: var(--global-palette9, #fff);
	--kosmos-sage: var(--global-palette11, #667d77);
	--kosmos-navy-hover: var(--global-palette12, #243a55);
	--kosmos-copper: var(--global-palette14, #d9a25f);
	/* Panele kart projektów zmierzone na makiecie (ciemne odmiany granatu, szałwii i cegły). */
	--kosmos-card-navy: #18233a;
	--kosmos-card-sage: #3d4a37;
	--kosmos-card-brown: #42291c;
	--font-display: "Manrope", Arial, Helvetica, sans-serif;
	--font-body: "Inter", Arial, Helvetica, sans-serif;
	--radius-sm: 4px;
	--radius-md: 8px;
	--ksm-wrap: 1280px;
	--ksm-wide: 1400px;
	--ksm-gutter: max(calc((100vw - var(--ksm-wrap)) / 2), clamp(16px, 4vw, 64px));
	--ksm-gutter-wide: max(calc((100vw - var(--ksm-wide)) / 2), clamp(16px, 1.5vw, 24px));
	--focus-ring: 3px solid var(--kosmos-copper);
}

body.ksm-site {
	background: var(--kosmos-page);
	color: var(--kosmos-ink);
	-webkit-font-smoothing: antialiased;
	overflow-x: hidden;
}

.ksm-site :focus-visible {
	outline: var(--focus-ring);
	outline-offset: 3px;
}

/* Strony z sekcjami: pełna szerokość, bez odstępów treści Kadence. */
.ksm-front .content-area,
.ksm-front .entry-content-wrap {
	margin: 0;
	padding: 0;
}

.ksm-front .entry-content > .alignfull,
.ksm-front .entry-content > [class*="wp-block-kosmos-"] {
	margin-top: 0;
	margin-bottom: 0;
}

.ksm-front .site-main > .entry,
.ksm-front .entry.single-entry {
	box-shadow: none;
	background: transparent;
}

/* Kadence `.single-content h1/p` (0,1,1) — reset marginesów w sekcjach motywu. */
.single-content :where([class*="wp-block-kosmos-"]) :is(h1, h2, h3, h4, h5, h6, p, ul, ol, li, figure) {
	margin: 0;
}

.single-content :where([class*="wp-block-kosmos-"]) :is(ul, ol) {
	padding: 0;
	list-style: none;
}

/* ---------------------------------------------------------------- komponenty
   `.editor-styles-wrapper` — te same komponenty w podglądzie bloków w edytorze. */

:is(.ksm-site, .editor-styles-wrapper) .ksm-eyebrow {
	display: block;
	margin: 0;
	font-family: var(--font-display);
	font-size: 17px;
	font-weight: 700;
	line-height: 1.4;
	letter-spacing: 0.33em;
	text-transform: uppercase;
	color: var(--kosmos-navy);
}

:is(.ksm-site, .editor-styles-wrapper) .ksm-eyebrow__sep {
	color: var(--kosmos-muted);
	font-weight: 500;
}

:is(.ksm-site, .editor-styles-wrapper) .ksm-eyebrow__sep {
	margin: 0 0.5em;
}

:is(.ksm-site, .editor-styles-wrapper) .ksm-eyebrow__line {
	display: inline-block;
	width: 52px;
	height: 2px;
	margin-left: 0.9em;
	vertical-align: 0.3em;
	background: var(--kosmos-copper-btn);
}

:is(.ksm-site, .editor-styles-wrapper) .ksm-button {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 0.7em;
	min-height: 56px;
	padding: 0 34px;
	border: 1.5px solid transparent;
	border-radius: var(--radius-sm);
	font-family: var(--font-display);
	font-size: 17px;
	font-weight: 700;
	line-height: 1.2;
	text-decoration: none;
	transition: background-color 0.2s ease, color 0.2s ease, border-color 0.2s ease;
}

:is(.ksm-site, .editor-styles-wrapper) .ksm-button--primary {
	background: var(--kosmos-copper-btn);
	color: var(--kosmos-white);
}

:is(.ksm-site, .editor-styles-wrapper) .ksm-button--primary:hover,
:is(.ksm-site, .editor-styles-wrapper) .ksm-button--primary:focus-visible {
	background: var(--kosmos-copper-deep);
	color: var(--kosmos-white);
}

:is(.ksm-site, .editor-styles-wrapper) .ksm-button--outline {
	background: transparent;
	border-color: var(--kosmos-navy);
	color: var(--kosmos-navy);
}

:is(.ksm-site, .editor-styles-wrapper) .ksm-button--outline:hover,
:is(.ksm-site, .editor-styles-wrapper) .ksm-button--outline:focus-visible {
	background: var(--kosmos-navy);
	color: var(--kosmos-white);
}

:is(.ksm-site, .editor-styles-wrapper) .ksm-button--outline-light {
	background: transparent;
	border-color: var(--kosmos-copper);
	color: var(--kosmos-copper);
}

:is(.ksm-site, .editor-styles-wrapper) .ksm-button--outline-light:hover,
:is(.ksm-site, .editor-styles-wrapper) .ksm-button--outline-light:focus-visible {
	background: var(--kosmos-copper);
	color: var(--kosmos-navy);
}

:is(.ksm-site, .editor-styles-wrapper) .ksm-textlink {
	display: inline-flex;
	align-items: center;
	gap: 0.6em;
	font-family: var(--font-display);
	font-weight: 700;
	text-decoration: none;
	color: var(--kosmos-copper);
}

:is(.ksm-site, .editor-styles-wrapper) .ksm-textlink:hover,
:is(.ksm-site, .editor-styles-wrapper) .ksm-textlink:focus-visible {
	color: var(--kosmos-white);
}

:is(.ksm-site, .editor-styles-wrapper) .ksm-arrow {
	display: inline-flex;
	transition: transform 0.2s ease;
}

:is(.ksm-site, .editor-styles-wrapper) a:hover > .ksm-arrow {
	transform: translateX(3px);
}

/* Nagłówek sekcji podstron (ksm_section_head): nadlinia + H2 po lewej, opis z miedzianą kreską po prawej. */
:is(.ksm-site, .editor-styles-wrapper) .ksm-head {
	display: grid;
	grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
	align-items: end;
	gap: 24px clamp(32px, 5vw, 80px);
}

:is(.ksm-site, .editor-styles-wrapper) .ksm-head__eyebrow {
	margin-bottom: 18px;
	font-size: 14px;
}

:is(.ksm-site, .editor-styles-wrapper) .ksm-head__title {
	margin: 0;
	font-family: var(--font-display);
	font-size: clamp(30px, 3.1vw, 46px);
	font-weight: 800;
	line-height: 1.1;
	letter-spacing: -0.015em;
	color: inherit;
}

:is(.ksm-site, .editor-styles-wrapper) .ksm-head__intro {
	position: relative;
	max-width: 36em;
	margin: 0;
	padding-left: 26px;
	font-family: var(--font-body);
	font-size: clamp(16px, 1.2vw, 18px);
	line-height: 1.55;
}

:is(.ksm-site, .editor-styles-wrapper) .ksm-head__intro::before {
	content: "";
	position: absolute;
	top: 0.35em;
	bottom: 0.35em;
	left: 0;
	width: 2px;
	background: var(--kosmos-copper-btn);
}

:is(.ksm-site, .editor-styles-wrapper) .is-tone-navy .ksm-head__eyebrow {
	color: var(--kosmos-copper);
}

:is(.ksm-site, .editor-styles-wrapper) .is-tone-navy .ksm-head__intro {
	color: rgba(255, 255, 255, 0.88);
}

@media (max-width: 860px) {
	:is(.ksm-site, .editor-styles-wrapper) .ksm-head {
		grid-template-columns: 1fr;
	}
}

/* Notatka „Do potwierdzenia” — tylko dla redaktorów (ksm_placeholder). */
:is(.ksm-site, .editor-styles-wrapper) .ksm-stub {
	position: relative;
	z-index: 5;
	margin: 0;
	padding: 10px 16px;
	background: #fff8e6;
	border: 1px dashed var(--kosmos-copper-deep);
	font: 13px/1.5 var(--font-body);
	color: var(--kosmos-ink);
}

:is(.ksm-site, .editor-styles-wrapper) .ksm-stub summary {
	cursor: pointer;
}

:is(.ksm-site, .editor-styles-wrapper) .ksm-stub ul {
	margin: 8px 0 4px 18px;
	padding: 0;
	list-style: disc;
}

/* ---------------------------------------------------------------- logotyp */

/* Kadence: `.inner-link-style-normal a:not(.button)` (0,2,1) podkreśla linki w elemencie HTML nagłówka. */
.ksm-site .header-html-inner a.ksm-logo,
.ksm-site .mobile-html-inner a.ksm-logo {
	text-decoration: none;
}

.ksm-logo {
	display: inline-flex;
	align-items: center;
	gap: 26px;
	color: var(--kosmos-white);
	text-decoration: none;
}

.ksm-logo:hover,
.ksm-logo:focus-visible {
	color: var(--kosmos-white);
}

.ksm-logo__mark {
	display: flex;
	flex-direction: column;
	padding-right: 28px;
	border-right: 2px solid var(--kosmos-copper);
	font-family: var(--font-display);
}

.ksm-logo__pre {
	font-size: 15px;
	font-weight: 700;
	line-height: 1;
	letter-spacing: 0.48em;
	text-transform: uppercase;
}

.ksm-logo__name {
	margin-top: 6px;
	font-size: 75px;
	font-weight: 700;
	line-height: 0.9;
	letter-spacing: 0.01em;
}

.ksm-logo__desc {
	display: flex;
	flex-direction: column;
	gap: 4px;
	font-family: var(--font-display);
	font-size: 12.5px;
	font-weight: 600;
	line-height: 1.35;
	letter-spacing: 0.24em;
	text-transform: uppercase;
	color: rgba(255, 255, 255, 0.82);
}

/* ---------------------------------------------------------------- nagłówek Kadence */

.ksm-site #masthead .site-main-header-wrap .site-container {
	max-width: none;
	padding: 0 max(calc((100vw - 1310px) / 2 - 24px), 8px) 0 max(calc((100vw - 1276px) / 2), 24px);
}

.ksm-site #masthead .header-html-inner,
.ksm-site #mobile-header .mobile-html-inner {
	display: flex;
}

.ksm-site #masthead .primary-menu-container > ul > li > a {
	position: relative;
	padding-right: 24px;
	padding-left: 24px;
	font-family: var(--font-display);
	font-size: 18px;
	font-weight: 600;
	letter-spacing: 0;
}

/* Podkreślenie aktywnej pozycji jak w makiecie: miedziana kreska pod tekstem. */
.ksm-site #masthead .primary-menu-container > ul > li > a::after {
	content: "";
	position: absolute;
	left: 50%;
	bottom: calc(50% - 30px);
	width: 0;
	height: 2px;
	background: var(--kosmos-copper);
	transform: translateX(-50%);
	transition: width 0.2s ease;
}

.ksm-site #masthead .primary-menu-container > ul > li.current-menu-item > a::after,
.ksm-site #masthead .primary-menu-container > ul > li.current-menu-ancestor > a::after,
.ksm-site #masthead .primary-menu-container > ul > li.current-page-ancestor > a::after,
.ksm-site #masthead .primary-menu-container > ul > li > a:hover::after {
	width: calc(100% - 48px);
}

.ksm-site #masthead .primary-menu-container > ul > li > a .dropdown-nav-toggle {
	color: currentColor;
}

.ksm-site #masthead .header-navigation .header-menu-container ul ul li a {
	font-family: var(--font-display);
	font-size: 15px;
	font-weight: 600;
}

.ksm-site #mobile-header .ksm-logo__mark {
	padding-right: 0;
	border-right: 0;
}

.ksm-site #mobile-header .ksm-logo__pre {
	font-size: 10px;
}

.ksm-site #mobile-header .ksm-logo__name {
	margin-top: 4px;
	font-size: 36px;
}

/* ---------------------------------------------------------------- stopka

   Treść stopki jest natywna i edytowalna w Wygląd → Dostosuj: kolumny to obszary widżetów
   Kadence (Stopka 1–3) i element „Footer Navigation” (menu „KOSMOS — stopka”), dolny pasek
   to element HTML stopki. Tu jest tylko wygląd na granacie (księga 8.3 pkt 09). */

.ksm-site .site-footer {
	font-family: var(--font-body);
	color: rgba(255, 255, 255, 0.82);
}

.ksm-site .site-middle-footer-wrap .site-container,
.ksm-site .site-bottom-footer-wrap .site-container {
	max-width: none;
	padding-right: var(--ksm-gutter);
	padding-left: var(--ksm-gutter);
}

.ksm-site .site-middle-footer-inner-wrap {
	padding-top: clamp(48px, 5vw, 72px);
	padding-bottom: clamp(36px, 4vw, 56px);
}

.ksm-site .site-footer .widget-title,
.ksm-site .site-footer .wp-block-heading {
	margin: 0 0 18px;
	font-family: var(--font-display);
	font-size: 13px;
	font-weight: 700;
	letter-spacing: 0.22em;
	text-transform: uppercase;
	color: var(--kosmos-copper);
}

.ksm-site .site-footer p {
	margin: 0 0 12px;
	font-size: 15px;
	line-height: 1.6;
}

.ksm-site .site-footer .wp-block-list,
.ksm-site .site-footer .widget ul {
	margin: 0;
	padding: 0;
	list-style: none;
}

.ksm-site .site-footer .wp-block-list li {
	margin: 0 0 10px;
	font-size: 15px;
}

.ksm-site .site-footer a {
	color: #fff;
	text-decoration: none;
}

.ksm-site .site-footer a:hover,
.ksm-site .site-footer a:focus-visible {
	color: var(--kosmos-copper);
}

/* Logotyp w stopce — wersja ciemna z księgi 3.2 (biały na granacie), bez descriptora. */
.ksm-site .site-footer .ksm-logo {
	margin-bottom: 18px;
}

.ksm-site .site-footer .ksm-logo__mark {
	padding-right: 0;
	border-right: 0;
}

.ksm-site .site-footer .ksm-logo__pre {
	font-size: 11px;
}

.ksm-site .site-footer .ksm-logo__name {
	font-size: 44px;
}

.ksm-site .site-footer .ksm-logo__desc {
	display: none;
}

/* Menu stopki: pionowa lista pod nagłówkiem z widżetu „Stopka 2” (ta sama kolumna). */
.ksm-site .site-footer .footer-navigation ul {
	margin: 0;
	padding: 0;
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	gap: 4px;
}

.ksm-site .site-footer .footer-navigation .menu > li {
	margin: 0;
	padding: 0;
}

.ksm-site .site-footer .footer-navigation .menu > li > a {
	font-size: 15px;
	color: #fff;
}

.ksm-site .site-footer .footer-navigation .menu > li > a:hover,
.ksm-site .site-footer .footer-navigation .menu > li.current-menu-item > a {
	color: var(--kosmos-copper);
}

.ksm-site .site-bottom-footer-inner-wrap {
	padding-top: 20px;
	padding-bottom: 24px;
	border-top: 1px solid rgba(255, 255, 255, 0.16);
}

.ksm-site .footer-html,
.ksm-site .footer-html-inner > p,
.ksm-site .ksm-footer-bottom {
	margin: 0;
	font-size: 14px;
	color: rgba(255, 255, 255, 0.72);
}

.ksm-site .footer-html-inner,
.ksm-site .footer-html-inner > p {
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
	gap: 8px 24px;
}

.ksm-site .footer-html a {
	color: var(--kosmos-copper);
}

/* Zgodność wstecz: dolny pasek z 0.1.0 (`[kosmos_footer_bottom]`). */
.ksm-site .ksm-footer-bottom {
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
	gap: 8px 24px;
}

.ksm-site .ksm-footer-bottom a {
	color: var(--kosmos-copper);
}

@media (prefers-reduced-motion: reduce) {
	.ksm-site *,
	.ksm-site *::before,
	.ksm-site *::after {
		transition-duration: 0.01ms !important;
		animation-duration: 0.01ms !important;
	}
}
