/* ==========================================================================
   Darčeková poukážka (/poukaz/) – kampaňová stránka: claim, cena, kúpa.
   ========================================================================== */

html, body { overflow-x: clip; } /* poukážka presahuje do pravého okraja */

.voucher { display: grid; gap: 40px; align-items: center; padding-block: 48px 96px; min-height: calc(100svh - 230px); }
.voucher h1 { margin-top: 0; font-size: clamp(34px, 4.2vw, 54px); }
.voucher__sub { margin-top: 20px; max-width: 34em; font-size: 19px; line-height: 1.6; color: var(--muted); text-wrap: pretty; }

.buy { margin-top: 32px; max-width: 520px; }
.buy__price { display: flex; flex-wrap: wrap; align-items: center; gap: 10px 16px; }
.buy__price .price__now b { font-size: 52px; }
.buy__price-note { flex-basis: 100%; font-size: 15px; color: var(--muted); }
.buy .price__note { margin-top: 16px; }
.buy__more { margin-top: 16px; text-align: center; font-size: 15px; color: var(--muted); }
.buy__more a { color: var(--brick); font-weight: 600; text-underline-offset: 4px; }

.facts { margin-top: 28px; padding-top: 24px; border-top: 1px solid var(--line); display: grid; gap: 12px; }
.facts li { display: grid; grid-template-columns: 22px 1fr; gap: 10px; line-height: 1.45; }
.facts svg { width: 20px; height: 20px; color: var(--brick); margin-top: 1px; }
.facts b { font-weight: 600; }

.voucher__visual { position: relative; }
.voucher__visual > img { width: 100%; max-width: none; filter: drop-shadow(0 40px 50px rgba(70, 44, 25, .22)); }

@media (min-width: 1000px) {
	.voucher { grid-template-columns: 1.1fr 1fr; gap: 24px; align-items: start; padding-top: 96px; } /* nadpis na rovnakej výške ako na úvode */
	.voucher__visual > img { width: 106%; margin-left: -2%; }
	}

@media (max-width: 640px) {
	.voucher { padding-top: 8px; gap: 16px; min-height: 0; }
	.voucher__visual { order: -1; margin: -12px -12px -28px; }
	}