/* ==========================================================================
   Verde Casino PL — arkusz stylów
   ========================================================================== */

/* --- kroje pisma ---------------------------------------------------------- */
@font-face {
	font-family: "Montserrat";
	src: url("/fonts/mont-600.woff2") format("woff2");
	font-weight: 600;
	font-style: normal;
	font-display: swap;
}
@font-face {
	font-family: "Montserrat";
	src: url("/fonts/mont-700.woff2") format("woff2");
	font-weight: 700;
	font-style: normal;
	font-display: swap;
}
@font-face {
	font-family: "Inter";
	src: url("/fonts/inter-400.woff2") format("woff2");
	font-weight: 400;
	font-style: normal;
	font-display: swap;
}
@font-face {
	font-family: "Inter";
	src: url("/fonts/inter-500.woff2") format("woff2");
	font-weight: 500;
	font-style: normal;
	font-display: swap;
}
@font-face {
	font-family: "Inter";
	src: url("/fonts/inter-700.woff2") format("woff2");
	font-weight: 700;
	font-style: normal;
	font-display: swap;
}

/* --- tokeny --------------------------------------------------------------- */
:root {
	--tint-prime: #78c500;
	--tint-accent: #0a090f;
	--tint-action-down: #000000;
	--tint-back: #0f1010;
	--tint-card: #171919;
	--tint-type: #ffffff;
	--tint-faint: #c1c1c1;
	--tint-border: #262a29;
	--tint-rule-bold: #3a403e;
	--tint-fade-top: #3d3858;
	--tint-grad-2: #1c1929;
	--tint-caution: #a4161a;

	--space-2xs: 5px;
	--space-xs: 10px;
	--space-sm: 15px;
	--space-md: 25px;
	--space-lg: 40px;
	--space-xl: 60px;
	--space-2xl: 90px;
	--space-3xl: 140px;

	--round-stadium: 9999px;
	--round-circle: 50%;
	--round-2xs: 0;
	--round-xs: 0;
	--round-sm: 4px;
	--round-md: 6px;
	--round-lg: 10px;
	--round-xl: 14px;
	--round-2xl: 18px;
	--round-3xl: 24px;

	--family-banner: "Montserrat", "Segoe UI", Tahoma, sans-serif;
	--family-prose: "Inter", "Helvetica Neue", Arial, sans-serif;

	--fs-h1: 44px;
	--fs-xl-2: 34px;
	--fs-h3: 26px;
	--fs-display-4: 20px;
	--fs-sm-2: 16px;
	--fs-h6: 14px;
	--fs-reading: 16px;
	--fs-caption: 14px;
	--fs-tiny: 12px;

	--line-tight: 1.2;
	--line-regular: 1.55;
	--line-airy: 1.7;

	--font-weight-book: 400;
	--font-weight-medium: 500;
	--font-weight-bold: 700;

	--letter-narrow: -0.01em;
	--letter-base: 0;
	--letter-airy: 0.02em;

	--lift-2xs: none;
	--lift-xs: none;
	--lift-sm: none;
	--lift-md: 0 0 0 1px rgba(0, 0, 0, 0.06);
	--lift-lg: 0 0 0 2px rgba(0, 0, 0, 0.1), 0 8px 24px rgba(0, 0, 0, 0.1);
	--lift-xl: 0 0 0 2px rgba(0, 0, 0, 0.12), 0 14px 34px rgba(0, 0, 0, 0.14);
	--lift-2xl: 0 0 0 3px rgba(0, 0, 0, 0.14), 0 20px 46px rgba(0, 0, 0, 0.18);
	--lift-3xl: 0 0 0 3px rgba(0, 0, 0, 0.16), 0 28px 60px rgba(0, 0, 0, 0.22);

	--pace-short: 158ms;
	--pace-mid: 280ms;
	--pace-gentle: 568ms;

	--motion-curve-settle: cubic-bezier(0.13, 0.62, 0.4, 0.94);
	--motion-curve-take-off: cubic-bezier(0.6, 0.06, 0.87, 0.38);
	--motion-curve-both: cubic-bezier(0.61, 0.09, 0.28, 0.99);
	--motion-curve-elastic: cubic-bezier(0.4, 1.6, 0.52, 1.15);

	--shell-max: 1240px;
	--shell-prose: 490px;
	--shell-edge-wide: 48px;
	--shell-pad-md: 32px;
	--shell-padding-mobile: 16px;

	--border-hair: 1px;
	--border-medium: 4px;
	--border-strong: 6px;

	--header-size-desktop: 106px;
	--header-short: 92px;
	--rg-height: 32px;

	--shell-wide: calc(var(--shell-max) + 2 * var(--shell-edge-wide));
	--hair: rgba(255, 255, 255, 0.08);
}

/* --- skala mobilna -------------------------------------------------------- */
@media (max-width: 820px) {
	:root {
		--fs-h1: 30px;
		--fs-xl-2: 24px;
		--fs-h3: 20px;
		--fs-display-4: 18px;
		--fs-sm-2: 15px;
		--fs-h6: 13px;
		--fs-reading: 15px;
		--fs-caption: 13px;
		--fs-tiny: 11px;
		--shell-edge-wide: var(--shell-pad-md);
	}
}

@media (max-width: 520px) {
	:root {
		--fs-h1: 27px;
		--shell-edge-wide: var(--shell-padding-mobile);
	}
}

/* --- reset ---------------------------------------------------------------- */
*,
*::before,
*::after {
	box-sizing: border-box;
}

html,
body {
	overflow-x: clip;
}

html {
	background: var(--tint-back);
	-webkit-text-size-adjust: 100%;
	scroll-behavior: smooth;
}

body {
	margin: 0;
	margin-block-start: calc(var(--header-size-desktop) + var(--rg-height));
	background: var(--tint-back);
	color: var(--tint-type);
	font-family: var(--family-prose);
	font-size: var(--fs-reading);
	font-weight: var(--font-weight-book);
	line-height: var(--line-regular);
	letter-spacing: var(--letter-base);
}

img {
	max-width: 100%;
}

h1,
h2,
h3,
h4,
h5,
h6 {
	overflow-wrap: anywhere;
	margin: 0;
}

h1,
h2 {
	font-family: var(--family-banner);
	font-weight: var(--font-weight-bold);
	letter-spacing: var(--letter-narrow);
	line-height: var(--line-tight);
}

h1 {
	font-size: var(--fs-h1);
}

h2 {
	font-size: var(--fs-xl-2);
}

h3 {
	font-family: var(--family-prose);
	font-weight: var(--font-weight-bold);
	font-size: var(--fs-h3);
	letter-spacing: var(--letter-base);
	line-height: var(--line-tight);
}

h4 {
	font-family: var(--family-prose);
	font-weight: var(--font-weight-medium);
	font-size: var(--fs-display-4);
	line-height: var(--line-tight);
}

p {
	margin: 0;
}

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

figure {
	margin: 0;
}

a {
	color: var(--tint-prime);
}

button {
	font: inherit;
	cursor: pointer;
}

table {
	border-collapse: collapse;
}

/* --- dostępność ----------------------------------------------------------- */
.skip-hop {
	position: fixed;
	inset-inline-start: var(--space-sm);
	z-index: 300;
	padding: var(--space-xs) var(--space-md);
	background: var(--tint-prime);
	color: var(--tint-accent);
	font-weight: var(--font-weight-bold);
	text-decoration: none;
	border-radius: var(--round-sm);
}

.skip-hop:not(:focus) {
	top: -200px !important;
}

.skip-hop:focus {
	top: calc(var(--rg-height) + var(--space-xs));
}

.sr-only {
	position: absolute;
	width: 1px;
	height: 1px;
	padding: 0;
	margin: -1px;
	overflow: hidden;
	clip-path: inset(50%);
	white-space: nowrap;
	border: 0;
}

:focus-visible {
	outline: 3px solid var(--tint-prime);
	outline-offset: 2px;
}

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

/* --- pasek 18+ ------------------------------------------------------------ */
.aviso-band {
	position: fixed;
	inset-block-start: 0;
	inset-inline: 0;
	z-index: 140;
	display: flex;
	align-items: center;
	justify-content: center;
	gap: var(--space-2xs);
	min-height: 32px;
	padding: var(--space-2xs) var(--space-sm);
	background: var(--tint-caution);
	color: var(--tint-type);
	font-size: var(--fs-tiny);
	line-height: 1.35;
	text-align: center;
}

.aviso-hop {
	color: var(--tint-type);
	text-decoration: underline;
	text-underline-offset: 2px;
}

.aviso-hop:hover {
	color: var(--tint-type);
	text-decoration-thickness: 2px;
}

/* --- nagłówek strony: HEAD-UTIL ------------------------------------------- */
.vignette-bold {
	position: fixed;
	inset-block-start: var(--rg-height);
	inset-inline: 0;
	z-index: 120;
	background: var(--tint-accent);
	-webkit-backdrop-filter: blur(0px);
	backdrop-filter: blur(0px);
	transition: background var(--pace-mid) var(--motion-curve-settle),
		backdrop-filter var(--pace-mid) var(--motion-curve-settle);
}

.vignette-bold.is-lifted {
	background: rgba(10, 9, 15, 0.82);
	-webkit-backdrop-filter: blur(14px) saturate(1.2);
	backdrop-filter: blur(14px) saturate(1.2);
}

.vignette-bold-frame {
	width: 100%;
	max-width: var(--shell-wide);
	margin-inline: auto;
	padding-inline: var(--space-lg);
}

.vignette-bold-facts {
	background: #060509;
	border-block-end: var(--border-hair) solid var(--hair);
}

.vignette-bold-facts .vignette-bold-frame {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: var(--space-sm);
	min-height: 30px;
}

.vignette-bold-desk {
	color: var(--tint-faint);
	font-size: var(--fs-tiny);
	letter-spacing: var(--letter-airy);
}

.vignette-bold-facts .vignette-bold-series {
	display: flex;
	align-items: center;
	gap: var(--space-sm);
	list-style: none;
	overflow: visible;
}

.vignette-bold-facts .vignette-bold-hop {
	font-size: var(--fs-tiny);
	color: var(--tint-faint);
	padding: 0;
}

.vignette-bold-facts .vignette-bold-hop:hover {
	color: var(--tint-prime);
	background: transparent;
}

.vignette-bold-actions {
	display: flex;
	align-items: center;
	gap: var(--space-sm);
}

.vignette-bold-band {
	display: flex;
	align-items: center;
	gap: var(--space-md);
	min-height: 46px;
	padding-block: var(--space-xs);
}

.vignette-bold-tap {
	order: 1;
	display: none;
	align-items: center;
	justify-content: center;
	gap: 4px;
	width: 46px;
	height: 46px;
	padding: 0;
	background: transparent;
	border: 0;
	color: var(--tint-type);
}

.vignette-bold-tap span {
	display: block;
	width: 5px;
	height: 5px;
	border-radius: var(--round-circle);
	background: currentColor;
	transition: transform var(--pace-short) var(--motion-curve-settle);
}

.vignette-bold-tap[aria-expanded="true"] span {
	transform: scale(1.35);
}

.vignette-bold-sign {
	order: 2;
	flex-shrink: 0;
	display: inline-flex;
	align-items: center;
	line-height: 0;
}

.vignette-bold-sign img {
	flex-shrink: 0;
	display: block;
	height: 60px;
	width: auto;
}

.vignette-bold-nav {
	order: 3;
	flex: 1 1 auto;
	min-width: 0;
	display: flex;
	justify-content: flex-start;
}

.vignette-bold-series {
	display: flex;
	flex-wrap: nowrap;
	align-items: center;
	gap: var(--space-md);
	margin: 0;
	padding: 0;
	list-style: none;
	min-width: 0;
	overflow: hidden;
}

.vignette-bold-item {
	flex: 0 0 auto;
}

.vignette-bold-hop {
	display: inline-block;
	padding: var(--space-2xs) var(--space-xs);
	border-radius: var(--round-stadium);
	color: var(--tint-type);
	font-size: 16px;
	font-weight: 400;
	text-decoration: none;
	white-space: nowrap;
	transition: color var(--pace-short) var(--motion-curve-settle),
		background var(--pace-short) var(--motion-curve-settle);
}

.vignette-bold-hop:hover {
	color: var(--tint-prime);
	background: transparent;
}

.vignette-bold-hop[aria-current="page"] {
	background: var(--tint-prime);
	color: var(--tint-accent);
	font-weight: var(--font-weight-medium);
}

.vignette-bold-extra {
	position: relative;
	flex: 0 0 auto;
}

.vignette-bold-more {
	display: inline-flex;
	align-items: center;
	gap: var(--space-2xs);
	padding: var(--space-2xs) var(--space-xs);
	background: transparent;
	border: var(--border-hair) solid var(--tint-border);
	border-radius: var(--round-stadium);
	color: var(--tint-type);
	font-family: var(--family-prose);
	font-size: 16px;
	font-weight: 400;
	white-space: nowrap;
	transition: color var(--pace-short) var(--motion-curve-settle);
}

.vignette-bold-more:hover {
	color: var(--tint-prime);
}

.vignette-bold-pane {
	position: absolute;
	inset-block-start: calc(100% + var(--space-2xs));
	inset-inline-end: 0;
	z-index: 10;
	display: none;
	flex-direction: column;
	gap: var(--space-2xs);
	min-width: 220px;
	max-height: 62vh;
	overflow-y: auto;
	margin: 0;
	padding: var(--space-xs);
	list-style: none;
	background: var(--tint-card);
	border: var(--border-hair) solid var(--tint-border);
	border-radius: var(--round-md);
	box-shadow: var(--lift-lg);
}

.vignette-bold-pane.is-open {
	display: flex;
}

.vignette-bold-pane .vignette-bold-hop {
	display: block;
	white-space: normal;
}

.vignette-bold-flyout {
	position: absolute;
	inset-block-start: 100%;
	inset-inline: 0;
	z-index: 9;
	display: none;
	max-height: calc(100vh - var(--header-size-desktop) - var(--rg-height));
	overflow-y: auto;
	padding: var(--space-sm) var(--space-lg) var(--space-md);
	background: var(--tint-accent);
	border-block-start: var(--border-hair) solid var(--tint-border);
}

.vignette-bold-flyout.is-open {
	display: block;
}

.vignette-bold-flyout .vignette-bold-series {
	flex-direction: column;
	align-items: stretch;
	gap: var(--space-2xs);
	overflow: visible;
}

.vignette-bold-flyout .vignette-bold-hop {
	display: block;
	padding: var(--space-xs) var(--space-sm);
	white-space: normal;
}

@media (max-width: 900px) {
	.vignette-bold-tap {
		display: inline-flex;
	}

	.vignette-bold-nav {
		display: none;
	}

	.vignette-bold-band {
		justify-content: space-between;
	}

	.vignette-bold-sign {
		order: 1;
		margin-inline-end: auto;
	}

	.vignette-bold-tap {
		order: 2;
	}

	.vignette-bold-frame {
		padding-inline: var(--space-md);
	}
}

@media (max-width: 820px) {
	body {
		margin-block-start: calc(var(--header-short) + var(--rg-height));
	}

	.vignette-bold-sign img {
		height: 44px;
	}

	.vignette-bold-desk {
		display: none;
	}

	.vignette-bold-facts .vignette-bold-frame {
		justify-content: flex-end;
	}
}

@media (max-width: 520px) {
	.vignette-bold-frame {
		padding-inline: var(--space-sm);
	}

	.vignette-bold-sign img {
		height: 38px;
	}

	.vignette-bold-facts .vignette-bold-hop {
		font-size: 11px;
	}
}

/* --- wspólna siatka sekcji ------------------------------------------------ */
main {
	display: block;
}

.panel-classic-frame,
.carnet-zone-frame,
.encart-edge-frame,
.cloche-solid-frame,
.volume-zone-frame,
.relief-clean-frame,
.banner-opus-frame,
.pilier-flux-frame,
.crest-premium-frame,
.court-refined-frame,
.keystone-raw-frame,
.arch-crisp-frame,
.pupitre-core-frame,
.stele-plus-frame {
	width: 100%;
	max-width: var(--shell-wide);
	margin-inline: auto;
	padding-inline: var(--shell-edge-wide);
}

/* --- hero: HERO-07 -------------------------------------------------------- */
.panel-classic {
	background: linear-gradient(180deg, var(--tint-grad-2) 0%, var(--tint-back) 100%);
}

.panel-classic-figure {
	position: relative;
	display: block;
	width: 100%;
	height: 400px;
	overflow: hidden;
}

.panel-classic-figure::after {
	content: "";
	position: absolute;
	inset-inline: 0;
	inset-block-end: 0;
	height: 120px;
	background: linear-gradient(180deg, rgba(15, 16, 16, 0) 0%, var(--tint-back) 100%);
}

.panel-classic-img {
	display: block;
	width: 100%;
	height: 100%;
	object-fit: cover;
	object-position: center;
}

.panel-classic-fill {
	padding-block: var(--space-xl);
}

.panel-classic-fill h1 {
	max-width: 900px;
}

.panel-classic-under {
	max-width: var(--shell-prose);
	margin-block-start: var(--space-md);
	color: var(--tint-faint);
	font-size: var(--fs-sm-2);
	line-height: var(--line-airy);
}

.panel-classic-push {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-height: 52px;
	margin-block-start: var(--space-md);
	padding-inline: var(--space-lg);
	border: 0;
	border-radius: var(--round-md);
	background: var(--tint-prime);
	color: var(--tint-accent);
	font-family: var(--family-prose);
	font-weight: var(--font-weight-medium);
	font-size: var(--fs-sm-2);
	letter-spacing: var(--letter-airy);
	text-decoration: none;
	white-space: nowrap;
}

@media (max-width: 820px) {
	.panel-classic-figure {
		height: 220px;
	}
}

/* --- nagłówek podstrony: PHEAD-01 ----------------------------------------- */
.carnet-zone {
	background: var(--tint-back);
	border-block-end: var(--border-hair) solid rgba(255, 255, 255, 0.05);
}

.carnet-zone-frame {
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	gap: var(--space-md);
	padding-block: var(--space-xl) var(--space-lg);
}

.carnet-zone-eyebrow {
	color: var(--tint-prime);
	font-family: var(--family-prose);
	font-weight: var(--font-weight-medium);
	font-size: var(--fs-caption);
	letter-spacing: var(--letter-airy);
	text-transform: uppercase;
}

.carnet-zone-head {
	max-width: 920px;
	color: var(--tint-type);
}

.carnet-zone-divider {
	width: 60px;
	height: 2px;
	background: var(--tint-prime);
}

.carnet-zone-prose {
	color: var(--tint-faint);
	font-size: var(--fs-sm-2);
	line-height: var(--line-regular);
}

/* --- tekst: PROSE-14 ------------------------------------------------------ */
.encart-edge {
	padding-block: var(--space-lg);
}

.encart-edge-frame > article {
	display: block;
}

.encart-edge-head {
	margin-block-start: var(--space-md);
	margin-block-end: var(--space-sm);
	color: var(--tint-type);
}

.encart-edge-head:first-child {
	margin-block-start: 0;
}

.encart-edge p {
	margin-block: var(--space-sm);
	color: var(--tint-faint);
	line-height: var(--line-regular);
}

.encart-edge p strong {
	color: var(--tint-type);
	font-weight: var(--font-weight-bold);
}

.encart-edge-series {
	margin-block: var(--space-sm);
	padding-inline-start: var(--space-md);
	color: var(--tint-faint);
}

.encart-edge-series li {
	margin-block: var(--space-2xs);
	line-height: var(--line-regular);
}

.encart-edge-series li strong {
	color: var(--tint-type);
}

.encart-edge-hop {
	color: var(--tint-prime);
	text-decoration: none;
	background-image: linear-gradient(currentColor, currentColor);
	background-repeat: no-repeat;
	background-position: 0 100%;
	background-size: 0% 1px;
	transition: background-size var(--pace-mid) var(--motion-curve-settle);
}

.encart-edge-hop:hover {
	background-size: 100% 1px;
	color: var(--tint-prime);
}

/* PROSE-14 — co drugi rozdział dostaje ramkę (fill: none, boxWidth: full) */
.encart-edge-fill {
	padding-block: var(--space-sm);
}

.encart-edge-fill.is-banded {
	padding: var(--space-md);
	border: var(--border-hair) double var(--tint-rule-bold);
	border-inline-start: var(--border-strong) double var(--tint-prime);
	border-radius: var(--round-sm);
}

.encart-edge-figure {
	margin-block: var(--space-md);
}

.encart-edge-img {
	display: block;
	width: 100%;
	height: auto;
	margin-inline: auto;
	border: var(--border-hair) solid var(--tint-border);
	border-radius: var(--round-sm);
}

.encart-edge-figure.is-wide {
	max-width: 720px;
	margin-inline: auto;
}

.encart-edge-figure.is-square {
	max-width: 440px;
	margin-inline: auto;
}

.encart-edge-figure.is-tall {
	max-width: 320px;
	margin-inline: auto;
}

/* --- lista pozycji: GRID-12 ----------------------------------------------- */
.cloche-solid {
	padding-block: var(--space-lg);
}

.cloche-solid-heading {
	margin-block-end: var(--space-md);
}

.cloche-solid-series {
	display: block;
	list-style: none;
}

.cloche-solid-item {
	display: flex;
	align-items: flex-start;
	gap: var(--space-lg);
	padding: var(--space-lg);
	border-block-end: var(--border-hair) solid var(--hair);
	transition: background var(--pace-short) var(--motion-curve-settle);
}

.cloche-solid-slot,
.relief-clean-slot,
.volume-zone-slot {
	display: block;
	list-style: none;
}

.cloche-solid-item:hover {
	background: var(--tint-card);
	box-shadow: inset var(--border-strong) 0 0 0 var(--tint-prime);
}

.cloche-solid-badge {
	flex: 0 0 auto;
	display: flex;
	align-items: center;
	justify-content: center;
	width: 120px;
	aspect-ratio: 1 / 1;
	padding: var(--space-2xs);
	border-radius: var(--round-md);
	background: var(--tint-prime);
	color: var(--tint-accent);
	font-family: var(--family-banner);
	font-weight: var(--font-weight-bold);
	font-size: var(--fs-h1);
	line-height: 1;
}

.cloche-solid-fill {
	min-width: 0;
}

.cloche-solid-head {
	font-size: var(--fs-display-4);
	font-weight: var(--font-weight-bold);
	color: var(--tint-type);
}

.cloche-solid-prose {
	margin-block-start: var(--space-xs);
	color: var(--tint-faint);
	font-size: var(--fs-reading);
	line-height: var(--line-regular);
}

@media (max-width: 820px) {
	.cloche-solid-item {
		flex-direction: column;
		align-items: flex-start;
		padding: var(--space-md);
	}

	.cloche-solid-badge {
		width: 80px;
	}
}

/* --- pytania: FAQ-07 ------------------------------------------------------ */
.volume-zone {
	padding-block: var(--space-lg);
}

.volume-zone-heading {
	margin-block-end: var(--space-md);
}

.volume-zone-series {
	display: flex;
	flex-direction: column;
	gap: var(--space-sm);
	list-style: none;
}

.volume-zone-item {
	border-block-end: var(--border-hair) solid rgba(255, 255, 255, 0.05);
}

.volume-zone-item > summary {
	display: grid;
	grid-template-columns: 1fr auto;
	align-items: start;
	gap: var(--space-sm);
	padding-block: var(--space-xs);
	cursor: pointer;
	list-style: none;
}

.volume-zone-item > summary::-webkit-details-marker {
	display: none;
}

.volume-zone-head {
	font-family: var(--family-prose);
	font-size: var(--fs-caption);
	font-weight: var(--font-weight-medium);
	line-height: var(--line-regular);
	color: var(--tint-type);
}

.volume-zone-mark {
	position: relative;
	width: 18px;
	height: 18px;
	margin-block-start: 3px;
	flex: 0 0 auto;
}

.volume-zone-mark::before,
.volume-zone-mark::after {
	content: "";
	position: absolute;
	inset-block-start: 8px;
	inset-inline-start: 2px;
	width: 14px;
	height: 2px;
	background: var(--tint-prime);
}

.volume-zone-mark::after {
	transform: rotate(90deg);
}

.volume-zone-item[open] .volume-zone-mark::after {
	display: none;
}

.volume-zone-fill {
	padding-block: var(--space-xs);
	color: var(--tint-faint);
	font-size: var(--fs-caption);
	line-height: var(--line-regular);
}

/* --- opinie: REV-02 ------------------------------------------------------- */
.relief-clean {
	padding-block: var(--space-lg);
}

.relief-clean-heading {
	margin-block-end: var(--space-md);
}

.relief-clean-series {
	list-style: none;
}

.relief-clean-item {
	position: relative;
	padding-block: var(--space-md);
	padding-inline-start: var(--space-lg);
	border-block-end: var(--border-hair) solid var(--hair);
}

.relief-clean-item:last-child {
	border-block-end: 0;
}

.relief-clean-item::before {
	content: "\201C";
	position: absolute;
	inset-block-start: 6px;
	inset-inline-start: 0;
	font-family: var(--family-banner);
	font-size: var(--fs-h1);
	line-height: 1;
	color: var(--tint-prime);
}

.relief-clean-quote {
	margin: 0;
}

.relief-clean-quote p {
	margin: 0;
	max-width: 900px;
	font-family: var(--family-banner);
	font-size: var(--fs-display-4);
	font-style: italic;
	font-weight: var(--font-weight-medium);
	line-height: var(--line-tight);
	color: var(--tint-type);
}

.relief-clean-facts {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: var(--space-xs);
	margin-block-start: var(--space-sm);
	color: var(--tint-faint);
	font-size: var(--fs-caption);
}

.relief-clean-facts > * + *::before {
	content: "\00B7";
	margin-inline-end: var(--space-xs);
	color: var(--tint-rule-bold);
}

.relief-clean-name {
	font-style: normal;
	font-weight: var(--font-weight-medium);
	color: var(--tint-type);
}

.relief-clean-rating {
	color: var(--tint-prime);
}

.relief-clean-stamp {
	color: var(--tint-faint);
}

/* --- tabela: TABLE-07 ----------------------------------------------------- */
.pilier-flux {
	padding-block: var(--space-lg);
}

.pilier-flux-heading {
	margin-block-end: var(--space-sm);
}

.pilier-flux-note {
	margin-block-end: var(--space-md);
	color: var(--tint-faint);
	font-size: var(--fs-caption);
}

.pilier-flux-fill {
	overflow-x: auto;
	border: var(--border-hair) solid var(--tint-border);
	border-radius: var(--round-sm);
}

.pilier-flux-tab {
	width: 100%;
	min-width: 560px;
	font-size: var(--fs-caption);
}

.pilier-flux-tab th {
	padding: var(--space-sm) var(--space-md);
	background: var(--tint-prime);
	color: var(--tint-accent);
	font-weight: var(--font-weight-bold);
	text-align: start;
	white-space: nowrap;
}

.pilier-flux-tab td {
	padding: var(--space-sm) var(--space-md);
	color: var(--tint-faint);
	border-block-start: var(--border-hair) solid var(--tint-border);
	vertical-align: top;
}

.pilier-flux-tab td:nth-child(even) {
	background: rgba(255, 255, 255, 0.03);
}

.pilier-flux-tab td:first-child {
	color: var(--tint-type);
	font-weight: var(--font-weight-medium);
}

@media (max-width: 520px) {
	.pilier-flux-tab {
		min-width: 460px;
	}

	.pilier-flux-tab th,
	.pilier-flux-tab td {
		padding: var(--space-xs) var(--space-sm);
	}
}

/* --- blok zachęty: CTA-01 ------------------------------------------------- */
.banner-opus {
	background: var(--tint-prime);
	padding-block: var(--space-xl);
}

.banner-opus-frame {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: var(--space-lg);
}

.banner-opus-fill {
	min-width: 0;
}

.banner-opus-head {
	max-width: var(--shell-prose);
	color: var(--tint-accent);
	font-size: var(--fs-xl-2);
	letter-spacing: var(--letter-narrow);
	text-transform: uppercase;
}

.banner-opus-prose {
	max-width: 580px;
	margin-block-start: var(--space-sm);
	color: rgba(10, 9, 15, 0.85);
	font-size: var(--fs-reading);
	line-height: var(--line-regular);
}

.banner-opus-btn {
	flex-shrink: 0;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-width: 220px;
	min-height: 56px;
	padding-inline: var(--space-lg);
	border-radius: var(--round-md);
	background: var(--tint-accent);
	color: var(--tint-prime);
	font-family: var(--family-prose);
	font-weight: var(--font-weight-bold);
	font-size: var(--fs-sm-2);
	letter-spacing: var(--letter-airy);
	text-align: center;
	text-decoration: none;
}

.banner-opus-facts {
	margin-block-start: var(--space-sm);
	color: rgba(10, 9, 15, 0.85);
	font-size: var(--fs-tiny);
}

@media (max-width: 820px) {
	.banner-opus-frame {
		flex-direction: column;
		align-items: stretch;
	}

	.banner-opus-btn {
		width: 100%;
	}
}

/* --- wstawka ofertowa: INLINE-CTA-01 -------------------------------------- */
.pupitre-core {
	display: block;
	margin-block: var(--space-md);
	padding-block: var(--space-md);
	background: var(--tint-prime);
	border-radius: var(--round-sm);
}

.pupitre-core-frame {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: var(--space-md);
	padding-inline: var(--space-md);
	max-width: var(--shell-wide);
}

.pupitre-core-prose {
	margin: 0;
	color: var(--tint-accent);
	font-family: var(--family-prose);
	font-size: var(--fs-sm-2);
	font-weight: var(--font-weight-bold);
	line-height: var(--line-tight);
}

.pupitre-core-btn {
	flex-shrink: 0;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-height: 48px;
	padding: var(--space-xs) var(--space-lg);
	border-radius: var(--round-md);
	background: var(--tint-accent);
	color: var(--tint-prime);
	font-weight: var(--font-weight-bold);
	font-size: var(--fs-caption);
	letter-spacing: var(--letter-airy);
	text-decoration: none;
	white-space: nowrap;
}

@media (max-width: 820px) {
	.pupitre-core-frame {
		flex-direction: column;
		align-items: stretch;
		text-align: center;
	}

	.pupitre-core-btn {
		width: 100%;
	}
}

/* --- podpis autorki: BYLINE-02 -------------------------------------------- */
.coffre-warm {
	display: block;
	padding-block: var(--space-lg);
}

.coffre-warm-tile {
	display: flex;
	align-items: flex-start;
	gap: var(--space-md);
	max-width: var(--shell-prose);
	margin-inline: auto;
	padding: var(--space-lg);
	background: var(--tint-card);
	border: var(--border-hair) solid var(--hair);
	border-radius: var(--round-md);
}

.coffre-warm-pic {
	flex: 0 0 auto;
	display: block;
	width: 64px;
	height: 64px;
	border-radius: var(--round-circle);
	overflow: hidden;
}

.coffre-warm-pic img {
	display: block;
	width: 64px;
	height: 64px;
	object-fit: cover;
	object-position: center top;
}

.coffre-warm-fill {
	min-width: 0;
}

.coffre-warm-note {
	display: block;
	color: var(--tint-faint);
	font-size: var(--fs-tiny);
	letter-spacing: var(--letter-airy);
	text-transform: uppercase;
}

.coffre-warm-name {
	margin-block-start: var(--space-2xs);
	font-family: var(--family-banner);
	font-size: var(--fs-display-4);
	font-weight: var(--font-weight-bold);
}

.coffre-warm-name a {
	color: var(--tint-type);
	text-decoration: none;
}

.coffre-warm-name a:hover {
	color: var(--tint-prime);
	text-decoration: underline;
}

.coffre-warm-credit {
	margin-block-start: var(--space-2xs);
	color: var(--tint-faint);
	font-size: var(--fs-caption);
}

.coffre-warm-prose {
	margin-block-start: var(--space-xs);
	color: var(--tint-faint);
	font-size: var(--fs-reading);
	line-height: var(--line-regular);
}

.coffre-warm-hop {
	display: inline-block;
	margin-block-start: var(--space-xs);
	color: var(--tint-prime);
	font-size: var(--fs-caption);
	letter-spacing: var(--letter-airy);
	text-transform: uppercase;
	text-decoration: none;
}

.coffre-warm-hop:hover {
	color: var(--tint-prime);
	text-decoration: underline;
}

@media (max-width: 520px) {
	.coffre-warm-tile {
		flex-direction: column;
		align-items: flex-start;
	}
}

/* --- karta autorki: AUTH-07 ----------------------------------------------- */
.keystone-raw {
	padding-block: var(--space-lg);
}

.keystone-raw-tile {
	display: grid;
	grid-template-columns: 100px 1fr;
	gap: var(--space-lg);
	padding: var(--space-lg);
	background: var(--tint-card);
	border-inline-start: var(--border-medium) solid var(--tint-prime);
	border-radius: var(--round-md);
}

.keystone-raw-pic {
	display: block;
	width: 100px;
	height: 100px;
	border-radius: var(--round-circle);
	overflow: hidden;
}

.keystone-raw-pic img {
	display: block;
	width: 100px;
	height: 100px;
	object-fit: cover;
	object-position: center top;
}

.keystone-raw-fill {
	min-width: 0;
}

.keystone-raw-quote {
	display: block;
	font-family: var(--family-banner);
	font-size: var(--fs-h1);
	line-height: 0.7;
	color: var(--tint-prime);
}

.keystone-raw-prose {
	margin-block-start: var(--space-sm);
	color: var(--tint-type);
	font-size: var(--fs-sm-2);
	font-style: italic;
	line-height: var(--line-regular);
}

.keystone-raw-credit {
	margin-block-start: var(--space-md);
	color: var(--tint-faint);
	font-size: var(--fs-caption);
	letter-spacing: var(--letter-airy);
}

.keystone-raw-heading {
	margin-block-start: var(--space-lg);
	margin-block-end: var(--space-sm);
	font-size: var(--fs-display-4);
}

.keystone-raw-series {
	display: flex;
	flex-direction: column;
	gap: var(--space-2xs);
	list-style: none;
}

.keystone-raw-hop {
	display: inline-block;
	padding-block: var(--space-2xs);
	color: var(--tint-prime);
	text-decoration: none;
	background-image: linear-gradient(currentColor, currentColor);
	background-repeat: no-repeat;
	background-position: 0 100%;
	background-size: 0% 1px;
	transition: background-size var(--pace-mid) var(--motion-curve-settle);
}

.keystone-raw-hop:hover {
	background-size: 100% 1px;
	color: var(--tint-prime);
}

@media (max-width: 520px) {
	.keystone-raw-tile {
		grid-template-columns: 1fr;
	}
}

/* --- strony prawne: LEGAL-06 ---------------------------------------------- */
.crest-premium {
	padding-block: var(--space-xl);
	background: var(--tint-back);
	counter-reset: paragraf;
}

.crest-premium-prose {
	color: var(--tint-faint);
	font-size: var(--fs-reading);
	line-height: var(--line-regular);
}

.crest-premium-item {
	margin-block-start: var(--space-md);
	counter-increment: paragraf;
}

.crest-premium-head {
	font-size: var(--fs-display-4);
	font-weight: var(--font-weight-bold);
}

.crest-premium-head::before {
	content: "\00A7 " counter(paragraf) ". ";
	color: var(--tint-prime);
}

.crest-premium-item p {
	margin-block-start: var(--space-xs);
	color: var(--tint-faint);
	font-size: var(--fs-caption);
	line-height: var(--line-regular);
}

.crest-premium-heading {
	margin-block-start: var(--space-md);
	font-size: var(--fs-display-4);
}

.crest-premium-series {
	margin-block-start: var(--space-xs);
	padding-inline-start: var(--space-md);
	color: var(--tint-faint);
	font-size: var(--fs-caption);
}

.crest-premium-series li {
	margin-block: var(--space-2xs);
}

.crest-premium-blurb {
	margin-block-start: var(--space-md);
	padding: var(--space-md);
	background: var(--tint-card);
	border: var(--border-hair) solid var(--tint-border);
	border-radius: var(--round-sm);
	color: var(--tint-faint);
	font-size: var(--fs-caption);
	line-height: var(--line-regular);
}

.crest-premium-hop {
	color: var(--tint-prime);
}

/* --- formularz: FORM-03 --------------------------------------------------- */
.court-refined {
	padding-block: var(--space-xl);
}

.court-refined-prose {
	max-width: 540px;
	margin-inline: auto;
	color: var(--tint-faint);
	font-size: var(--fs-reading);
	line-height: var(--line-regular);
	text-align: center;
}

.court-refined-form {
	max-width: 540px;
	margin-inline: auto;
	margin-block-start: var(--space-md);
}

.court-refined-cell {
	display: block;
	margin-block-start: var(--space-sm);
}

.court-refined-note {
	display: block;
	margin-block-end: var(--space-2xs);
	color: var(--tint-faint);
	font-size: var(--fs-caption);
}

.court-refined-cell input,
.court-refined-cell textarea {
	display: block;
	width: 100%;
	padding: var(--space-xs) var(--space-sm);
	background: var(--tint-card);
	border: var(--border-hair) solid var(--tint-border);
	border-radius: var(--round-sm);
	color: var(--tint-type);
	font-family: var(--family-prose);
	font-size: var(--fs-reading);
}

.court-refined-cell textarea {
	min-height: 140px;
	resize: vertical;
}

.court-refined-btn {
	width: 100%;
	min-height: 52px;
	margin-block-start: var(--space-md);
	padding-inline: var(--space-md);
	background: var(--tint-prime);
	border: 0;
	border-radius: var(--round-md);
	color: var(--tint-accent);
	font-family: var(--family-prose);
	font-weight: var(--font-weight-bold);
	font-size: var(--fs-sm-2);
	letter-spacing: var(--letter-airy);
}

.court-refined-blurb {
	max-width: 540px;
	margin-inline: auto;
	margin-block-start: var(--space-md);
	padding: var(--space-md);
	background: var(--tint-card);
	border: var(--border-hair) solid var(--tint-prime);
	border-radius: var(--round-sm);
	color: var(--tint-type);
	font-size: var(--fs-caption);
	text-align: center;
}

.court-refined-blurb[hidden] {
	display: none;
}

/* --- 404: ERR-03 ---------------------------------------------------------- */
.arch-crisp {
	padding-block: var(--space-xl);
}

.arch-crisp-fill {
	max-width: 600px;
	margin-inline: auto;
	text-align: center;
}

.arch-crisp-head {
	font-family: var(--family-banner);
	font-size: var(--fs-xl-2);
	font-weight: var(--font-weight-bold);
	line-height: var(--line-tight);
}

.arch-crisp-prose {
	margin-block-start: var(--space-md);
	color: var(--tint-faint);
	font-size: var(--fs-reading);
	line-height: var(--line-airy);
}

.arch-crisp-btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-height: 44px;
	margin-block-start: var(--space-md);
	padding-inline: var(--space-md);
	background: var(--tint-prime);
	border-radius: var(--round-md);
	color: var(--tint-accent);
	font-weight: var(--font-weight-medium);
	text-decoration: none;
}

/* --- ikony ---------------------------------------------------------------- */
.mark-glyph {
	flex: 0 0 auto;
	display: block;
	width: 22px;
	height: 22px;
	fill: currentColor;
}

/* --- stopka: FOOT-10 ------------------------------------------------------ */
.stele-plus {
	background: var(--tint-accent);
	padding-block: var(--space-lg);
	color: var(--tint-faint);
}

.stele-plus-band {
	padding-block: var(--space-md);
	border-block-end: var(--border-hair) solid var(--hair);
}

.stele-plus-band:last-child {
	border-block-end: 0;
}

.stele-plus-brand {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: space-between;
	gap: var(--space-md);
}

.stele-plus-sign {
	display: inline-flex;
	align-items: center;
	line-height: 0;
}

.stele-plus-sign img {
	display: block;
	height: 52px;
	width: auto;
}

.stele-plus-blurb {
	max-width: 580px;
	color: var(--tint-faint);
	font-size: var(--fs-caption);
	line-height: var(--line-regular);
}

.stele-plus-trust {
	display: flex;
	flex-wrap: wrap;
	gap: var(--space-md);
	width: 100%;
	margin-block-start: var(--space-sm);
	list-style: none;
}

.stele-plus-item {
	display: flex;
	align-items: center;
	gap: var(--space-2xs);
	color: var(--tint-faint);
	font-size: var(--fs-tiny);
}

.stele-plus-item svg {
	color: var(--tint-prime);
}

.stele-plus-grid {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: var(--space-md);
}

.stele-plus-heading {
	margin-block-end: var(--space-xs);
	color: var(--tint-type);
	font-size: var(--fs-h6);
	font-weight: var(--font-weight-bold);
	letter-spacing: var(--letter-airy);
	text-transform: uppercase;
}

.stele-plus-series {
	display: flex;
	flex-direction: column;
	gap: var(--space-2xs);
	list-style: none;
}

.stele-plus-hop {
	color: var(--tint-faint);
	font-size: var(--fs-caption);
	text-decoration: none;
}

.stele-plus-hop:hover {
	color: var(--tint-prime);
	text-decoration: underline;
}

.stele-plus-prose {
	color: var(--tint-faint);
	font-size: var(--fs-tiny);
	line-height: var(--line-regular);
}

.stele-plus-facts {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: space-between;
	gap: var(--space-sm);
	color: var(--tint-faint);
	font-size: var(--fs-tiny);
}

@media (max-width: 820px) {
	.stele-plus-grid {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}
}

@media (max-width: 520px) {
	.stele-plus-grid {
		grid-template-columns: minmax(0, 1fr);
	}
}

/* --- ciasteczka: COOK-07 -------------------------------------------------- */
.chevron-signal {
	position: fixed;
	inset-block-end: var(--space-md);
	inset-inline-end: var(--space-md);
	z-index: 90;
	width: 320px;
	max-width: calc(100vw - 2 * var(--space-md));
	padding: var(--space-md);
	background: var(--tint-card);
	border-inline-start: var(--border-medium) solid var(--tint-prime);
	border-radius: var(--round-sm);
	box-shadow: var(--lift-lg);
	transition: opacity var(--pace-mid) var(--motion-curve-settle),
		clip-path var(--pace-gentle) var(--motion-curve-settle);
	clip-path: inset(0 0 0 0);
}

.chevron-signal.is-hidden {
	display: none;
	opacity: 0;
	visibility: hidden;
	pointer-events: none;
	clip-path: inset(0 0 0 100%);
}

.chevron-signal-fill {
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	gap: var(--space-xs);
}

.chevron-signal-blurb {
	color: var(--tint-faint);
	font-size: var(--fs-tiny);
	line-height: 1.4;
}

.chevron-signal-confirm {
	min-width: 84px;
	min-height: 36px;
	padding: var(--space-2xs) var(--space-sm);
	background: var(--tint-prime);
	border: 0;
	border-radius: var(--round-sm);
	color: var(--tint-accent);
	font-family: var(--family-prose);
	font-weight: var(--font-weight-bold);
	font-size: var(--fs-tiny);
}

@media (max-width: 700px) {
	.chevron-signal {
		inset-inline: var(--space-sm);
		width: auto;
		max-width: none;
		padding: 12px 14px;
	}

	.chevron-signal-blurb {
		font-size: 12px;
		line-height: 1.35;
	}

	.chevron-signal-confirm {
		width: 100%;
		min-height: 40px;
		font-size: 12px;
	}
}

/* --- efekty ruchu --------------------------------------------------------- */
.panel-classic-push,
.banner-opus-btn,
.pupitre-core-btn,
.court-refined-btn,
.arch-crisp-btn,
.chevron-signal-confirm {
	background-image: linear-gradient(
		100deg,
		rgba(255, 255, 255, 0) 30%,
		rgba(255, 255, 255, 0.22) 50%,
		rgba(255, 255, 255, 0) 70%
	);
	background-repeat: no-repeat;
	background-size: 220% 100%;
	background-position: 130% 0;
	transition: background-position var(--pace-gentle) var(--motion-curve-both),
		color var(--pace-short) var(--motion-curve-settle);
}

.panel-classic-push:hover,
.banner-opus-btn:hover,
.pupitre-core-btn:hover,
.court-refined-btn:hover,
.arch-crisp-btn:hover,
.chevron-signal-confirm:hover {
	background-position: -30% 0;
}

.panel-classic-push:hover,
.pupitre-core-btn:hover {
	background-color: var(--tint-accent);
	color: var(--tint-prime);
}

.banner-opus-btn:hover {
	background-color: var(--tint-action-down);
	color: var(--tint-prime);
}

.arch-crisp-btn:hover,
.court-refined-btn:hover,
.chevron-signal-confirm:hover {
	background-color: var(--tint-prime);
	color: var(--tint-accent);
}
.vignette-jump{display:inline-flex;align-items:center;justify-content:center;padding:var(--space-xs) var(--space-lg);min-height:48px;border-radius:var(--round-md);font-size:var(--fs-caption);font-weight:var(--font-weight-bold);letter-spacing:var(--letter-airy)}
.vignette-jump{
  background:#0D9488;color:#000000;text-decoration:none;font-family:var(--font-weight-book);
  transition:background 0.22s ease-in-out,border-color 0.22s ease-in-out;}
.vignette-jump.vignette-jump{color:#000000;text-decoration:none;font-family:var(--font-weight-book);}
.vignette-jump:hover{background:#0F766E;color:#FFFFFF;animation:none}
.vignette-jump.vignette-jump:hover{color:#FFFFFF;text-decoration:none}
.vignette-jump:hover::after{animation:none}
.vignette-jump:active{background:#115E59;color:#FFFFFF}
.vignette-jump:focus-visible{outline:3px solid #000000;outline-offset:3px}
.vignette-jump{animation:vignette-ripple 1.43s ease-in-out infinite}
@keyframes vignette-ripple{0%{transform:translate(0,0)}18.182%{transform:translate(4px,4px)}40.559%,100%{transform:translate(0,0)}}
@media (prefers-reduced-motion:reduce){.vignette-jump,.vignette-jump::after{animation:none!important;transition:none!important}}
.vignette-bar{display:flex;flex-direction:column;align-items:flex-start;gap:14px;padding:var(--space-lg);background:var(--tint-card);border-radius:var(--round-md);border:var(--border-hair) solid var(--hair);margin:var(--space-lg,24px) 0}
.vignette-line.vignette-line{margin:0;border:0;padding:0;font-weight:600;font-size:0.9em}
.vignette-disc.vignette-disc{margin:0;border:0;padding:0;font-size:0.9em;opacity:.75}

@media (max-width: 938px) {
  .vignette-bold-nav { display: none !important; }
  .vignette-bold-tap { display: flex !important; }
}
