/* ==========================================================================
   Bonusovka — prodejni stranka (sablona page-bonusovka-landing)
   BEM, prefix `bonusovka-landing`. Nacita se jen na teto sablone.
   Hlavicka je stejna jako v clenske sekci (parts/header-bonusovka.html),
   tady ve svetle variante pres promenne --bonusovka-*.
   Ikony: Lucide (lucide.dev, ISC).
   ========================================================================== */

body.page-template-page-bonusovka-landing {
	--bl-bg: #FBF6EE;
	--bl-bg-alt: #F4EBDD;
	--bl-surface: #FFFDF9;
	--bl-line: #E6D7BF;
	--bl-wine: #8C1D40;
	--bl-navy: #1E2A3B;
	--bl-muted: #4A5262;
	--bl-gold: #C9A05A;
	--bl-gold-light: #E3C383;
	--bl-gold-text: #B8873A;
	--bl-heading-font: 'Spectral', Georgia, serif;
	--bl-script-font: 'Caveat', 'Segoe Script', cursive;
	--bl-text-font: var(--wp--preset--font-family--source-sans-3, 'Source Sans 3', sans-serif);
	--bl-container: 1200px;
	--bl-gutter: 24px;

	/* Svetla varianta hlavicky Bonusovky (pravidla jsou ve style.css). */
	--bonusovka-bg: #FBF6EE;
	--bonusovka-text: #1E2A3B;
	--bonusovka-text-muted: rgba(30, 42, 59, 0.7);
	--bonusovka-gold: #C9A05A;
	--bonusovka-line: #E6D7BF;
	--bonusovka-icon-sparkle: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M11.017 2.814a1 1 0 0 1 1.966 0l1.051 5.558a2 2 0 0 0 1.594 1.594l5.558 1.051a1 1 0 0 1 0 1.966l-5.558 1.051a2 2 0 0 0-1.594 1.594l-1.051 5.558a1 1 0 0 1-1.966 0l-1.051-5.558a2 2 0 0 0-1.594-1.594l-5.558-1.051a1 1 0 0 1 0-1.966l5.558-1.051a2 2 0 0 0 1.594-1.594z'/%3E%3C/svg%3E");
	--bonusovka-icon-user: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M19 21v-2a4 4 0 0 0-4-4H9a4 4 0 0 0-4 4v2'/%3E%3Ccircle cx='12' cy='7' r='4'/%3E%3C/svg%3E");

	--bl-icon-heart: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M2 9.5a5.5 5.5 0 0 1 9.591-3.676.56.56 0 0 0 .818 0A5.49 5.49 0 0 1 22 9.5c0 2.29-1.5 4-3 5.5l-5.492 5.313a2 2 0 0 1-3 .019L5 15c-1.5-1.5-3-3.2-3-5.5'/%3E%3C/svg%3E");
	--bl-icon-message-circle: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M2.992 16.342a2 2 0 0 1 .094 1.167l-1.065 3.29a1 1 0 0 0 1.236 1.168l3.413-.998a2 2 0 0 1 1.099.092 10 10 0 1 0-4.777-4.719'/%3E%3C/svg%3E");
	--bl-icon-star: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M11.525 2.295a.53.53 0 0 1 .95 0l2.31 4.679a2.123 2.123 0 0 0 1.595 1.16l5.166.756a.53.53 0 0 1 .294.904l-3.736 3.638a2.123 2.123 0 0 0-.611 1.878l.882 5.14a.53.53 0 0 1-.771.56l-4.618-2.428a2.122 2.122 0 0 0-1.973 0L6.396 21.01a.53.53 0 0 1-.77-.56l.881-5.139a2.122 2.122 0 0 0-.611-1.879L2.16 9.795a.53.53 0 0 1 .294-.906l5.165-.755a2.122 2.122 0 0 0 1.597-1.16z'/%3E%3C/svg%3E");
	--bl-icon-leaf: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M11 20a10 10 0 0010-10 25.9 25.9 0 00-1.04-7.281 1 1 0 00-1.755-.325C15.833 5.5 13 5.5 9.8 6.1A7 7 0 0011 20'/%3E%3Cpath d='M2 21a5 5 0 012.911-4.544C7.613 15.212 8.351 15.24 11 13'/%3E%3C/svg%3E");
	--bl-icon-sun: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='4'/%3E%3Cpath d='M12 2v2'/%3E%3Cpath d='M12 20v2'/%3E%3Cpath d='m4.93 4.93 1.41 1.41'/%3E%3Cpath d='m17.66 17.66 1.41 1.41'/%3E%3Cpath d='M2 12h2'/%3E%3Cpath d='M20 12h2'/%3E%3Cpath d='m6.34 17.66-1.41 1.41'/%3E%3Cpath d='m19.07 4.93-1.41 1.41'/%3E%3C/svg%3E");
	--bl-icon-message-square: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M22 17a2 2 0 0 1-2 2H6.828a2 2 0 0 0-1.414.586l-2.202 2.202A.71.71 0 0 1 2 21.286V5a2 2 0 0 1 2-2h16a2 2 0 0 1 2 2z'/%3E%3C/svg%3E");
	--bl-icon-users: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M16 21v-2a4 4 0 0 0-4-4H6a4 4 0 0 0-4 4v2'/%3E%3Cpath d='M16 3.128a4 4 0 0 1 0 7.744'/%3E%3Cpath d='M22 21v-2a4 4 0 0 0-3-3.87'/%3E%3Ccircle cx='9' cy='7' r='4'/%3E%3C/svg%3E");
	--bl-icon-check: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20 6 9 17l-5-5'/%3E%3C/svg%3E");
	--bl-icon-x: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M18 6 6 18'/%3E%3Cpath d='m6 6 12 12'/%3E%3C/svg%3E");
	--bl-icon-arrow-right: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12h14'/%3E%3Cpath d='m12 5 7 7-7 7'/%3E%3C/svg%3E");
	--bl-icon-plus: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12h14'/%3E%3Cpath d='M12 5v14'/%3E%3C/svg%3E");

	background-color: var(--bl-bg);
}

/* Kazda sekce je pres celou sirku, obsah drzi kontejner pres padding. */
.bonusovka-landing > .wp-block-post-content > .alignfull,
.bonusovka-landing .bonusovka-landing__section {
	box-sizing: border-box;
	margin: 0;
	padding-inline: max(var(--bl-gutter), (100% - var(--bl-container)) / 2);
}

/* ── Typografie (prebiji globalni `p { color:#666; font-size:14px }`) ─ */

.bonusovka-landing {
	color: var(--bl-navy);
	font-family: var(--bl-text-font);
}

.bonusovka-landing p,
.bonusovka-landing li {
	margin: 0 0 14px;
	padding: 0;
	color: var(--bl-muted);
	font-size: 17px;
	font-weight: 400;
	line-height: 1.6;
}

.bonusovka-landing :is(h1, h2, h3) {
	margin: 0 0 16px;
	font-family: var(--bl-heading-font);
	font-weight: 600;
	line-height: 1.15;
	letter-spacing: 0;
	text-transform: none;
	color: var(--bl-wine);
}

.bonusovka-landing h2 {
	font-size: clamp(30px, 3.4vw, 44px);
}

.bonusovka-landing .bonusovka-landing__strong {
	margin-bottom: 6px;
	font-family: var(--bl-heading-font);
	font-size: 20px;
	font-weight: 600;
	line-height: 1.35;
	color: var(--bl-navy);
}

.bonusovka-landing .bonusovka-landing__gold {
	font-family: var(--bl-heading-font);
	font-size: 20px;
	font-weight: 500;
	line-height: 1.35;
	color: var(--bl-gold-text);
}

.bonusovka-landing .bonusovka-landing__script {
	margin-top: 22px;
	font-family: var(--bl-script-font);
	font-size: 30px;
	line-height: 1.25;
	color: var(--bl-navy);
}

/* ── Tlacitka ──────────────────────────────────────────────────────── */

.bonusovka-landing .wp-block-buttons {
	margin: 0;
}

.bonusovka-landing .wp-block-button__link {
	display: inline-flex;
	align-items: center;
	gap: 12px;
	padding: 16px 34px;
	border: 0;
	border-radius: 999px;
	background: var(--bl-gold);
	box-shadow: none;
	color: #ffffff !important;
	font-family: var(--bl-text-font);
	font-size: 15px;
	font-weight: 700;
	letter-spacing: 0.06em;
	line-height: 1;
	text-decoration: none;
	text-transform: uppercase;
	transition: filter 0.15s ease, transform 0.15s ease;
}

.bonusovka-landing .wp-block-button__link::after {
	content: "";
	width: 18px;
	height: 18px;
	background-color: currentColor;
	-webkit-mask: var(--bl-icon-arrow-right) center / contain no-repeat;
	mask: var(--bl-icon-arrow-right) center / contain no-repeat;
}

.bonusovka-landing .wp-block-button__link:hover,
.bonusovka-landing .wp-block-button__link:focus-visible {
	background: var(--bl-gold-text);
	transform: translateY(-1px);
}

.bonusovka-landing figure {
	margin: 0;
}

.bonusovka-landing img {
	display: block;
	max-width: 100%;
	height: auto;
}

/* ── 1. Hero ───────────────────────────────────────────────────────── */

.bonusovka-landing .bonusovka-landing__hero {
	position: relative;
	display: flex;
	align-items: center;
	min-height: 440px;
	padding-block: 36px;
	overflow: hidden;
}

.bonusovka-landing .bonusovka-landing__hero-text {
	position: relative;
	z-index: 2;
	max-width: 560px;
}

.bonusovka-landing .bonusovka-landing__eyebrow {
	margin-bottom: 8px;
	font-size: 14px;
	font-weight: 600;
	letter-spacing: 0.16em;
	text-transform: uppercase;
	color: var(--bl-navy);
}

.bonusovka-landing .bonusovka-landing__title {
	margin-bottom: 18px;
	font-size: clamp(56px, 8vw, 104px);
	font-weight: 600;
	line-height: 0.95;
	text-transform: uppercase;
}

.bonusovka-landing .bonusovka-landing__lead {
	margin-bottom: 16px;
	font-family: var(--bl-heading-font);
	font-size: clamp(22px, 2.3vw, 28px);
	font-weight: 600;
	line-height: 1.25;
	color: var(--bl-navy);
}

.bonusovka-landing .bonusovka-landing__hero-media {
	/* Odsazeni zprava = okraj kontejneru ostatniho obsahu. Procenta se tu
	   vztahuji k sirce fotky (62 % hera), proto prepocet / 0.62. */
	--bl-hero-inset: max(var(--bl-gutter), (100% / 0.62 - var(--bl-container)) / 2);

	position: absolute;
	inset: 0 0 0 auto;
	z-index: 1;
	width: 62%;
}

.bonusovka-landing .bonusovka-landing__hero-image,
.bonusovka-landing .bonusovka-landing__hero-image img {
	width: 100%;
	height: 100%;
}

.bonusovka-landing .bonusovka-landing__hero-image img {
	object-fit: cover;
	object-position: 60% 18%;
	-webkit-mask-image: linear-gradient(to right, transparent 0, #000 38%);
	mask-image: linear-gradient(to right, transparent 0, #000 38%);
}

/* Cenovka nad tlacitkem vpravo dole — nezakryva obliceje na fotce. */
.bonusovka-landing .bonusovka-landing__badge {
	position: absolute;
	right: calc(var(--bl-hero-inset) + 36px);
	bottom: 86px;
	display: grid;
	place-content: center;
	width: 136px;
	height: 136px;
	margin: 0;
	border: 2px solid rgba(255, 255, 255, 0.6);
	border-radius: 50%;
	background: radial-gradient(circle at 35% 30%, #F1D9A2, var(--bl-gold) 75%);
	box-shadow: 0 12px 30px rgba(60, 40, 10, 0.3);
	font-family: var(--bl-heading-font);
	font-size: 24px;
	font-weight: 700;
	line-height: 1.05;
	text-align: center;
	color: var(--bl-wine);
}

.bonusovka-landing .bonusovka-landing__badge em {
	font-size: 16px;
	font-style: normal;
	font-weight: 600;
}

.bonusovka-landing .bonusovka-landing__hero-cta {
	position: absolute;
	right: var(--bl-hero-inset);
	bottom: 32px;
}

/* ── 2. Co je Bonusovka ────────────────────────────────────────────── */

.bonusovka-landing .bonusovka-landing__about {
	display: grid;
	grid-template-columns: 1.1fr 1.1fr 0.6fr;
	gap: 40px;
	align-items: center;
	padding-block: 24px;
	background: var(--bl-surface);
}

.bonusovka-landing .bonusovka-landing__about-image img {
	width: 100%;
	aspect-ratio: 4 / 3;
	object-fit: cover;
	border-radius: 8px;
	box-shadow: 0 16px 40px rgba(60, 40, 10, 0.15);
}

.bonusovka-landing .bonusovka-landing__note {
	margin: 0;
	padding: 36px 28px;
	border-radius: 46% 54% 42% 58% / 52% 44% 56% 48%;
	background: radial-gradient(ellipse at center, #F3E2C4 55%, rgba(243, 226, 196, 0) 72%);
	font-family: var(--bl-script-font);
	font-size: 32px;
	line-height: 1.3;
	text-align: center;
	color: var(--bl-navy);
	transform: rotate(-4deg);
}

/* ── 3. Co uvnitr najdete ──────────────────────────────────────────── */

/* Mezery pres gap — tema nuluje margin-block-start ve skupinach (!important). */
.bonusovka-landing .bonusovka-landing__inside {
	display: flex;
	flex-direction: column;
	gap: 24px;
	padding-block: 24px;
	background: var(--bl-bg-alt);
}

.bonusovka-landing .bonusovka-landing__inside > h2 {
	margin: 0;
}

.bonusovka-landing .bonusovka-landing__cards {
	display: grid;
	grid-template-columns: repeat(6, minmax(0, 1fr));
	gap: 16px;
}

.bonusovka-landing .bonusovka-landing__card {
	--card-icon: var(--bl-icon-star);

	overflow: hidden;
	margin: 0;
	padding-bottom: 18px;
	border: 1px solid var(--bl-line);
	border-radius: 10px;
	background: var(--bl-surface);
	box-shadow: 0 6px 18px rgba(60, 40, 10, 0.06);
	text-align: center;
}

.bonusovka-landing .bonusovka-landing__card--vztahy { --card-icon: var(--bl-icon-heart); }
.bonusovka-landing .bonusovka-landing__card--poradna { --card-icon: var(--bl-icon-message-circle); }
.bonusovka-landing .bonusovka-landing__card--hojnost { --card-icon: var(--bl-icon-star); }
.bonusovka-landing .bonusovka-landing__card--rust { --card-icon: var(--bl-icon-leaf); }
.bonusovka-landing .bonusovka-landing__card--potencial { --card-icon: var(--bl-icon-sun); }
.bonusovka-landing .bonusovka-landing__card--rozhovory { --card-icon: var(--bl-icon-message-square); }

.bonusovka-landing .bonusovka-landing__card img {
	width: 100%;
	aspect-ratio: 4 / 3;
	object-fit: cover;
}

/* Ikona na oblouku, kterym textova plocha vybiha do fotky. */
.bonusovka-landing .bonusovka-landing__card h3 {
	position: relative;
	margin: 0 10px 8px;
	padding-top: 26px;
	font-family: var(--bl-text-font);
	font-size: 15px;
	font-weight: 600;
	letter-spacing: 0.03em;
	text-transform: uppercase;
	color: var(--bl-navy);
}

.bonusovka-landing .bonusovka-landing__card h3::before,
.bonusovka-landing .bonusovka-landing__card h3::after {
	content: "";
	position: absolute;
	left: 50%;
	transform: translateX(-50%);
}

.bonusovka-landing .bonusovka-landing__card h3::before {
	/* Jen nad rozhranim — nesmi prekryt diakritiku nazvu. */
	top: -28px;
	width: 88px;
	height: 29px;
	border-radius: 50% 50% 0 0 / 100% 100% 0 0;
	background: var(--bl-surface);
}

.bonusovka-landing .bonusovka-landing__card h3::after {
	top: -20px;
	width: 34px;
	height: 34px;
	background-color: var(--bl-wine);
	-webkit-mask: var(--card-icon) center / contain no-repeat;
	mask: var(--card-icon) center / contain no-repeat;
}

.bonusovka-landing .bonusovka-landing__card p {
	margin: 0;
	padding: 0 12px;
	font-size: 14px;
	line-height: 1.45;
}

/* Pruh "Chci se podivat" */
.bonusovka-landing .bonusovka-landing__peek {
	display: flex;
	align-items: center;
	gap: 32px;
	padding: 20px 36px;
	border: 1px solid #CFCECA;
	border-radius: 10px;
	background: var(--bl-surface);
}

/* Ikona skupiny | svisly oddelovac | text */
.bonusovka-landing .bonusovka-landing__peek-text {
	position: relative;
	flex: 1;
	min-height: 56px;
	margin: 0;
	padding-left: 112px;
	font-family: var(--bl-heading-font);
	font-size: clamp(22px, 2.4vw, 30px);
	font-weight: 500;
	line-height: 1.25;
	color: var(--bl-navy);
	display: flex;
	align-items: center;
}

.bonusovka-landing .bonusovka-landing__peek-text::before,
.bonusovka-landing .bonusovka-landing__peek-text::after {
	content: "";
	position: absolute;
	top: 50%;
	transform: translateY(-50%);
}

.bonusovka-landing .bonusovka-landing__peek-text::before {
	left: 0;
	width: 64px;
	height: 56px;
	background-color: var(--bl-gold);
	-webkit-mask: var(--bl-icon-users) center / contain no-repeat;
	mask: var(--bl-icon-users) center / contain no-repeat;
}

.bonusovka-landing .bonusovka-landing__peek-text::after {
	left: 86px;
	width: 1px;
	height: 56px;
	background-color: #CFCECA;
}

/* ── 4. Proc a pro koho ────────────────────────────────────────────── */

.bonusovka-landing .bonusovka-landing__why {
	display: grid;
	grid-template-columns: 0.9fr 1.1fr 1fr;
	gap: 40px;
	align-items: stretch;
	padding-block: 24px;
	overflow-x: clip;
	background: var(--bl-surface);
}

.bonusovka-landing .bonusovka-landing__why-image,
.bonusovka-landing .bonusovka-landing__why-image img {
	height: 100%;
}

/* Fotka sahá až k levému okraji okna (záporný okraj = odsazení kontejneru).
   100vw obsahuje i posuvník — přesah vlevo se ořízne, nevadí. */
.bonusovka-landing .bonusovka-landing__why-image {
	margin-left: calc(-1 * max(var(--bl-gutter), (100vw - var(--bl-container)) / 2));
}

.bonusovka-landing .bonusovka-landing__why-image img {
	width: 100%;
	min-height: 360px;
	object-fit: cover;
	border-radius: 0 8px 8px 0;
}

.bonusovka-landing .bonusovka-landing__why h2,
.bonusovka-landing .bonusovka-landing__for h2 {
	font-size: clamp(26px, 2.4vw, 32px);
}

.bonusovka-landing .bonusovka-landing__why-text p,
.bonusovka-landing .bonusovka-landing__for li {
	font-size: 15.5px;
}

.bonusovka-landing .bonusovka-landing__for {
	padding-left: 40px;
	border-left: 1px solid var(--bl-line);
}

.bonusovka-landing .bonusovka-landing__for .bonusovka-landing__strong,
.bonusovka-landing .bonusovka-landing__why-text .bonusovka-landing__strong {
	font-family: var(--bl-text-font);
	font-size: 16px;
	font-weight: 700;
}

.bonusovka-landing .bonusovka-landing__list {
	margin: 0 0 18px;
	padding: 0;
	list-style: none;
}

.bonusovka-landing .bonusovka-landing__list li {
	position: relative;
	margin: 0 0 6px;
	padding-left: 30px;
	line-height: 1.45;
	color: var(--bl-navy);
}

.bonusovka-landing .bonusovka-landing__list li::before {
	content: "";
	position: absolute;
	top: 2px;
	left: 0;
	width: 19px;
	height: 19px;
	background-color: var(--bl-gold);
	-webkit-mask: var(--bl-icon-check) center / contain no-repeat;
	mask: var(--bl-icon-check) center / contain no-repeat;
}

.bonusovka-landing .bonusovka-landing__list--cross li::before {
	background-color: var(--bl-wine);
	-webkit-mask-image: var(--bl-icon-x);
	mask-image: var(--bl-icon-x);
}

.bonusovka-landing .bonusovka-landing__why .bonusovka-landing__script,
.bonusovka-landing .bonusovka-landing__for .bonusovka-landing__script {
	font-size: 26px;
}

/* ── 5. Zaver: cena + caste otazky v jedne sekci ───────────────────── */

/* Jedna fotka krajiny pres celou sekci: nahore zamlzene hory za cenou,
   uprostred svetla plocha s otazkami, dole pruh krajiny. Fotka je obycejny
   obrazek — jde vymenit v editoru. */
.bonusovka-landing .bonusovka-landing__closing {
	position: relative;
	padding-block: 48px 170px;
	overflow: hidden;
}

.bonusovka-landing .bonusovka-landing__closing-bg {
	position: absolute;
	inset: 0;
	z-index: 0;
}

.bonusovka-landing .bonusovka-landing__closing-bg img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	object-position: center 60%;
}

.bonusovka-landing .bonusovka-landing__closing::before {
	content: "";
	position: absolute;
	inset: 0;
	z-index: 1;
	background:
		linear-gradient(90deg, rgba(251, 246, 238, 0.7) 0%, rgba(251, 246, 238, 0) 60%) top / 100% 40% no-repeat,
		linear-gradient(to bottom,
			rgba(251, 246, 238, 0.45) 0,
			rgba(251, 246, 238, 0.55) 170px,
			rgba(251, 246, 238, 0.97) 270px,
			rgba(251, 246, 238, 0.97) calc(100% - 140px),
			rgba(251, 246, 238, 0) calc(100% - 50px));
}

.bonusovka-landing .bonusovka-landing__closing > :not(.bonusovka-landing__closing-bg) {
	position: relative;
	z-index: 2;
}

.bonusovka-landing .bonusovka-landing__price {
	display: grid;
	grid-template-columns: 1.3fr auto 1fr;
	gap: 40px;
	align-items: center;
	padding-bottom: 40px;
}

.bonusovka-landing .bonusovka-landing__price-eyebrow {
	margin-bottom: 4px;
	font-family: var(--bl-heading-font);
	font-size: 24px;
	font-weight: 600;
	color: var(--bl-wine);
}

.bonusovka-landing .bonusovka-landing__price-value {
	margin-bottom: 8px;
	font-family: var(--bl-heading-font);
	font-size: clamp(34px, 3.8vw, 54px);
	font-weight: 700;
	line-height: 1.05;
	white-space: nowrap;
	color: var(--bl-wine);
}

.bonusovka-landing .bonusovka-landing__price-text p:not([class]) {
	margin: 0;
	font-size: 19px;
	color: var(--bl-navy);
}

.bonusovka-landing .bonusovka-landing__price .bonusovka-landing__script {
	margin: 0;
	font-size: 32px;
	transform: rotate(-5deg);
}

/* Pruh s rocnim predplatnym (blok pluginu Klub) mezi cenou a otazkami. */
.bonusovka-landing .bonusovka-landing__closing > .mmbartosovi-klub-annual {
	margin: 0 0 32px;
}

/* ── 6. Caste otazky (uvnitr zaverecne sekce) ────────────────────────── */

/* Pruh s otazkami pres celou sirku okna s plnym pozadim; dole jemne
   prechazi do krajiny. 100vw obsahuje posuvnik — presah orizne sekce. */
.bonusovka-landing .bonusovka-landing__faq {
	--bl-faq-inset: max(var(--bl-gutter), (100vw - var(--bl-container)) / 2);

	margin-inline: calc(-1 * var(--bl-faq-inset));
	padding: 28px var(--bl-faq-inset) 32px;
	background: var(--bl-surface);
}

.bonusovka-landing .bonusovka-landing__faq::after {
	content: "";
	position: absolute;
	top: 100%;
	left: 0;
	right: 0;
	height: 48px;
	background: linear-gradient(to bottom, var(--bl-surface), rgba(255, 253, 249, 0));
	pointer-events: none;
}

.bonusovka-landing .bonusovka-landing__faq h2 {
	font-size: clamp(26px, 2.6vw, 34px);
	color: var(--bl-navy);
}

.bonusovka-landing .bonusovka-landing__faq-list {
	display: grid;
	grid-template-columns: repeat(5, minmax(0, 1fr));
	align-items: start;
	margin-top: 20px;
}

.bonusovka-landing .bonusovka-landing__faq-list > .wp-block-details {
	margin: 0;
	padding: 4px 20px;
	border-left: 1px solid var(--bl-line);
}

.bonusovka-landing .bonusovka-landing__faq-list > .wp-block-details:first-child {
	padding-left: 0;
	border-left: 0;
}

.bonusovka-landing .bonusovka-landing__faq-list summary {
	display: flex;
	align-items: flex-start;
	justify-content: space-between;
	gap: 12px;
	padding: 6px 0;
	color: var(--bl-navy);
	font-size: 15px;
	font-weight: 600;
	line-height: 1.4;
	list-style: none;
	cursor: pointer;
}

.bonusovka-landing .bonusovka-landing__faq-list summary::-webkit-details-marker {
	display: none;
}

.bonusovka-landing .bonusovka-landing__faq-list summary::after {
	content: "";
	flex: none;
	width: 16px;
	height: 16px;
	margin-top: 3px;
	background-color: var(--bl-gold-text);
	-webkit-mask: var(--bl-icon-plus) center / contain no-repeat;
	mask: var(--bl-icon-plus) center / contain no-repeat;
	transition: transform 0.2s ease;
}

.bonusovka-landing .bonusovka-landing__faq-list details[open] summary::after {
	transform: rotate(45deg);
}

.bonusovka-landing .bonusovka-landing__faq-list summary:focus-visible {
	outline: 2px solid var(--bl-gold);
	outline-offset: 4px;
}

.bonusovka-landing .bonusovka-landing__faq-list details p {
	margin: 10px 0 0;
	font-size: 15px;
	line-height: 1.55;
}

/* ── Responzivita ──────────────────────────────────────────────────── */

@media (max-width: 1100px) {
	.bonusovka-landing .bonusovka-landing__cards {
		grid-template-columns: repeat(3, minmax(0, 1fr));
		row-gap: 24px;
	}

	.bonusovka-landing .bonusovka-landing__about {
		grid-template-columns: 1fr 1fr;
	}

	.bonusovka-landing .bonusovka-landing__note {
		grid-column: 1 / -1;
		justify-self: center;
		max-width: 420px;
	}

	.bonusovka-landing .bonusovka-landing__why {
		grid-template-columns: 1fr 1fr;
	}

	.bonusovka-landing .bonusovka-landing__why-image {
		grid-row: span 2;
	}

	.bonusovka-landing .bonusovka-landing__for {
		padding-left: 0;
		padding-top: 32px;
		border-left: 0;
		border-top: 1px solid var(--bl-line);
	}

	.bonusovka-landing .bonusovka-landing__faq-list {
		grid-template-columns: 1fr;
	}

	.bonusovka-landing .bonusovka-landing__faq-list > .wp-block-details,
	.bonusovka-landing .bonusovka-landing__faq-list > .wp-block-details:first-child {
		padding: 12px 0;
		border-left: 0;
		border-bottom: 1px solid var(--bl-line);
	}
}

@media (max-width: 900px) {
	.bonusovka-landing .bonusovka-landing__hero {
		flex-direction: column;
		align-items: stretch;
		min-height: 0;
		padding-block: 32px 0;
	}

	.bonusovka-landing .bonusovka-landing__hero-media {
		position: relative;
		inset: auto;
		width: auto;
		height: 380px;
		margin-inline: calc(-1 * max(var(--bl-gutter), (100% - var(--bl-container)) / 2));
		margin-top: 8px;
	}

	.bonusovka-landing .bonusovka-landing__hero-image img {
		-webkit-mask-image: linear-gradient(to bottom, transparent 0, #000 28%);
		mask-image: linear-gradient(to bottom, transparent 0, #000 28%);
	}

	.bonusovka-landing .bonusovka-landing__badge {
		right: 16px;
		bottom: 84px;
		width: 116px;
		height: 116px;
		font-size: 21px;
	}

	.bonusovka-landing .bonusovka-landing__badge em {
		font-size: 15px;
	}

	.bonusovka-landing .bonusovka-landing__hero-cta {
		right: 50%;
		bottom: 24px;
		transform: translateX(50%);
	}

	.bonusovka-landing .bonusovka-landing__about,
	.bonusovka-landing .bonusovka-landing__why,
	.bonusovka-landing .bonusovka-landing__price {
		grid-template-columns: 1fr;
		gap: 28px;
	}

	.bonusovka-landing .bonusovka-landing__why-image {
		grid-row: auto;
		margin-left: 0;
	}

	.bonusovka-landing .bonusovka-landing__why-image img {
		min-height: 0;
		aspect-ratio: 4 / 3;
		border-radius: 8px;
	}

	.bonusovka-landing .bonusovka-landing__peek {
		flex-direction: column;
		align-items: flex-start;
		gap: 20px;
		padding: 24px;
	}

	.bonusovka-landing .bonusovka-landing__closing {
		padding-bottom: 150px;
	}

	.bonusovka-landing .bonusovka-landing__closing::before {
		background: linear-gradient(to bottom,
			rgba(251, 246, 238, 0.85) 0,
			rgba(251, 246, 238, 0.97) 200px,
			rgba(251, 246, 238, 0.97) calc(100% - 130px),
			rgba(251, 246, 238, 0) calc(100% - 40px));
	}
}

@media (max-width: 640px) {
	.bonusovka-landing .bonusovka-landing__cards {
		grid-template-columns: repeat(2, minmax(0, 1fr));
		gap: 12px;
		row-gap: 16px;
	}

	.bonusovka-landing .bonusovka-landing__peek-text {
		min-height: 40px;
		padding-left: 70px;
	}

	.bonusovka-landing .bonusovka-landing__peek-text::before {
		width: 40px;
		height: 36px;
	}

	.bonusovka-landing .bonusovka-landing__peek-text::after {
		left: 54px;
		height: 40px;
	}

	.bonusovka-landing .wp-block-button__link {
		padding: 15px 26px;
		font-size: 14px;
	}
}

@media (prefers-reduced-motion: reduce) {
	.bonusovka-landing .wp-block-button__link,
	.bonusovka-landing .bonusovka-landing__faq-list summary::after {
		transition: none;
	}
}