/*
 * Fraunces (SIL OFL 1.1, see assets/fonts/OFL.txt) for headings and the
 * wordmark: a Polish subset keeping the optical size axis and weights 500-700.
 */
@font-face {
	font-family: "Fraunces";
	font-style: normal;
	font-weight: 500 700;
	font-display: swap;
	src: url("../fonts/fraunces-pl.woff2") format("woff2");
}

/* Tokens */
:root {
	--coupon-site-navy: #13294b;
	--coupon-site-navy-dark: #0b1a33;
	--coupon-site-navy-soft: #e8edf5;
	--coupon-site-gold: #e3a83a;
	--coupon-site-gold-bright: #f2bd55;
	--coupon-site-gold-soft: #fcf1da;
	--coupon-site-gold-text: #8a5300;
	--coupon-site-cream: #f7f4ee;
	--coupon-site-white: #ffffff;
	--coupon-site-ink: #172033;
	--coupon-site-muted: #5a6577;
	--coupon-site-border: #e5dfd3;
	--coupon-site-border-strong: #cfc6b5;
	--coupon-site-success: #1d7a4b;
	--coupon-site-danger: #b3261e;
	--coupon-site-focus: #9b5800;
	/* Colors by role. The dark theme below redefines only these. */
	color-scheme: light;
	--coupon-site-bg: var(--coupon-site-cream);
	--coupon-site-surface: var(--coupon-site-white);
	--coupon-site-surface-alt: var(--coupon-site-white);
	--coupon-site-text: var(--coupon-site-ink);
	--coupon-site-heading: var(--coupon-site-navy);
	--coupon-site-link: var(--coupon-site-navy);
	--coupon-site-link-hover: var(--coupon-site-gold-text);
	--coupon-site-outline: var(--coupon-site-navy);
	--coupon-site-solid: var(--coupon-site-navy);
	--coupon-site-solid-hover: var(--coupon-site-navy-dark);
	--coupon-site-tint: var(--coupon-site-navy-soft);
	--coupon-site-tint-text: var(--coupon-site-navy);
	--coupon-site-code-text: var(--coupon-site-navy-dark);
	--coupon-site-discount-border: #ecc77f;
	--coupon-site-inactive-bg: #f4f4f2;
	--coupon-site-placeholder: #7d8797;
	--coupon-site-hero-search-border: transparent;
	--coupon-site-arrow-bg: var(--coupon-site-gold-soft);
	/* Store logos are made for white; in the dark theme they get a white plate. */
	--coupon-site-logo-bg: var(--coupon-site-white);
	--coupon-site-logo-plate: transparent;
	--coupon-site-logo-plate-pad: 0;
	--coupon-site-logo-plate-radius: 0;
	--coupon-site-serif: "Fraunces", Georgia, "Iowan Old Style", "Palatino Linotype", "Times New Roman", serif;
	--coupon-site-sans: "Inter", "Segoe UI", system-ui, -apple-system, BlinkMacSystemFont, Roboto, "Helvetica Neue", Arial, sans-serif;
	--coupon-site-mono: ui-monospace, "SFMono-Regular", "JetBrains Mono", Menlo, Consolas, monospace;
	--coupon-site-content: 46rem;
	--coupon-site-wide: 76rem;
	--coupon-site-gutter: max(1rem, calc((100% - var(--coupon-site-wide)) / 2));
	--coupon-site-radius-sm: .625rem;
	--coupon-site-radius-card: 1rem;
	--coupon-site-radius-pill: 999px;
	--coupon-site-shadow-sm: 0 1px 2px rgb(19 41 75 / 6%), 0 2px 8px rgb(19 41 75 / 5%);
	--coupon-site-shadow: 0 1px 2px rgb(19 41 75 / 6%), 0 10px 28px rgb(19 41 75 / 9%);
	--coupon-site-shadow-lg: 0 24px 60px rgb(11 26 51 / 22%);
	--coupon-site-shadow-hover: 0 2px 4px rgb(19 41 75 / 6%), 0 22px 44px -16px rgb(19 41 75 / 30%);
	--coupon-site-glow: 0 10px 26px -10px rgb(227 168 58 / 70%);
	/* Motion: quick to start, gentle to settle; the spring overshoots a little. */
	--coupon-site-ease-out: cubic-bezier(.22, 1, .36, 1);
	--coupon-site-ease-in-out: cubic-bezier(.65, 0, .35, 1);
	--coupon-site-ease-spring: cubic-bezier(.34, 1.56, .64, 1);
	/* Light that sweeps across gold buttons on hover. */
	--coupon-site-sheen: linear-gradient(105deg, transparent 25%, rgb(255 255 255 / 50%) 50%, transparent 75%);
	--coupon-site-space-1: .5rem;
	--coupon-site-space-2: .75rem;
	--coupon-site-space-3: 1rem;
	--coupon-site-space-4: 1.5rem;
	--coupon-site-space-5: 2rem;
	--coupon-site-space-6: clamp(2.5rem, 6vw, 4.5rem);
	--coupon-site-notch-bg: var(--coupon-site-bg);
	--coupon-site-code-slot: 3.25rem;
	/* Small brand bow tie, used as the section heading ornament. */
	--coupon-site-bowtie: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 120 16'%3E%3Cpath d='M0 8h44M76 8h44' stroke='%23e3a83a' stroke-width='2.5' stroke-linecap='round'/%3E%3Cpath d='M48 2.5c3.5 0 7 3 10.5 4.2v2.6C55 10.5 51.5 13.5 48 13.5c-1.5 0-2-1.5-2-5.5s.5-5.5 2-5.5zM72 2.5c-3.5 0-7 3-10.5 4.2v2.6C65 10.5 68.5 13.5 72 13.5c1.5 0 2-1.5 2-5.5s-.5-5.5-2-5.5z' fill='%2313294b'/%3E%3Crect x='57.5' y='5.5' width='5' height='5' rx='1.5' fill='%2313294b'/%3E%3C/svg%3E");
	/* The same ornament with a cream bow, for navy panels in both themes. */
	--coupon-site-bowtie-on-navy: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 120 16'%3E%3Cpath d='M0 8h44M76 8h44' stroke='%23e3a83a' stroke-width='2.5' stroke-linecap='round'/%3E%3Cpath d='M48 2.5c3.5 0 7 3 10.5 4.2v2.6C55 10.5 51.5 13.5 48 13.5c-1.5 0-2-1.5-2-5.5s.5-5.5 2-5.5zM72 2.5c-3.5 0-7 3-10.5 4.2v2.6C65 10.5 68.5 13.5 72 13.5c1.5 0 2-1.5 2-5.5s-.5-5.5-2-5.5z' fill='%23f6f0e4'/%3E%3Crect x='57.5' y='5.5' width='5' height='5' rx='1.5' fill='%23f6f0e4'/%3E%3C/svg%3E");
	/* Just the gold bow, for the footer medallion. */
	--coupon-site-bow-gold: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='45 1 30 14'%3E%3Cpath d='M48 2.5c3.5 0 7 3 10.5 4.2v2.6C55 10.5 51.5 13.5 48 13.5c-1.5 0-2-1.5-2-5.5s.5-5.5 2-5.5zM72 2.5c-3.5 0-7 3-10.5 4.2v2.6C65 10.5 68.5 13.5 72 13.5c1.5 0 2-1.5 2-5.5s-.5-5.5-2-5.5z' fill='%23f2bd55'/%3E%3Crect x='57.5' y='5.5' width='5' height='5' rx='1.5' fill='%23f2bd55'/%3E%3C/svg%3E");
	/* Brush stroke drawn under the last word of the homepage headline. */
	--coupon-site-swash: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 200 16' preserveAspectRatio='none'%3E%3Cpath d='M2 12C60 4 140 2 198 5C140 7 70 9 4 15Q0 14 2 12Z' fill='%23e3a83a'/%3E%3C/svg%3E");
	--coupon-site-chevron: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%2313294b' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E");
	--coupon-site-icon-clock: 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.2' stroke-linecap='round'%3E%3Ccircle cx='12' cy='12' r='9'/%3E%3Cpath d='M12 7v5l3 2'/%3E%3C/svg%3E");
	--coupon-site-icon-arrow: 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.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12h14M13 6l6 6-6 6'/%3E%3C/svg%3E");
	--coupon-site-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.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m5 12.5 4.5 4.5L19 7.5'/%3E%3C/svg%3E");
	--coupon-site-icon-external: 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.3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M14 4h6v6M20 4l-9 9M18 14v5a1 1 0 0 1-1 1H5a1 1 0 0 1-1-1V7a1 1 0 0 1 1-1h5'/%3E%3C/svg%3E");
}

/*
 * Dark theme: follows the system setting unless the visitor picked a theme with
 * the header toggle (data-theme on <html>). Both blocks must stay identical.
 */
@media (prefers-color-scheme: dark) {
	:root:not([data-theme="light"]) {
		color-scheme: dark;
		--coupon-site-bg: #0c1527;
		--coupon-site-surface: #15223b;
		--coupon-site-surface-alt: #101b31;
		--coupon-site-text: #e3e8f0;
		--coupon-site-heading: #f6f0e4;
		--coupon-site-link: var(--coupon-site-gold-bright);
		--coupon-site-link-hover: #ffd98f;
		--coupon-site-outline: #c3cfe2;
		--coupon-site-solid: #2a4877;
		--coupon-site-solid-hover: #345891;
		--coupon-site-tint: #22375a;
		--coupon-site-tint-text: #dce5f2;
		--coupon-site-code-text: #fff1d6;
		--coupon-site-discount-border: #6e5523;
		--coupon-site-inactive-bg: #111a2c;
		--coupon-site-danger: #ff9f98;
		--coupon-site-placeholder: #8c98ab;
		--coupon-site-hero-search-border: rgb(255 255 255 / 22%);
		--coupon-site-arrow-bg: var(--coupon-site-gold);
		--coupon-site-logo-plate: var(--coupon-site-white);
		--coupon-site-logo-plate-pad: .35rem;
		--coupon-site-logo-plate-radius: .4rem;
		--coupon-site-gold-soft: #2d2513;
		--coupon-site-gold-text: var(--coupon-site-gold-bright);
		--coupon-site-muted: #a3afc2;
		--coupon-site-border: #26375a;
		--coupon-site-border-strong: #3a4f74;
		--coupon-site-focus: var(--coupon-site-gold-bright);
		--coupon-site-shadow-sm: 0 1px 2px rgb(0 0 0 / 25%), 0 2px 8px rgb(0 0 0 / 18%);
		--coupon-site-shadow: 0 1px 2px rgb(0 0 0 / 25%), 0 10px 28px rgb(0 0 0 / 30%);
		--coupon-site-shadow-lg: 0 24px 60px rgb(0 0 0 / 45%);
		--coupon-site-shadow-hover: 0 2px 4px rgb(0 0 0 / 30%), 0 22px 44px -16px rgb(0 0 0 / 60%);
		--coupon-site-bowtie: var(--coupon-site-bowtie-on-navy);
		--coupon-site-chevron: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23e3e8f0' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E");
	}
}

:root[data-theme="dark"] {
	color-scheme: dark;
	--coupon-site-bg: #0c1527;
	--coupon-site-surface: #15223b;
	--coupon-site-surface-alt: #101b31;
	--coupon-site-text: #e3e8f0;
	--coupon-site-heading: #f6f0e4;
	--coupon-site-link: var(--coupon-site-gold-bright);
	--coupon-site-link-hover: #ffd98f;
	--coupon-site-outline: #c3cfe2;
	--coupon-site-solid: #2a4877;
	--coupon-site-solid-hover: #345891;
	--coupon-site-tint: #22375a;
	--coupon-site-tint-text: #dce5f2;
	--coupon-site-code-text: #fff1d6;
	--coupon-site-discount-border: #6e5523;
	--coupon-site-inactive-bg: #111a2c;
	--coupon-site-danger: #ff9f98;
	--coupon-site-placeholder: #8c98ab;
	--coupon-site-hero-search-border: rgb(255 255 255 / 22%);
	--coupon-site-arrow-bg: var(--coupon-site-gold);
	--coupon-site-logo-plate: var(--coupon-site-white);
	--coupon-site-logo-plate-pad: .35rem;
	--coupon-site-logo-plate-radius: .4rem;
	--coupon-site-gold-soft: #2d2513;
	--coupon-site-gold-text: var(--coupon-site-gold-bright);
	--coupon-site-muted: #a3afc2;
	--coupon-site-border: #26375a;
	--coupon-site-border-strong: #3a4f74;
	--coupon-site-focus: var(--coupon-site-gold-bright);
	--coupon-site-shadow-sm: 0 1px 2px rgb(0 0 0 / 25%), 0 2px 8px rgb(0 0 0 / 18%);
	--coupon-site-shadow: 0 1px 2px rgb(0 0 0 / 25%), 0 10px 28px rgb(0 0 0 / 30%);
	--coupon-site-shadow-lg: 0 24px 60px rgb(0 0 0 / 45%);
	--coupon-site-shadow-hover: 0 2px 4px rgb(0 0 0 / 30%), 0 22px 44px -16px rgb(0 0 0 / 60%);
	--coupon-site-bowtie: var(--coupon-site-bowtie-on-navy);
	--coupon-site-chevron: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23e3e8f0' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E");
}

/* Base */
* { box-sizing: border-box; }

html { accent-color: var(--coupon-site-gold); scroll-behavior: smooth; }

::selection { background: rgb(227 168 58 / 35%); color: inherit; }

/*
 * Pages cross-fade into each other while the header stays put; between the
 * homepage and the other pages the brand and menu glide to their new places.
 * Browsers without view transitions simply load the next page.
 */
@media (prefers-reduced-motion: no-preference) {
	@view-transition { navigation: auto; }
	.site-header { view-transition-name: coupon-site-header; }
	.site-header .site-branding { view-transition-name: coupon-site-brand; }
}
/* Only the desktop menu bar and toggle change place; the mobile menu keeps its dropdown untouched. */
@media (prefers-reduced-motion: no-preference) and (min-width: 72rem) {
	.site-header .primary-navigation { view-transition-name: coupon-site-menu; }
	.site-header .theme-toggle { view-transition-name: coupon-site-toggle; }
}

body {
	min-width: 0;
	margin: 0;
	background: var(--coupon-site-bg);
	color: var(--coupon-site-text);
	font-family: var(--coupon-site-sans);
	font-size: 1rem;
	line-height: 1.6;
	-webkit-font-smoothing: antialiased;
	text-rendering: optimizeLegibility;
}

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

button,
input,
select { font: inherit; }

button,
a,
summary { -webkit-tap-highlight-color: transparent; }

a { color: var(--coupon-site-link); text-decoration-thickness: .08em; text-underline-offset: .18em; }
a:hover { color: var(--coupon-site-link-hover); }
a:focus-visible,
button:focus-visible,
input:focus-visible,
select:focus-visible,
textarea:focus-visible,
summary:focus-visible {
	outline: 3px solid var(--coupon-site-focus);
	outline-offset: 3px;
}

h1, h2, h3, p { overflow-wrap: anywhere; }
h1, h2, h3 { color: var(--coupon-site-heading); line-height: 1.2; }
h1, h2 { font-family: var(--coupon-site-serif); font-weight: 600; letter-spacing: -.015em; }
h3 { font-family: var(--coupon-site-sans); }

/* Shared button look */
.offer-search-form button,
.offer-card__cta,
.home-hero__cta,
.store-search button,
.catalog-filters button,
.blog-search button,
.entry-content .wp-block-button__link,
.contact-form__submit {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: .5rem;
	min-height: 44px;
	padding: .6rem 1.25rem;
	border: 0;
	border-radius: var(--coupon-site-radius-pill);
	background: var(--coupon-site-sheen) -150% 0 / 60% 100% no-repeat var(--coupon-site-gold);
	box-shadow: inset 0 -2px 0 rgb(0 0 0 / 12%);
	color: var(--coupon-site-navy-dark);
	cursor: pointer;
	font-weight: 800;
	line-height: 1.2;
	text-align: center;
	text-decoration: none;
	transition: background-color .2s ease, transform .25s var(--coupon-site-ease-out), box-shadow .25s ease;
}
/* The sheen crosses once on hover and jumps back unseen when the pointer leaves. */
.offer-search-form button:hover,
.offer-card__cta:hover,
.home-hero__cta:hover,
.store-search button:hover,
.catalog-filters button:hover,
.blog-search button:hover,
.entry-content .wp-block-button__link:hover,
.contact-form__submit:hover {
	background-color: var(--coupon-site-gold-bright);
	background-position: 250% 0;
	box-shadow: inset 0 -2px 0 rgb(0 0 0 / 12%), var(--coupon-site-glow);
	color: var(--coupon-site-navy-dark);
	transition: background-color .2s ease, background-position .8s var(--coupon-site-ease-out), transform .25s var(--coupon-site-ease-out), box-shadow .25s ease;
}
.offer-card__cta:not(.offer-card__cta--code):hover { transform: translateY(-2px); }
.offer-search-form button:active,
.offer-card__cta:active,
.offer-card__cta:not(.offer-card__cta--code):active { transform: translateY(1px); }

.offer-card__secondary-cta,
.text-link-button,
.home-more__link {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: .45rem;
	min-height: 44px;
	padding: .55rem 1.15rem;
	border: 2px solid var(--coupon-site-outline);
	border-radius: var(--coupon-site-radius-pill);
	/* The navy fill sweeps in from the left on hover. */
	background: linear-gradient(var(--coupon-site-solid), var(--coupon-site-solid)) left / 0 100% no-repeat var(--coupon-site-surface);
	color: var(--coupon-site-heading);
	font-weight: 800;
	line-height: 1.2;
	text-align: center;
	text-decoration: none;
	transition: background-size .45s var(--coupon-site-ease-out), background-color .2s ease, color .2s ease;
}
.offer-card__secondary-cta:hover,
.text-link-button:hover,
.home-more__link:hover { background-size: 100% 100%; color: var(--coupon-site-white); }
.home-more__link::after,
.text-link-button::after {
	width: 1.05em;
	height: 1.05em;
	background: currentColor;
	content: "";
	transition: transform .35s var(--coupon-site-ease-out);
	-webkit-mask: var(--coupon-site-icon-arrow) center / contain no-repeat;
	mask: var(--coupon-site-icon-arrow) center / contain no-repeat;
}
.home-more__link:hover::after,
.text-link-button:hover::after { transform: translateX(4px); }

/* Layout */
.site-main { width: min(calc(100% - 2rem), var(--coupon-site-wide)); margin: var(--coupon-site-space-5) auto var(--coupon-site-space-6); }
.site-main--home { width: 100%; margin-block: 0; }
.site-main--search { padding-bottom: var(--coupon-site-space-4); }
.site-main > .entry,
.site-main > .no-results { max-width: var(--coupon-site-content); margin-inline: auto; }
.site-main > .entry {
	padding: clamp(1.5rem, 4vw, 2.5rem);
	border: 1px solid var(--coupon-site-border);
	border-radius: var(--coupon-site-radius-card);
	background: var(--coupon-site-surface);
}

.entry + .entry { margin-top: var(--coupon-site-space-5); padding-top: var(--coupon-site-space-5); border-top: 1px solid var(--coupon-site-border); }
.entry-title { margin-block: 0 var(--coupon-site-space-2); font-size: clamp(1.75rem, 4vw, 2.5rem); }
.entry-content, .archive-description { overflow-wrap: anywhere; }
.entry-content > * { max-width: 100%; }
.entry-meta { color: var(--coupon-site-muted); }

.archive-header { margin-bottom: var(--coupon-site-space-4); }
.archive-header h1,
.archive-title { margin: 0 0 var(--coupon-site-space-1); font-size: clamp(1.9rem, 4.5vw, 2.75rem); }
.archive-description { max-width: 48rem; color: var(--coupon-site-muted); font-size: 1.05rem; }
.archive-description p { margin: 0 0 .5rem; }
.catalog-result-count { margin: 0 0 var(--coupon-site-space-2); color: var(--coupon-site-muted); font-size: .9rem; font-weight: 600; }

/* Header */
.site-header {
	position: relative;
	z-index: 20;
	border-bottom: 1px solid var(--coupon-site-border);
	background: var(--coupon-site-surface);
	color: var(--coupon-site-text);
}
/* Gold hairline that fades out toward the edges. */
.site-header::after {
	position: absolute;
	right: 0;
	bottom: -1px;
	left: 0;
	height: 1px;
	background: linear-gradient(90deg, transparent, var(--coupon-site-gold) 25%, var(--coupon-site-gold-bright) 50%, var(--coupon-site-gold) 75%, transparent);
	content: "";
	opacity: .75;
	pointer-events: none;
}
.site-header__inner {
	display: grid;
	grid-template-columns: minmax(0, 1fr) auto auto;
	align-items: center;
	gap: var(--coupon-site-space-2) var(--coupon-site-space-1);
	width: min(calc(100% - 2rem), var(--coupon-site-wide));
	margin-inline: auto;
	padding-block: .75rem;
}
.site-header__tools { display: contents; }
.site-header__search { grid-column: 1 / -1; grid-row: 2; min-width: 0; }
.site-header .primary-navigation { grid-column: 3; grid-row: 1; }
.site-header .theme-toggle { grid-column: 2; grid-row: 1; }

.site-branding { min-width: 0; margin: 0; line-height: 1; }
.site-branding__link {
	display: inline-flex;
	align-items: center;
	gap: .6rem;
	min-height: 44px;
	color: var(--coupon-site-heading);
	text-decoration: none;
}
.site-branding__link:hover { color: var(--coupon-site-heading); }
/* On hover the mascot leans in, as if tipping his cap. */
.site-branding__mascot { flex: 0 0 auto; width: 3.5rem; height: auto; transform-origin: 50% 90%; transition: transform .55s var(--coupon-site-ease-spring); }
.site-branding__link:hover .site-branding__mascot { transform: rotate(-7deg) translateY(-2px); }
.site-branding__text { display: grid; gap: .3rem; min-width: 0; }
.site-branding__wordmark {
	color: var(--coupon-site-heading);
	font-family: var(--coupon-site-serif);
	font-size: clamp(1.35rem, 4.5vw, 1.75rem);
	font-weight: 700;
	letter-spacing: -.02em;
	line-height: 1;
	white-space: nowrap;
}
.site-branding__accent { color: var(--coupon-site-gold); }
.site-branding__tagline {
	color: var(--coupon-site-muted);
	font-size: .62rem;
	font-weight: 700;
	letter-spacing: .2em;
	text-transform: uppercase;
	white-space: nowrap;
}
.site-header a:focus-visible,
.primary-navigation__summary:focus-visible { outline-color: var(--coupon-site-focus); }

/* Navigation */
.primary-navigation { min-width: 0; }
.primary-navigation__disclosure { min-width: 0; }
.primary-navigation__summary {
	display: inline-flex;
	align-items: center;
	gap: .45rem;
	min-height: 44px;
	padding: .5rem .9rem;
	border-radius: var(--coupon-site-radius-pill);
	background: var(--coupon-site-solid);
	color: var(--coupon-site-white);
	cursor: pointer;
	font-weight: 700;
	list-style: none;
	transition: background-color .2s ease;
}
.primary-navigation__summary::-webkit-details-marker { display: none; }
.primary-navigation__summary:hover,
.primary-navigation__disclosure[open] .primary-navigation__summary { background: var(--coupon-site-solid-hover); }
/* The three bars fold into a cross while the menu is open. */
.primary-navigation__bar { transform-box: fill-box; transform-origin: center; transition: transform .35s var(--coupon-site-ease-out), opacity .2s ease; }
.primary-navigation__disclosure[open] .primary-navigation__bar--top { transform: translateY(5px) rotate(45deg); }
.primary-navigation__disclosure[open] .primary-navigation__bar--middle { opacity: 0; transform: scaleX(0); }
.primary-navigation__disclosure[open] .primary-navigation__bar--bottom { transform: translateY(-5px) rotate(-45deg); }
.primary-navigation__desktop { display: none; }
.primary-navigation__menu,
.primary-navigation__menu ul,
.footer-navigation__menu {
	margin: 0;
	padding: 0;
	list-style: none;
}
.primary-navigation__disclosure > .primary-navigation__menu,
.primary-navigation__disclosure > .primary-navigation__menu > ul {
	position: absolute;
	top: 100%;
	right: 0;
	left: 0;
	display: grid;
	gap: .15rem;
	padding: .75rem max(1rem, calc((100% - var(--coupon-site-wide)) / 2)) 1rem;
	border-bottom: 3px solid var(--coupon-site-gold);
	background: var(--coupon-site-solid);
	box-shadow: var(--coupon-site-shadow-lg);
}
.primary-navigation__disclosure > .primary-navigation__menu > ul { position: static; padding: 0; border: 0; box-shadow: none; }
.primary-navigation__menu ul { padding-left: var(--coupon-site-space-3); }
.primary-navigation__menu a {
	position: relative;
	display: flex;
	align-items: center;
	min-height: 44px;
	padding: .5rem .85rem;
	border-radius: var(--coupon-site-radius-sm);
	color: var(--coupon-site-white);
	font-weight: 700;
	line-height: 1.3;
	text-decoration: none;
	overflow-wrap: anywhere;
	transition: background-color .2s ease;
}
.primary-navigation__menu a:hover { background: rgb(255 255 255 / 10%); color: var(--coupon-site-white); }
.primary-navigation__menu .current-menu-item > a,
.primary-navigation__menu a[aria-current="page"] { background: rgb(255 255 255 / 8%); box-shadow: inset 3px 0 0 var(--coupon-site-gold); }
.primary-navigation__menu a:focus-visible { outline-color: var(--coupon-site-gold); outline-offset: -2px; }
/* Desktop bar: a gold underline grows from the middle of the hovered or current link. */
.primary-navigation__desktop .primary-navigation__menu a::after {
	position: absolute;
	right: 1rem;
	bottom: .4rem;
	left: 1rem;
	height: 2px;
	border-radius: 2px;
	background: var(--coupon-site-gold-bright);
	content: "";
	transform: scaleX(0);
	transition: transform .35s var(--coupon-site-ease-out);
}
.primary-navigation__desktop .primary-navigation__menu a:hover::after,
.primary-navigation__desktop .primary-navigation__menu .current-menu-item > a::after,
.primary-navigation__desktop .primary-navigation__menu a[aria-current="page"]::after { transform: scaleX(1); }
.primary-navigation__desktop .primary-navigation__menu .current-menu-item > a,
.primary-navigation__desktop .primary-navigation__menu a[aria-current="page"] { background: none; box-shadow: none; }
@media (prefers-reduced-motion: no-preference) {
	.primary-navigation__disclosure[open] > .primary-navigation__menu { animation: coupon-site-drop .4s var(--coupon-site-ease-out) both; }
	.primary-navigation__disclosure[open] .primary-navigation__menu li { animation: coupon-site-rise .45s var(--coupon-site-ease-out) both; }
	.primary-navigation__disclosure[open] .primary-navigation__menu li:nth-child(2) { animation-delay: .04s; }
	.primary-navigation__disclosure[open] .primary-navigation__menu li:nth-child(3) { animation-delay: .08s; }
	.primary-navigation__disclosure[open] .primary-navigation__menu li:nth-child(4) { animation-delay: .12s; }
	.primary-navigation__disclosure[open] .primary-navigation__menu li:nth-child(n+5) { animation-delay: .16s; }
}

/* Light/dark toggle */
.theme-toggle {
	display: inline-grid;
	place-items: center;
	width: 44px;
	height: 44px;
	padding: 0;
	border: 1px solid var(--coupon-site-border-strong);
	border-radius: 50%;
	background: var(--coupon-site-surface);
	color: var(--coupon-site-heading);
	cursor: pointer;
	transition: border-color .2s ease, color .2s ease, box-shadow .25s ease;
}
/*
 * Hidden without JavaScript. The head script marks the page before the first
 * paint, so the toggle is there from the start instead of popping in late.
 */
:root:not(.coupon-site-theme-js) .theme-toggle[hidden] { display: none; }
.theme-toggle:hover { border-color: var(--coupon-site-gold); box-shadow: 0 0 0 4px rgb(227 168 58 / 18%); color: var(--coupon-site-gold-text); }
.theme-toggle__icon { grid-area: 1 / 1; transition: transform .45s var(--coupon-site-ease-spring); }
.theme-toggle:hover .theme-toggle__icon { transform: rotate(-18deg) scale(1.08); }
@media (prefers-reduced-motion: no-preference) {
	/* theme-toggle.js sets is-switching for one click, so the icon does not spin on every page load. */
	.theme-toggle.is-switching .theme-toggle__icon { animation: coupon-site-icon-in .6s var(--coupon-site-ease-spring) both; }
}
/* The icon follows the active theme in CSS, so it is right before any script runs: moon when light, sun when dark. */
.theme-toggle__icon--sun,
:root[data-theme="dark"] .theme-toggle__icon--moon { display: none; }
:root[data-theme="dark"] .theme-toggle__icon--sun { display: block; }
@media (prefers-color-scheme: dark) {
	:root:not([data-theme="light"]) .theme-toggle__icon--moon { display: none; }
	:root:not([data-theme="light"]) .theme-toggle__icon--sun { display: block; }
}

/* Search form */
.offer-search-form { display: block; min-width: 0; }
.offer-search-form__controls {
	position: relative;
	display: flex;
	align-items: center;
	min-width: 0;
	padding: .3rem;
	border: 2px solid var(--coupon-site-border-strong);
	border-radius: var(--coupon-site-radius-pill);
	background: var(--coupon-site-surface);
	transition: border-color .25s ease, box-shadow .3s var(--coupon-site-ease-out);
}
.offer-search-form__controls:focus-within { border-color: var(--coupon-site-outline); box-shadow: 0 0 0 4px rgb(227 168 58 / 30%); }
.offer-search-form__icon { flex: 0 0 auto; margin-left: .7rem; color: var(--coupon-site-muted); transition: color .2s ease, transform .4s var(--coupon-site-ease-spring); }
.offer-search-form__controls:focus-within .offer-search-form__icon { color: var(--coupon-site-gold-text); transform: scale(1.12) rotate(-10deg); }
.offer-search-form input[type="search"] {
	flex: 1 1 auto;
	width: 100%;
	min-width: 0;
	min-height: 40px;
	padding: .4rem .6rem;
	border: 0;
	background: transparent;
	color: var(--coupon-site-text);
	-webkit-appearance: none;
	appearance: none;
}
.offer-search-form input[type="search"]::placeholder { color: var(--coupon-site-placeholder); }
.offer-search-form input[type="search"]:focus-visible { outline: 0; }
.offer-search-form button { flex: 0 0 auto; min-height: 40px; padding-inline: 1.1rem; }

/* Homepage hero */
.home-hero,
.error-404__panel {
	position: relative;
	isolation: isolate;
	overflow: hidden;
	padding: clamp(2.25rem, 6vw, 4.5rem) var(--coupon-site-gutter);
	background: linear-gradient(135deg, var(--coupon-site-navy-dark) 0%, var(--coupon-site-navy) 65%, #1c3a66 100%);
	color: var(--coupon-site-white);
}
/* Gold light on an oversized layer, so it can drift slowly behind the content. */
.home-hero::after,
.error-404__panel::after {
	position: absolute;
	inset: -25%;
	z-index: -2;
	background:
		radial-gradient(60rem 30rem at 73% 30%, rgb(227 168 58 / 22%), transparent 60%),
		radial-gradient(40rem 30rem at 17% 83%, rgb(255 255 255 / 6%), transparent 60%);
	content: "";
}
.home-hero::before,
.error-404__panel::before {
	position: absolute;
	inset: 0;
	z-index: -1;
	background-image: radial-gradient(rgb(255 255 255 / 7%) 1px, transparent 1px);
	background-size: 22px 22px;
	content: "";
	-webkit-mask-image: linear-gradient(90deg, transparent, #000 60%);
	mask-image: linear-gradient(90deg, transparent, #000 60%);
}
.home-hero__inner { display: grid; align-items: center; gap: var(--coupon-site-space-4); }
.home-hero__content { min-width: 0; max-width: 40rem; }
.home-hero__eyebrow {
	display: inline-flex;
	align-items: center;
	gap: .5rem;
	margin: 0 0 var(--coupon-site-space-2);
	padding: .3rem .8rem;
	border: 1px solid rgb(242 189 85 / 45%);
	border-radius: var(--coupon-site-radius-pill);
	background: rgb(242 189 85 / 10%);
	color: var(--coupon-site-gold-bright);
	font-size: .75rem;
	font-weight: 800;
	letter-spacing: .12em;
	text-transform: uppercase;
}
/* A dot with a ring rippling out of it: the offers are current. */
.home-hero__eyebrow { position: relative; }
.home-hero__eyebrow::before,
.home-hero__eyebrow::after {
	flex: 0 0 auto;
	width: .45rem;
	height: .45rem;
	border-radius: 50%;
	background: var(--coupon-site-gold-bright);
	content: "";
}
.home-hero__eyebrow::after { position: absolute; top: 50%; left: .8rem; margin-top: -.225rem; opacity: 0; }
.home-hero h1 { margin: 0; color: inherit; font-size: clamp(2.2rem, 6.5vw, 3.75rem); letter-spacing: -.02em; line-height: 1.08; }
/* The last word of the headline, underlined with a gold brush stroke. */
.home-hero__accent { position: relative; display: inline-block; color: var(--coupon-site-gold-bright); }
.home-hero__accent::after {
	position: absolute;
	right: -.04em;
	bottom: -.12em;
	left: -.02em;
	z-index: -1;
	height: .3em;
	background: var(--coupon-site-swash) center / 100% 100% no-repeat;
	content: "";
	opacity: .75;
}
.home-hero__text { max-width: 34rem; margin-top: var(--coupon-site-space-2); color: #d6deea; font-size: clamp(1.02rem, 2.4vw, 1.2rem); }
.home-hero__text p { margin: 0; }
.home-hero__search { margin-top: var(--coupon-site-space-4); }
.home-hero__search .offer-search-form__controls,
.error-404__search .offer-search-form__controls { padding: .4rem; border-color: var(--coupon-site-hero-search-border); box-shadow: var(--coupon-site-shadow-lg); }
.home-hero__search .offer-search-form__controls:focus-within,
.error-404__search .offer-search-form__controls:focus-within { border-color: var(--coupon-site-gold); box-shadow: var(--coupon-site-shadow-lg), 0 0 0 4px rgb(242 189 85 / 35%); }
.home-hero__search input[type="search"],
.error-404__search input[type="search"] { min-height: 48px; font-size: 1.05rem; }
.home-hero__search button,
.error-404__search button { min-height: 48px; padding-inline: 1.6rem; font-size: 1.02rem; }
.home-hero__stores { display: flex; flex-wrap: wrap; align-items: center; gap: .5rem .6rem; margin-top: var(--coupon-site-space-3); }
.home-hero__stores-label { color: #b7c3d4; font-size: .875rem; font-weight: 600; }
.home-hero__store-list { display: flex; flex-wrap: wrap; gap: .5rem; margin: 0; padding: 0; list-style: none; }
.home-hero__store,
.error-404__link {
	display: inline-flex;
	align-items: center;
	min-height: 36px;
	padding: .3rem .85rem;
	border: 1px solid rgb(255 255 255 / 22%);
	border-radius: var(--coupon-site-radius-pill);
	background: rgb(255 255 255 / 8%);
	color: var(--coupon-site-white);
	font-size: .875rem;
	font-weight: 700;
	text-decoration: none;
	transition: background-color .2s ease, border-color .2s ease, translate .3s var(--coupon-site-ease-out);
}
.home-hero__store:hover,
.error-404__link:hover { border-color: var(--coupon-site-gold-bright); background: rgb(242 189 85 / 16%); color: var(--coupon-site-white); translate: 0 -2px; }
.home-hero__store:focus-visible,
.error-404__link:focus-visible,
.home-hero__cta:focus-visible { outline-color: var(--coupon-site-gold-bright); }
.home-hero__perks { display: flex; flex-wrap: wrap; gap: .4rem 1.25rem; margin: var(--coupon-site-space-4) 0 0; padding: 0; color: #d6deea; font-size: .9rem; font-weight: 600; list-style: none; }
.home-hero__perks li { display: inline-flex; align-items: center; gap: .4rem; }
.home-hero__perks li::before {
	flex: 0 0 auto;
	width: 1.1rem;
	height: 1.1rem;
	border-radius: 50%;
	background: var(--coupon-site-gold) var(--coupon-site-icon-check) center / 70% no-repeat;
	content: "";
}
.home-hero__art { display: none; position: relative; justify-self: center; width: min(100%, 24rem); }
.home-hero__art::before {
	position: absolute;
	inset: 6% 4% 0;
	z-index: -1;
	border-radius: 50%;
	background: radial-gradient(circle at 50% 45%, #fff6e2 0%, #f6dfaa 55%, rgb(227 168 58 / 0%) 72%);
	content: "";
}
/* A dashed ring, like a ticket perforation, turns slowly around the mascot. */
.home-hero__art::after {
	position: absolute;
	top: 53%;
	left: 50%;
	z-index: -1;
	width: 104%;
	aspect-ratio: 1;
	border: 2px dashed rgb(242 189 85 / 40%);
	border-radius: 50%;
	content: "";
	translate: -50% -50%;
}
.home-hero__mascot { width: 100%; height: auto; filter: drop-shadow(0 18px 30px rgb(0 0 0 / 30%)); }
.home-hero__sparkle {
	position: absolute;
	width: 1.15rem;
	aspect-ratio: 1;
	background: var(--coupon-site-gold-bright);
	clip-path: polygon(50% 0, 61% 39%, 100% 50%, 61% 61%, 50% 100%, 39% 61%, 0 50%, 39% 39%);
}
.home-hero__sparkle--one { top: 4%; right: 4%; }
.home-hero__sparkle--two { top: 40%; left: -2%; width: .8rem; }
.home-hero__sparkle--three { right: 0; bottom: 12%; width: .65rem; }
@media (prefers-reduced-motion: no-preference) {
	/* Entrance: the copy rises in line by line, the mascot settles in beside it. */
	.home-hero__content > * { animation: coupon-site-rise .8s var(--coupon-site-ease-out) both; }
	.home-hero__content > :nth-child(2) { animation-delay: .07s; }
	.home-hero__content > :nth-child(3) { animation-delay: .14s; }
	.home-hero__content > :nth-child(4) { animation-delay: .21s; }
	.home-hero__content > :nth-child(5) { animation-delay: .28s; }
	.home-hero__content > :nth-child(n+6) { animation-delay: .35s; }
	.home-hero__accent::after { animation: coupon-site-draw .9s var(--coupon-site-ease-in-out) .6s both; }
	.home-hero__perks li::before { animation: coupon-site-pop .5s var(--coupon-site-ease-spring) .7s both; }
	.home-hero__perks li:nth-child(2)::before { animation-delay: .82s; }
	.home-hero__perks li:nth-child(3)::before { animation-delay: .94s; }
	.home-hero__art { animation: coupon-site-arrive 1.1s var(--coupon-site-ease-out) .15s both; }
	/* Ambient motion, paused by enhance.js while the hero is off screen. */
	.home-hero::after,
	.error-404__panel::after { animation: coupon-site-aurora 24s ease-in-out infinite alternate; }
	.home-hero__eyebrow::after { animation: coupon-site-ping 2.6s ease-out infinite; }
	.home-hero__art::after { animation: coupon-site-spin 90s linear infinite; }
	.home-hero__mascot,
	.error-404__mascot { animation: coupon-site-float 7s ease-in-out 1.2s infinite; }
	.home-hero__sparkle { animation: coupon-site-twinkle 3.4s ease-in-out infinite; }
	.home-hero__sparkle--two { animation-delay: 1.2s; }
	.home-hero__sparkle--three { animation-delay: 2.3s; }
	:is(.home-hero, .error-404__panel).is-paused *,
	:is(.home-hero, .error-404__panel).is-paused *::before,
	:is(.home-hero, .error-404__panel).is-paused *::after,
	:is(.home-hero, .error-404__panel).is-paused::after { animation-play-state: paused; }
}

/* Homepage sections */
.home-top-stores,
.home-offers,
.home-categories,
.home-faq,
.how-it-works { padding: var(--coupon-site-space-6) var(--coupon-site-gutter); }
.home-top-stores,
.home-categories,
.how-it-works { --coupon-site-notch-bg: var(--coupon-site-surface-alt); background: var(--coupon-site-surface-alt); }
.home-top-stores + .home-offers,
.home-offers + .home-offers { padding-top: var(--coupon-site-space-6); }
.home-offers + .home-offers { border-top: 1px solid var(--coupon-site-border); }

.home-more { margin: var(--coupon-site-space-4) 0 0; text-align: center; }
.home-more__link:focus-visible { outline-color: var(--coupon-site-focus); }

.section-heading { max-width: 46rem; margin-bottom: var(--coupon-site-space-4); }
.section-heading__title { margin: 0; font-size: clamp(1.65rem, 4vw, 2.35rem); }
.section-heading__title::after,
.archive-header h1::after,
.search-header h1::after {
	display: block;
	width: 7.5rem;
	height: 1rem;
	margin-top: .55rem;
	background: var(--coupon-site-bowtie) left center / contain no-repeat;
	content: "";
}
.section-heading__description { margin-top: var(--coupon-site-space-2); color: var(--coupon-site-muted); }
.section-heading__description p { margin: 0; }

/* Offer cards: shared ticket look */
.offer-card-grid {
	display: grid;
	gap: var(--coupon-site-space-3);
	min-width: 0;
}
.offer-card {
	position: relative;
	display: flex;
	flex-direction: column;
	min-width: 0;
	overflow: hidden;
	border: 1px solid var(--coupon-site-border);
	border-radius: var(--coupon-site-radius-card);
	background: var(--coupon-site-surface);
	box-shadow: var(--coupon-site-shadow-sm);
	transition: box-shadow .4s var(--coupon-site-ease-out), transform .4s var(--coupon-site-ease-out), border-color .3s ease;
}
/* A gold edge draws across the top of the ticket under the pointer. */
.offer-card::before {
	position: absolute;
	top: 0;
	right: 0;
	left: 0;
	z-index: 1;
	height: 3px;
	background: linear-gradient(90deg, var(--coupon-site-gold), var(--coupon-site-gold-bright), var(--coupon-site-gold));
	content: "";
	transform: scaleX(0);
	transform-origin: left;
	transition: transform .55s var(--coupon-site-ease-out);
}
.offer-card:hover { border-color: var(--coupon-site-border-strong); box-shadow: var(--coupon-site-shadow-hover); transform: translateY(-4px); }
.offer-card:hover::before { transform: scaleX(1); }
.offer-card--inactive::before { display: none; }
.offer-card--inactive:hover { box-shadow: none; transform: none; }
.offer-card__body,
.offer-card__actions { position: relative; display: flex; flex-direction: column; min-width: 0; }
.offer-card__body { flex: 1 1 auto; padding: 1.25rem 1.25rem 1rem; }
.offer-card__actions { gap: .5rem; padding: 1.1rem 1.25rem 1.25rem; border-top: 2px dashed var(--coupon-site-border); }
/* Ticket notches where the perforation meets the card edge. */
.offer-card__actions::before,
.offer-card__actions::after {
	position: absolute;
	top: -.7rem;
	width: 1.25rem;
	height: 1.25rem;
	border: 1px solid var(--coupon-site-border);
	border-radius: 50%;
	background: var(--coupon-site-notch-bg);
	content: "";
}
.offer-card__actions::before { left: -.7rem; }
.offer-card__actions::after { right: -.7rem; }

.offer-card__store { display: flex; align-items: center; gap: .65rem; min-width: 0; text-decoration: none; }
.offer-card__store-logo,
.offer-card__store-fallback {
	flex: 0 0 auto;
	width: 4.5rem;
	height: 2.5rem;
	padding: .3rem;
	border: 1px solid var(--coupon-site-border);
	border-radius: var(--coupon-site-radius-sm);
	background: var(--coupon-site-logo-bg);
	object-fit: contain;
}
.offer-card__store-fallback {
	display: grid;
	place-items: center;
	overflow: hidden;
	background: var(--coupon-site-tint);
	color: var(--coupon-site-tint-text);
	font-size: .7rem;
	font-weight: 800;
	line-height: 1.1;
	text-align: center;
	overflow-wrap: anywhere;
}
.offer-card__store-name { min-width: 0; color: var(--coupon-site-muted); font-size: .875rem; font-weight: 700; overflow-wrap: anywhere; }
.offer-card__store:hover .offer-card__store-name { color: var(--coupon-site-heading); text-decoration: underline; }

.offer-card__badges { display: flex; flex-wrap: wrap; align-items: center; gap: .4rem; margin: .9rem 0 0; }
.offer-card__badges > span {
	display: inline-flex;
	align-items: center;
	min-height: 1.6rem;
	padding: .15rem .6rem;
	border-radius: .4rem;
	font-size: .75rem;
	font-weight: 800;
	letter-spacing: .03em;
	line-height: 1.2;
	text-transform: uppercase;
}
.offer-card__discount { margin: 0; border: 1px solid var(--coupon-site-discount-border); background: var(--coupon-site-gold-soft); color: var(--coupon-site-gold-text); }
.offer-card__badges .offer-card__discount { font-size: .85rem; }
.offer-card__type { background: var(--coupon-site-solid); color: var(--coupon-site-white); }
.offer-card--type-promotion .offer-card__type { background: var(--coupon-site-tint); color: var(--coupon-site-tint-text); }

.offer-card__title { margin: .65rem 0 .35rem; color: var(--coupon-site-heading); font-size: 1.1rem; font-weight: 800; line-height: 1.35; }
.offer-card__title a { color: inherit; text-decoration: none; }
.offer-card__title a:hover { color: var(--coupon-site-link-hover); text-decoration: underline; }
.offer-card__summary {
	display: -webkit-box;
	margin: 0;
	overflow: hidden;
	color: var(--coupon-site-muted);
	font-size: .925rem;
	line-height: 1.55;
	-webkit-box-orient: vertical;
	-webkit-line-clamp: 3;
}

.offer-card__cta { width: 100%; margin: 0; }
.offer-card__secondary-cta { width: 100%; margin: 0; }
.offer-card__store-cta::after,
.offer-card__cta:not(.offer-card__cta--code)::after {
	width: 1em;
	height: 1em;
	background: currentColor;
	content: "";
	-webkit-mask: var(--coupon-site-icon-external) center / contain no-repeat;
	mask: var(--coupon-site-icon-external) center / contain no-repeat;
}

/* "Pokaż kod" with the end of the code peeking out, as on a torn ticket. */
.offer-card__cta--code {
	position: relative;
	justify-content: flex-end;
	height: var(--coupon-site-code-slot);
	min-height: 0;
	padding: 0;
	overflow: hidden;
	border: 2px dashed var(--coupon-site-gold);
	border-radius: var(--coupon-site-radius-sm);
	background: var(--coupon-site-gold-soft);
	box-shadow: none;
}
.offer-card__cta--code:hover { background: var(--coupon-site-gold-soft); box-shadow: var(--coupon-site-glow); }
.offer-card__peek {
	padding: 0 .8rem;
	color: var(--coupon-site-heading);
	font-family: var(--coupon-site-mono);
	font-size: 1rem;
	font-weight: 800;
	letter-spacing: .08em;
}
.offer-card__cta-label {
	position: absolute;
	top: -2px;
	bottom: -2px;
	left: -2px;
	right: 3.4rem;
	display: flex;
	align-items: center;
	justify-content: center;
	border-radius: var(--coupon-site-radius-sm) 0 0 var(--coupon-site-radius-sm);
	background: var(--coupon-site-sheen) -150% 0 / 60% 100% no-repeat var(--coupon-site-gold);
	box-shadow: inset 0 -2px 0 rgb(0 0 0 / 12%);
	transition: right .35s var(--coupon-site-ease-out), background-color .2s ease;
}
.offer-card__cta-label::after {
	position: absolute;
	top: 0;
	right: -1.1rem;
	width: 1.1rem;
	height: 100%;
	background: linear-gradient(to bottom left, transparent 50%, #c98d1e 50%);
	content: "";
	clip-path: polygon(0 0, 100% 0, 0 100%);
}
/* Keyboard focus moves the label like hover does, so a reveal starts from the same place. */
.offer-card__cta--code:hover .offer-card__cta-label,
.offer-card__cta--code:focus-visible .offer-card__cta-label {
	right: 4.2rem;
	background-color: var(--coupon-site-gold-bright);
	background-position: 250% 0;
	transition: right .35s var(--coupon-site-ease-out), background-color .2s ease, background-position .8s var(--coupon-site-ease-out);
}

/* The revealed code takes exactly the slot of the "Pokaż kod" button, so the card keeps its height. */
.offer-card__code {
	position: relative;
	display: flex;
	align-items: center;
	gap: .5rem;
	height: var(--coupon-site-code-slot);
	margin: 0;
	padding: .25rem .25rem .25rem .8rem;
	border: 2px dashed var(--coupon-site-gold);
	border-radius: var(--coupon-site-radius-sm);
	background: var(--coupon-site-gold-soft);
	transition: border-color .3s ease;
}
/* The dashed box already reads as the code; the label stays for screen readers only, leaving room for long codes. */
.offer-card__code-label { position: absolute; width: 1px; height: 1px; margin: -1px; padding: 0; overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; border: 0; }
.offer-card__code code {
	flex: 1 1 auto;
	min-width: 0;
	color: var(--coupon-site-code-text);
	font-family: var(--coupon-site-mono);
	overflow: hidden;
	font-size: 1.05rem;
	font-weight: 800;
	letter-spacing: .05em;
	text-overflow: ellipsis;
	white-space: nowrap;
	user-select: all;
}
html:not(.coupon-site-js) .offer-card__cta--code { display: none; }
/* With JavaScript the code opens in the window (offer-dialog); the card keeps it for visitors without scripts. */
.coupon-site-js .offer-card__code { display: none; }
.offer-card__validity {
	display: block;
	margin: .1rem 0 0;
	color: var(--coupon-site-muted);
	font-size: .8rem;
	font-weight: 600;
	text-align: center;
}
.offer-card__validity::before {
	display: inline-block;
	margin-right: .3rem;
	vertical-align: -.15em;
	width: .95rem;
	height: .95rem;
	background: currentColor;
	content: "";
	-webkit-mask: var(--coupon-site-icon-clock) center / contain no-repeat;
	mask: var(--coupon-site-icon-clock) center / contain no-repeat;
}

.offer-card--inactive { background: var(--coupon-site-inactive-bg); box-shadow: none; }
.offer-card--inactive .offer-card__body,
.offer-card--inactive .offer-card__store { filter: grayscale(1); opacity: .72; }
.offer-card__status-label {
	align-self: flex-start;
	margin: 0 0 var(--coupon-site-space-2);
	padding: .2rem .7rem;
	border-radius: var(--coupon-site-radius-pill);
	background: var(--coupon-site-text);
	color: var(--coupon-site-surface);
	font-size: .8rem;
	font-weight: 800;
}

/* Offer card as a horizontal row (store pages, listings, search). */
.offer-list { display: grid; gap: var(--coupon-site-space-3); min-width: 0; }
.offer-card--row .offer-card__body { padding: 1.25rem 1.5rem; }
.offer-card--row .offer-card__actions { justify-content: center; padding: 1.25rem 1.5rem 1.4rem; }
.offer-card--row .offer-card__title { font-size: 1.2rem; }
.offer-card--row .offer-card__summary { -webkit-line-clamp: 4; }
.offer-card[hidden] { display: none; }

.offer-filter { display: flex; flex-wrap: wrap; gap: .5rem; margin: 0 0 var(--coupon-site-space-3); }
.offer-filter[hidden] { display: none; }
.offer-filter button {
	min-height: 40px;
	padding: .4rem 1rem;
	border: 1px solid var(--coupon-site-border-strong);
	border-radius: var(--coupon-site-radius-pill);
	background: var(--coupon-site-surface);
	color: var(--coupon-site-heading);
	cursor: pointer;
	font-size: .9rem;
	font-weight: 700;
	transition: background-color .25s ease, border-color .25s ease, color .25s ease;
}
.offer-filter button:hover { border-color: var(--coupon-site-outline); }
.offer-filter button[aria-pressed="true"] { border-color: var(--coupon-site-solid); background: var(--coupon-site-solid); color: var(--coupon-site-white); }

/* Store cards and tiles */
.store-card-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--coupon-site-space-3); }
.store-card {
	min-width: 0;
	border: 1px solid var(--coupon-site-border);
	border-radius: var(--coupon-site-radius-card);
	background: var(--coupon-site-surface);
	box-shadow: var(--coupon-site-shadow-sm);
	transition: box-shadow .4s var(--coupon-site-ease-out), border-color .3s ease, transform .4s var(--coupon-site-ease-out);
}
.store-card:hover { border-color: var(--coupon-site-gold); box-shadow: var(--coupon-site-shadow-hover); transform: translateY(-4px); }
.store-card > a { display: grid; place-items: center; gap: var(--coupon-site-space-2); min-height: 10.5rem; padding: var(--coupon-site-space-4) var(--coupon-site-space-3); text-align: center; text-decoration: none; }
.store-card__logo { width: 100%; max-width: 10rem; height: 4.5rem; padding: var(--coupon-site-logo-plate-pad); border-radius: var(--coupon-site-logo-plate-radius); background: var(--coupon-site-logo-plate); object-fit: contain; transition: transform .5s var(--coupon-site-ease-out); }
.store-card__fallback { display: grid; place-items: center; width: 4.5rem; height: 4.5rem; border-radius: 50%; background: var(--coupon-site-tint); color: var(--coupon-site-tint-text); font-size: 1.4rem; font-weight: 800; transition: transform .5s var(--coupon-site-ease-spring); }
.store-card:hover .store-card__logo,
.store-card:hover .store-card__fallback { transform: scale(1.06); }
.store-card h2 { margin: 0; font-family: var(--coupon-site-sans); font-size: 1rem; font-weight: 800; }

.store-search { max-width: 38rem; margin-block: var(--coupon-site-space-3); }
.store-search label { display: block; margin-bottom: .35rem; font-weight: 800; }
.store-search div { display: flex; gap: .3rem; padding: .3rem; border: 2px solid var(--coupon-site-border-strong); border-radius: var(--coupon-site-radius-pill); background: var(--coupon-site-surface); transition: border-color .25s ease, box-shadow .3s var(--coupon-site-ease-out); }
.store-search div:focus-within { border-color: var(--coupon-site-outline); box-shadow: 0 0 0 4px rgb(227 168 58 / 30%); }
.store-search input { flex: 1 1 auto; min-width: 0; min-height: 40px; padding: .4rem .8rem; border: 0; background: transparent; color: var(--coupon-site-text); }
.store-search input:focus-visible { outline: 0; }
.store-search button { min-height: 40px; }

.breadcrumbs ol { display: flex; flex-wrap: wrap; gap: .35rem; margin: 0 0 var(--coupon-site-space-3); padding: 0; list-style: none; color: var(--coupon-site-muted); font-size: .875rem; }
/* The underline rises into place on hover (also in the footer). */
.breadcrumbs a {
	color: var(--coupon-site-muted);
	text-decoration: underline;
	text-decoration-color: transparent;
	text-underline-offset: .45em;
	transition: color .2s ease, text-decoration-color .2s ease, text-underline-offset .3s var(--coupon-site-ease-out);
}
.breadcrumbs a:hover { color: var(--coupon-site-heading); text-decoration-color: currentColor; text-underline-offset: .2em; }
.breadcrumbs li + li::before { margin-right: .35rem; color: var(--coupon-site-border-strong); content: "›"; }

.store-detail section,
.offer-detail section { margin-top: var(--coupon-site-space-5); }
.store-detail section > h2,
.offer-detail section > h2,
.store-current-offers > h2,
.expired-offers > h2 { margin: 0 0 var(--coupon-site-space-3); font-size: clamp(1.4rem, 3vw, 1.75rem); }
.store-detail__header {
	display: grid;
	grid-template-columns: auto minmax(0, 1fr);
	align-items: center;
	gap: var(--coupon-site-space-3) var(--coupon-site-space-4);
	padding: clamp(1.1rem, 3vw, 1.75rem);
	border: 1px solid var(--coupon-site-border);
	border-radius: var(--coupon-site-radius-card);
	background: radial-gradient(32rem 14rem at 100% 0%, rgb(227 168 58 / 13%), transparent 70%) var(--coupon-site-surface);
	box-shadow: var(--coupon-site-shadow-sm);
}
.store-detail__logo { display: grid; place-items: center; width: clamp(5.5rem, 18vw, 9rem); aspect-ratio: 3 / 2; padding: .6rem; border: 1px solid var(--coupon-site-border); border-radius: var(--coupon-site-radius-sm); background: var(--coupon-site-logo-bg); }
.store-detail__logo img { width: 100%; height: 100%; object-fit: contain; }
.store-detail__intro { min-width: 0; }
.store-detail__header h1 { margin: 0; font-size: clamp(1.45rem, 3.6vw, 2.25rem); }
.store-detail__howto,
.store-detail__description {
	padding: clamp(1.1rem, 3vw, 1.75rem);
	border: 1px solid var(--coupon-site-border);
	border-radius: var(--coupon-site-radius-card);
	background: var(--coupon-site-surface);
}
.store-detail__howto p { margin: 0; }
.expired-offers .text-link-button { margin-top: var(--coupon-site-space-3); }

.offer-detail > header {
	padding: clamp(1.1rem, 3vw, 1.75rem);
	border: 1px solid var(--coupon-site-border);
	border-radius: var(--coupon-site-radius-card);
	background: radial-gradient(32rem 14rem at 100% 0%, rgb(227 168 58 / 13%), transparent 70%) var(--coupon-site-surface);
}
.offer-detail > header p:first-child { margin: 0 0 .35rem; font-weight: 700; }
.offer-detail > header h1 { margin: 0; font-size: clamp(1.5rem, 3.6vw, 2.25rem); }
.offer-detail > header .offer-card__validity { margin-top: .6rem; text-align: left; }
.offer-detail > .entry-content { margin-top: var(--coupon-site-space-3); }
.offer-detail > .offer-card { max-width: 30rem; margin-top: var(--coupon-site-space-4); }
section.search-results + section.search-results { margin-top: var(--coupon-site-space-5); }

.category-tile-list {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: var(--coupon-site-space-2);
	margin: 0;
	padding: 0;
	list-style: none;
}
.category-tile {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: .75rem;
	height: 100%;
	min-height: 4.5rem;
	padding: var(--coupon-site-space-3) var(--coupon-site-space-3) var(--coupon-site-space-3) 1.15rem;
	border: 1px solid var(--coupon-site-border);
	border-radius: var(--coupon-site-radius-card);
	/* A soft gold wash slides in from the left on hover. */
	background: linear-gradient(90deg, var(--coupon-site-gold-soft), transparent) left / 0 100% no-repeat var(--coupon-site-surface);
	box-shadow: var(--coupon-site-shadow-sm);
	color: var(--coupon-site-heading);
	font-size: 1rem;
	font-weight: 800;
	line-height: 1.3;
	text-decoration: none;
	overflow-wrap: anywhere;
	transition: border-color .3s ease, box-shadow .4s var(--coupon-site-ease-out), transform .4s var(--coupon-site-ease-out), background-size .6s var(--coupon-site-ease-out);
}
.category-tile::after {
	flex: 0 0 auto;
	width: 2rem;
	height: 2rem;
	border-radius: 50%;
	background: var(--coupon-site-arrow-bg) var(--coupon-site-icon-arrow) center / 1rem no-repeat;
	content: "";
	transition: background-color .25s ease, transform .45s var(--coupon-site-ease-spring);
}
.category-tile:hover { border-color: var(--coupon-site-gold); background-size: 100% 100%; box-shadow: var(--coupon-site-shadow-hover); color: var(--coupon-site-heading); transform: translateY(-4px); }
.category-tile:hover::after { background-color: var(--coupon-site-gold); transform: translateX(4px); }
.category-tile:focus-visible { outline-color: var(--coupon-site-focus); }
.home-categories .category-tile { background-color: var(--coupon-site-bg); box-shadow: none; }

.store-tile-list {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: var(--coupon-site-space-2);
	margin: 0;
	padding: 0;
	list-style: none;
}
.store-tile-list > li { min-width: 0; }
.store-tile {
	display: flex;
	align-items: center;
	justify-content: center;
	height: 100%;
	min-height: 5.5rem;
	padding: var(--coupon-site-space-3);
	border: 1px solid var(--coupon-site-border);
	border-radius: var(--coupon-site-radius-card);
	background: var(--coupon-site-surface);
	box-shadow: var(--coupon-site-shadow-sm);
	color: var(--coupon-site-heading);
	text-align: center;
	text-decoration: none;
	transition: border-color .3s ease, box-shadow .4s var(--coupon-site-ease-out), transform .4s var(--coupon-site-ease-out);
}
.store-tile:hover { border-color: var(--coupon-site-gold); box-shadow: var(--coupon-site-shadow-hover); transform: translateY(-4px); }
.store-tile:focus-visible { outline-color: var(--coupon-site-focus); }
.store-tile__logo { width: 100%; max-width: 8.5rem; height: 3.25rem; padding: var(--coupon-site-logo-plate-pad); border-radius: var(--coupon-site-logo-plate-radius); background: var(--coupon-site-logo-plate); object-fit: contain; transition: transform .5s var(--coupon-site-ease-out); }
.store-tile__name { font-size: 1rem; font-weight: 800; overflow-wrap: anywhere; transition: transform .5s var(--coupon-site-ease-out); }
.store-tile:hover .store-tile__logo,
.store-tile:hover .store-tile__name { transform: scale(1.06); }
.store-tile--name { background: var(--coupon-site-tint); }

/* FAQ, steps, newsletter */
.faq-list { display: grid; gap: var(--coupon-site-space-2); max-width: 52rem; }
.faq-list__item { padding: var(--coupon-site-space-3) var(--coupon-site-space-4); border: 1px solid var(--coupon-site-border); border-left: 4px solid var(--coupon-site-gold); border-radius: var(--coupon-site-radius-sm); background: var(--coupon-site-surface); }
.faq-list__question { margin: 0 0 .35rem; font-size: 1.05rem; font-weight: 800; }
.faq-list__answer { margin: 0; color: var(--coupon-site-muted); overflow-wrap: anywhere; }
/* enhance.js turns each question into a disclosure button; the answer slides open below it. */
.faq-list--enhanced .faq-list__item { padding: 0; transition: border-color .3s ease, box-shadow .4s var(--coupon-site-ease-out); }
.faq-list--enhanced .faq-list__item:hover,
.faq-list--enhanced .faq-list__item.is-open { border-color: var(--coupon-site-gold); box-shadow: var(--coupon-site-shadow-sm); }
.faq-list--enhanced .faq-list__question { margin: 0; }
.faq-list__toggle {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: var(--coupon-site-space-3);
	width: 100%;
	min-height: 44px;
	padding: var(--coupon-site-space-3) var(--coupon-site-space-3) var(--coupon-site-space-3) var(--coupon-site-space-4);
	border: 0;
	border-radius: var(--coupon-site-radius-sm);
	background: none;
	color: var(--coupon-site-heading);
	cursor: pointer;
	font: inherit;
	line-height: 1.35;
	text-align: left;
}
.faq-list__toggle:focus-visible { outline-offset: -3px; }
.faq-list__icon {
	position: relative;
	flex: 0 0 auto;
	width: 2rem;
	height: 2rem;
	border-radius: 50%;
	background: var(--coupon-site-gold-soft);
	color: var(--coupon-site-gold-text);
	transition: background-color .25s ease, color .25s ease, rotate .45s var(--coupon-site-ease-out);
}
.faq-list__icon::before,
.faq-list__icon::after {
	position: absolute;
	top: 50%;
	left: 50%;
	width: .8rem;
	height: 2px;
	margin: -1px 0 0 -.4rem;
	border-radius: 2px;
	background: currentColor;
	content: "";
	transition: transform .4s var(--coupon-site-ease-out);
}
.faq-list__icon::after { transform: rotate(90deg); }
.faq-list__toggle:hover .faq-list__icon,
.faq-list__toggle[aria-expanded="true"] .faq-list__icon { background: var(--coupon-site-gold); color: var(--coupon-site-navy-dark); }
/* Plus turns into minus. */
.faq-list__toggle[aria-expanded="true"] .faq-list__icon { rotate: 180deg; }
.faq-list__toggle[aria-expanded="true"] .faq-list__icon::after { transform: rotate(0deg); }
.faq-list--enhanced .faq-list__panel {
	display: grid;
	grid-template-rows: 0fr;
	visibility: hidden;
	transition: grid-template-rows .45s var(--coupon-site-ease-out), visibility 0s linear .45s;
}
.faq-list--enhanced .is-open .faq-list__panel { grid-template-rows: 1fr; visibility: visible; transition: grid-template-rows .45s var(--coupon-site-ease-out), visibility 0s; }
.faq-list__panel-inner { min-height: 0; overflow: hidden; }
.faq-list--enhanced .faq-list__answer { padding: 0 var(--coupon-site-space-4) var(--coupon-site-space-3); }

.how-it-works__steps { display: grid; gap: var(--coupon-site-space-3); margin: 0; padding: 0; list-style: none; counter-reset: steps; }
.how-it-works__step {
	position: relative;
	min-width: 0;
	padding: 4.5rem var(--coupon-site-space-4) var(--coupon-site-space-4);
	border: 1px solid var(--coupon-site-border);
	border-radius: var(--coupon-site-radius-card);
	background: var(--coupon-site-bg);
	counter-increment: steps;
}
.how-it-works__step::before {
	position: absolute;
	top: var(--coupon-site-space-4);
	left: var(--coupon-site-space-4);
	display: grid;
	place-items: center;
	width: 2.5rem;
	height: 2.5rem;
	border-radius: 50%;
	background: var(--coupon-site-solid);
	box-shadow: 0 0 0 4px var(--coupon-site-gold-soft);
	color: var(--coupon-site-gold-bright);
	content: counter(steps);
	font-family: var(--coupon-site-serif);
	font-size: 1.15rem;
	font-weight: 700;
}
/* Gold arrows lead from step to step: down when stacked, right when side by side. */
.how-it-works__step:not(:last-child)::after {
	position: absolute;
	bottom: -1.5rem;
	left: 50%;
	z-index: 1;
	width: 2rem;
	height: 2rem;
	border-radius: 50%;
	background: var(--coupon-site-gold) var(--coupon-site-icon-arrow) center / 1rem no-repeat;
	box-shadow: 0 0 0 4px var(--coupon-site-surface-alt);
	content: "";
	rotate: 90deg;
	translate: -50% 0;
}
.how-it-works__step h3 { margin: 0 0 var(--coupon-site-space-1); font-size: 1.15rem; font-weight: 800; }
.how-it-works__step p { margin: 0; color: var(--coupon-site-muted); }

.newsletter-teaser {
	position: relative;
	display: grid;
	gap: var(--coupon-site-space-4);
	margin: var(--coupon-site-space-6) var(--coupon-site-gutter);
	padding: clamp(1.75rem, 5vw, 3rem);
	overflow: hidden;
	isolation: isolate;
	border-radius: calc(var(--coupon-site-radius-card) * 1.25);
	background: linear-gradient(135deg, var(--coupon-site-navy-dark), var(--coupon-site-navy));
	box-shadow: var(--coupon-site-shadow);
	color: var(--coupon-site-white);
}
/* The same drifting gold light as the hero. */
.newsletter-teaser::before {
	position: absolute;
	inset: -30%;
	z-index: -1;
	background: radial-gradient(30rem 16rem at 81% 19%, rgb(227 168 58 / 25%), transparent 70%);
	content: "";
}
@media (prefers-reduced-motion: no-preference) {
	.newsletter-teaser::before { animation: coupon-site-aurora 20s ease-in-out infinite alternate; }
	.newsletter-teaser.is-paused::before { animation-play-state: paused; }
}
.newsletter-teaser .section-heading { margin-bottom: var(--coupon-site-space-2); }
.newsletter-teaser .section-heading__title { color: var(--coupon-site-gold-bright); }
.newsletter-teaser .section-heading__title::after { background-image: var(--coupon-site-bowtie-on-navy); }
.newsletter-teaser__text { max-width: 40rem; color: #dbe3ee; }
.newsletter-teaser__text p { margin: 0; }
.newsletter-teaser__mockup { min-width: 0; }
.newsletter-teaser__mockup label { display: block; margin-bottom: var(--coupon-site-space-1); color: var(--coupon-site-white); font-weight: 700; }
.newsletter-teaser__controls { display: grid; gap: var(--coupon-site-space-2); }
.newsletter-teaser__controls input,
.newsletter-teaser__controls button {
	width: 100%;
	min-width: 0;
	min-height: 48px;
	padding: .65rem 1rem;
	border: 1px solid rgb(255 255 255 / 30%);
	border-radius: var(--coupon-site-radius-pill);
}
.newsletter-teaser__controls input:disabled { background: rgb(255 255 255 / 92%); color: #4b5868; opacity: 1; }
.newsletter-teaser__controls button:disabled { border-color: transparent; background: #d9ae5c; color: #3d2c0f; cursor: not-allowed; opacity: 1; font-weight: 800; }

.empty-state {
	padding: var(--coupon-site-space-5) var(--coupon-site-space-4) var(--coupon-site-space-5) clamp(var(--coupon-site-space-4), 18vw, 9.5rem);
	border: 1px solid var(--coupon-site-border);
	border-radius: var(--coupon-site-radius-card);
	background: var(--coupon-site-surface) url("../images/mascot.webp") left clamp(.75rem, 3vw, 1.5rem) center / clamp(0px, 14vw, 7rem) auto no-repeat;
	box-shadow: var(--coupon-site-shadow-sm);
}
.empty-state__title { margin: 0; font-size: clamp(1.4rem, 4vw, 2rem); }
.empty-state__message { color: var(--coupon-site-muted); }
.empty-state__message p { margin: .5rem 0 0; }

/* 404: the homepage hero look with a big gold code and the mascot. */
.error-404 { max-width: 64rem; margin-inline: auto; }
.error-404__panel {
	display: grid;
	align-items: center;
	gap: var(--coupon-site-space-4);
	padding: clamp(1.75rem, 5vw, 3.5rem);
	border-radius: calc(var(--coupon-site-radius-card) * 1.25);
	box-shadow: var(--coupon-site-shadow);
}
.error-404__content { min-width: 0; }
.error-404 h1 { margin: 0; color: inherit; font-size: clamp(2rem, 5.5vw, 3.1rem); line-height: 1.1; }
.error-404__text { max-width: 34rem; margin: var(--coupon-site-space-2) 0 0; color: #d6deea; font-size: clamp(1rem, 2.2vw, 1.12rem); }
.error-404__search { margin-top: var(--coupon-site-space-4); }
.error-404__links { display: flex; flex-wrap: wrap; gap: .5rem; margin: var(--coupon-site-space-3) 0 0; padding: 0; list-style: none; }
.error-404__link { min-height: 40px; }
.error-404__art { display: flex; align-items: center; justify-content: center; gap: var(--coupon-site-space-2); order: -1; }
/* Gold lettering with a slow glint passing over it. */
.error-404__code {
	background: linear-gradient(110deg, var(--coupon-site-gold) 30%, #fff1d6 45%, var(--coupon-site-gold-bright) 55%, var(--coupon-site-gold) 70%) 100% 0 / 300% 100%;
	-webkit-background-clip: text;
	background-clip: text;
	color: var(--coupon-site-gold-bright);
	filter: drop-shadow(0 6px 20px rgb(0 0 0 / 30%));
	font-family: var(--coupon-site-serif);
	font-size: clamp(4.5rem, 16vw, 8.5rem);
	font-weight: 700;
	letter-spacing: -.04em;
	line-height: 1;
	-webkit-text-fill-color: transparent;
}
@media (prefers-reduced-motion: no-preference) {
	.error-404__code { animation: coupon-site-glint 7s ease-in-out 1s infinite; }
}
@media (forced-colors: active) {
	.error-404__code { background: none; -webkit-text-fill-color: currentColor; }
}
.error-404__mascot { width: clamp(5.5rem, 20vw, 10rem); height: auto; filter: drop-shadow(0 14px 24px rgb(0 0 0 / 30%)); }
.error-404__stores { margin-top: var(--coupon-site-space-6); }

.search-header { margin-bottom: var(--coupon-site-space-4); }
.search-header h1 { margin: 0 0 var(--coupon-site-space-3); font-size: clamp(1.9rem, 4.5vw, 2.75rem); }
section.search-results > h2 { margin: 0 0 var(--coupon-site-space-3); font-size: clamp(1.4rem, 3vw, 1.85rem); }
.search-header .offer-search-form { max-width: 40rem; }
section.search-results .offer-card-grid,
section.search-results .offer-list { margin-top: var(--coupon-site-space-3); }
.site-main--search > .home-categories { margin-top: var(--coupon-site-space-5); padding: 0; background: none; }
.site-main--search > p { margin-block: var(--coupon-site-space-3); }

.nav-links { display: flex; flex-wrap: wrap; justify-content: center; gap: .4rem; margin-top: var(--coupon-site-space-5); }
.nav-links a,
.nav-links .current,
.nav-links .dots {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-width: 44px;
	min-height: 44px;
	padding: .4rem .8rem;
	border: 1px solid var(--coupon-site-border);
	border-radius: var(--coupon-site-radius-pill);
	background: var(--coupon-site-surface);
	font-weight: 700;
	text-decoration: none;
	transition: border-color .25s ease, color .25s ease, translate .35s var(--coupon-site-ease-out);
}
.nav-links .dots { border-color: transparent; background: none; }
.nav-links a:hover { border-color: var(--coupon-site-outline); color: var(--coupon-site-heading); translate: 0 -2px; }
.nav-links .current { border-color: var(--coupon-site-solid); background: var(--coupon-site-solid); color: var(--coupon-site-white); }

/* Footer */
.site-footer {
	position: relative;
	margin-top: var(--coupon-site-space-6);
	padding: var(--coupon-site-space-6) var(--coupon-site-gutter) var(--coupon-site-space-4);
	border-top: 4px solid var(--coupon-site-gold);
	background: var(--coupon-site-navy-dark);
	color: #dbe3ee;
}
/* A bow-tie medallion pinned to the middle of the gold border. */
.site-footer::before {
	position: absolute;
	top: 0;
	left: 50%;
	width: 3.25rem;
	height: 3.25rem;
	border: 3px solid var(--coupon-site-gold);
	border-radius: 50%;
	background: var(--coupon-site-bow-gold) center / 60% auto no-repeat var(--coupon-site-navy-dark);
	content: "";
	translate: -50% calc(-50% - 2px);
}
.site-main--home + .site-footer { margin-top: 0; }
.site-footer__inner { display: grid; gap: var(--coupon-site-space-5); }
.site-footer__brand { justify-self: start; max-width: 22rem; }
.site-footer .site-branding__wordmark { color: var(--coupon-site-white); }
.site-footer .site-branding__tagline { color: #9fb0c6; }
.site-footer .site-branding__mascot { width: 4.25rem; }
.site-footer .site-branding__link:focus-visible { outline-color: var(--coupon-site-gold); }
.site-footer__about { margin: var(--coupon-site-space-3) 0 0; color: #b7c3d4; font-size: .925rem; }
.site-footer__menus { display: grid; grid-template-columns: repeat(auto-fit, minmax(10rem, 1fr)); gap: var(--coupon-site-space-4); }
.site-footer__heading { margin: 0 0 var(--coupon-site-space-1); color: var(--coupon-site-gold-bright); font-family: var(--coupon-site-sans); font-size: .8rem; font-weight: 800; letter-spacing: .12em; text-transform: uppercase; }
.footer-navigation__menu,
.footer-navigation__menu ul { margin: 0; padding: 0; list-style: none; }
.footer-navigation__menu ul { padding-left: var(--coupon-site-space-3); }
.footer-navigation__menu a {
	display: flex;
	align-items: center;
	min-height: 40px;
	padding-block: .25rem;
	color: #e7edf5;
	font-weight: 600;
	line-height: 1.35;
	text-decoration: underline;
	text-decoration-color: transparent;
	text-underline-offset: .45em;
	overflow-wrap: anywhere;
	transition: color .2s ease, text-decoration-color .2s ease, text-underline-offset .3s var(--coupon-site-ease-out);
}
.footer-navigation__menu a:hover { color: var(--coupon-site-gold-bright); text-decoration-color: currentColor; text-underline-offset: .2em; }
.footer-navigation__menu a:focus-visible { outline-color: var(--coupon-site-gold); }
.site-footer__social { display: flex; flex-wrap: wrap; gap: var(--coupon-site-space-2); margin: 0; padding: 0; list-style: none; }
.site-footer__social-link { display: inline-flex; align-items: center; justify-content: center; width: 44px; height: 44px; border-radius: 50%; background: rgb(255 255 255 / 10%); color: var(--coupon-site-white); transition: background-color .2s ease, color .2s ease, translate .35s var(--coupon-site-ease-spring); }
.site-footer__social-link:hover { background: var(--coupon-site-gold); color: var(--coupon-site-navy-dark); translate: 0 -3px; }
.site-footer__social-link:focus-visible { outline-color: var(--coupon-site-gold); }
.site-footer__copyright { margin: 0; padding-top: var(--coupon-site-space-3); border-top: 1px solid rgb(255 255 255 / 14%); color: #9fb0c6; font-size: .875rem; }

/* Catalog filters and popular stores column */
.catalog-filters {
	display: grid;
	gap: var(--coupon-site-space-2);
	margin-bottom: var(--coupon-site-space-4);
	padding: var(--coupon-site-space-3);
	border: 1px solid var(--coupon-site-border);
	border-radius: var(--coupon-site-radius-card);
	background: var(--coupon-site-surface);
	box-shadow: var(--coupon-site-shadow-sm);
}
.catalog-filters__field { display: grid; gap: .3rem; min-width: 0; }
.catalog-filters label { color: var(--coupon-site-muted); font-size: .8rem; font-weight: 800; letter-spacing: .04em; text-transform: uppercase; }
.catalog-filters select {
	width: 100%;
	min-height: 44px;
	padding: .5rem 2.25rem .5rem .8rem;
	border: 1px solid var(--coupon-site-border-strong);
	border-radius: var(--coupon-site-radius-sm);
	background: var(--coupon-site-surface) var(--coupon-site-chevron) right .7rem center / 1rem no-repeat;
	color: var(--coupon-site-text);
	-webkit-appearance: none;
	appearance: none;
	transition: border-color .2s ease;
}
.catalog-filters select:hover { border-color: var(--coupon-site-outline); }
.catalog-filters__actions { display: flex; flex-wrap: wrap; align-items: center; gap: var(--coupon-site-space-3); }
.catalog-filters__actions button { min-width: 7rem; }
.catalog-filters__reset { display: inline-flex; align-items: center; min-height: 44px; color: var(--coupon-site-muted); font-weight: 700; }

.site-main--with-sidebar { width: min(calc(100% - 2rem), var(--coupon-site-wide)); }
.site-main__content { min-width: 0; }
.popular-stores { min-width: 0; margin-top: var(--coupon-site-space-6); padding: var(--coupon-site-space-4); border: 1px solid var(--coupon-site-border); border-radius: var(--coupon-site-radius-card); background: var(--coupon-site-surface); box-shadow: var(--coupon-site-shadow-sm); }
.popular-stores__title { margin: 0 0 var(--coupon-site-space-3); font-size: 1.3rem; }
.popular-stores .store-tile-list { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--coupon-site-space-2); }
.popular-stores .store-tile { min-height: 4.5rem; padding: var(--coupon-site-space-2); box-shadow: none; }

/* Blog: list header, category chips and post cards */
/* Author initials in a navy medallion, instead of a third-party avatar. */
.author-badge {
	display: inline-grid;
	flex: 0 0 auto;
	place-items: center;
	border-radius: 50%;
	background: linear-gradient(135deg, var(--coupon-site-navy-dark), var(--coupon-site-navy));
	box-shadow: 0 0 0 3px var(--coupon-site-gold-soft), inset 0 0 0 1px rgb(242 189 85 / 45%);
	color: var(--coupon-site-gold-bright);
	font-family: var(--coupon-site-serif);
	font-weight: 600;
	letter-spacing: .02em;
	line-height: 1;
}
.blog-header { display: grid; grid-template-columns: minmax(0, 1fr); gap: var(--coupon-site-space-3); align-items: end; }
.blog-header__intro { min-width: 0; }
.blog-header__eyebrow { margin: 0 0 .35rem; color: var(--coupon-site-gold-text); font-size: .75rem; font-weight: 800; letter-spacing: .14em; text-transform: uppercase; }
.blog-header__avatar { width: 4.5rem; height: 4.5rem; margin-bottom: var(--coupon-site-space-2); font-size: 1.6rem; }
.blog-search { width: 100%; max-width: 26rem; }
.blog-search__controls {
	display: flex;
	align-items: center;
	gap: .3rem;
	padding: .3rem;
	border: 2px solid var(--coupon-site-border-strong);
	border-radius: var(--coupon-site-radius-pill);
	background: var(--coupon-site-surface);
	transition: border-color .25s ease, box-shadow .3s var(--coupon-site-ease-out);
}
.blog-search__controls:focus-within { border-color: var(--coupon-site-outline); box-shadow: 0 0 0 4px rgb(227 168 58 / 30%); }
.blog-search__icon { flex: 0 0 auto; margin-left: .6rem; color: var(--coupon-site-muted); }
.blog-search input[type="search"] { flex: 1 1 auto; min-width: 0; min-height: 40px; padding: .4rem .5rem; border: 0; background: transparent; color: var(--coupon-site-text); -webkit-appearance: none; appearance: none; }
.blog-search input[type="search"]::placeholder { color: var(--coupon-site-placeholder); }
.blog-search input[type="search"]:focus-visible { outline: 0; }
.blog-search button { flex: 0 0 auto; min-height: 40px; }
.search-header .blog-search { max-width: 40rem; }

.blog-categories { margin: 0 0 var(--coupon-site-space-4); }
.blog-categories__list { display: flex; flex-wrap: wrap; gap: .5rem; margin: 0; padding: 0; list-style: none; }
.blog-categories__link {
	display: inline-flex;
	align-items: center;
	min-height: 40px;
	padding: .4rem 1rem;
	border: 1px solid var(--coupon-site-border-strong);
	border-radius: var(--coupon-site-radius-pill);
	background: var(--coupon-site-surface);
	color: var(--coupon-site-heading);
	font-size: .9rem;
	font-weight: 700;
	text-decoration: none;
	transition: background-color .25s ease, border-color .25s ease, color .25s ease, translate .3s var(--coupon-site-ease-out);
}
.blog-categories__link:hover { border-color: var(--coupon-site-gold); color: var(--coupon-site-heading); translate: 0 -2px; }
.blog-categories__link[aria-current="page"] { border-color: var(--coupon-site-solid); background: var(--coupon-site-solid); color: var(--coupon-site-white); }

.post-grid { display: grid; gap: var(--coupon-site-space-4); min-width: 0; }
.post-card {
	position: relative;
	display: flex;
	flex-direction: column;
	min-width: 0;
	overflow: hidden;
	border: 1px solid var(--coupon-site-border);
	border-radius: var(--coupon-site-radius-card);
	background: var(--coupon-site-surface);
	box-shadow: var(--coupon-site-shadow-sm);
	transition: box-shadow .4s var(--coupon-site-ease-out), transform .4s var(--coupon-site-ease-out), border-color .3s ease;
}
/* The same gold edge as the coupon tickets draws across the top on hover. */
.post-card::before {
	position: absolute;
	top: 0;
	right: 0;
	left: 0;
	z-index: 2;
	height: 3px;
	background: linear-gradient(90deg, var(--coupon-site-gold), var(--coupon-site-gold-bright), var(--coupon-site-gold));
	content: "";
	transform: scaleX(0);
	transform-origin: left;
	transition: transform .55s var(--coupon-site-ease-out);
}
.post-card:hover { border-color: var(--coupon-site-border-strong); box-shadow: var(--coupon-site-shadow-hover); transform: translateY(-4px); }
.post-card:hover::before { transform: scaleX(1); }
.post-card__media { position: relative; aspect-ratio: 16 / 9; overflow: hidden; background: var(--coupon-site-tint); }
.post-card__image { width: 100%; height: 100%; object-fit: cover; transition: transform .8s var(--coupon-site-ease-out); }
.post-card:hover .post-card__image { transform: scale(1.05); }
/* Posts without a featured image get a navy plate with the bow tie. */
.post-card__placeholder {
	display: block;
	width: 100%;
	height: 100%;
	background:
		var(--coupon-site-bowtie-on-navy) center / 8.5rem auto no-repeat,
		radial-gradient(rgb(255 255 255 / 8%) 1px, transparent 1px) 0 0 / 18px 18px,
		linear-gradient(135deg, var(--coupon-site-navy-dark), var(--coupon-site-navy) 60%, #1c3a66);
}
.post-card__body { display: flex; flex: 1 1 auto; flex-direction: column; align-items: flex-start; gap: .55rem; padding: 1.2rem 1.35rem 1.3rem; }
.post-card__category {
	position: relative;
	z-index: 2;
	display: inline-flex;
	align-items: center;
	min-height: 1.75rem;
	padding: .15rem .65rem;
	border-radius: var(--coupon-site-radius-pill);
	background: var(--coupon-site-gold-soft);
	color: var(--coupon-site-gold-text);
	font-size: .72rem;
	font-weight: 800;
	letter-spacing: .06em;
	text-decoration: none;
	text-transform: uppercase;
	transition: background-color .2s ease, color .2s ease;
}
.post-card__category:hover { background: var(--coupon-site-gold); color: var(--coupon-site-navy-dark); }
.post-card__title { margin: 0; font-family: var(--coupon-site-serif); font-size: 1.3rem; font-weight: 600; letter-spacing: -.01em; line-height: 1.25; }
.post-card__title a { color: var(--coupon-site-heading); text-decoration: none; transition: color .2s ease; }
/* The title link covers the whole card. */
.post-card__title a::after { position: absolute; inset: 0; z-index: 1; content: ""; }
.post-card:hover .post-card__title a { color: var(--coupon-site-link-hover); }
.post-card__excerpt {
	display: -webkit-box;
	margin: 0;
	overflow: hidden;
	color: var(--coupon-site-muted);
	font-size: .95rem;
	line-height: 1.6;
	-webkit-box-orient: vertical;
	-webkit-line-clamp: 3;
}
.post-card__meta { display: flex; flex-wrap: wrap; align-items: center; gap: .3rem 1rem; margin: auto 0 0; padding-top: .3rem; color: var(--coupon-site-muted); font-size: .8rem; font-weight: 600; }
.post-card__reading::before,
.article__reading::before {
	display: inline-block;
	width: .95rem;
	height: .95rem;
	margin-right: .3rem;
	background: currentColor;
	content: "";
	vertical-align: -.15em;
	-webkit-mask: var(--coupon-site-icon-clock) center / contain no-repeat;
	mask: var(--coupon-site-icon-clock) center / contain no-repeat;
}
.post-card__more { display: inline-flex; align-items: center; gap: .45rem; margin-top: .35rem; color: var(--coupon-site-heading); font-weight: 800; }
.post-card__more::after {
	width: 1.05em;
	height: 1.05em;
	background: currentColor;
	content: "";
	transition: transform .35s var(--coupon-site-ease-out);
	-webkit-mask: var(--coupon-site-icon-arrow) center / contain no-repeat;
	mask: var(--coupon-site-icon-arrow) center / contain no-repeat;
}
.post-card:hover .post-card__more::after { transform: translateX(4px); }
.post-card--featured { margin-bottom: var(--coupon-site-space-4); }
.post-card--featured .post-card__title { font-size: clamp(1.6rem, 3vw, 2.3rem); line-height: 1.15; }
.post-card--featured .post-card__excerpt { font-size: 1.05rem; -webkit-line-clamp: 4; }

/* Blog article */
.reading-progress { display: none; }
@supports (animation-timeline: scroll()) {
	@media (prefers-reduced-motion: no-preference) {
		/* A gold line along the top edge fills up as the article is read. */
		.reading-progress {
			position: fixed;
			top: 0;
			right: 0;
			left: 0;
			z-index: 100;
			display: block;
			height: 3px;
			background: linear-gradient(90deg, var(--coupon-site-gold), var(--coupon-site-gold-bright));
			transform-origin: left;
			animation: coupon-site-progress linear both;
			animation-timeline: scroll(root);
		}
	}
}
.article { min-width: 0; container-type: inline-size; }
.article__header { max-width: 48rem; margin: var(--coupon-site-space-4) auto var(--coupon-site-space-5); text-align: center; }
.article__categories { display: flex; flex-wrap: wrap; justify-content: center; gap: .4rem; margin: 0 0 var(--coupon-site-space-3); }
.article__title { margin: 0; font-size: clamp(2.1rem, 5.5vw, 3.4rem); letter-spacing: -.02em; line-height: 1.1; }
.article__title::after { display: block; width: 7.5rem; height: 1rem; margin: 1rem auto 0; background: var(--coupon-site-bowtie) center / contain no-repeat; content: ""; }
.article__lead { max-width: 40rem; margin: var(--coupon-site-space-3) auto 0; color: var(--coupon-site-muted); font-size: clamp(1.08rem, 2.2vw, 1.25rem); line-height: 1.55; }
.article__meta { display: inline-flex; align-items: center; gap: .8rem; margin-top: var(--coupon-site-space-4); text-align: left; }
.article__avatar { width: 48px; height: 48px; font-size: 1.05rem; }
.article__meta-text { display: grid; gap: .1rem; min-width: 0; }
.article__author { color: var(--coupon-site-heading); font-weight: 800; text-decoration: none; }
.article__author:hover { color: var(--coupon-site-link-hover); text-decoration: underline; }
.article__facts { display: flex; flex-wrap: wrap; gap: .1rem .5rem; color: var(--coupon-site-muted); font-size: .85rem; }
.article__facts > :not(:first-child)::before { margin-right: .5rem; color: var(--coupon-site-border-strong); content: "·"; }
.article__media { max-width: 64rem; margin: 0 auto var(--coupon-site-space-5); }
.article__image { width: 100%; height: auto; max-height: 36rem; border-radius: calc(var(--coupon-site-radius-card) * 1.25); box-shadow: var(--coupon-site-shadow); object-fit: cover; }
.article__media figcaption { margin-top: .6rem; color: var(--coupon-site-muted); font-size: .85rem; text-align: center; }
.article__content { max-width: 44rem; margin-inline: auto; font-size: 1.0625rem; line-height: 1.75; }
/* Wide and full blocks reach past the reading column, measured on the article. */
.article__content > .alignwide { width: min(64rem, 100cqi); max-width: none; margin-inline: calc(50% - min(32rem, 50cqi)); }
.article__content > .alignfull { width: 100cqi; max-width: none; margin-inline: calc(50% - 50cqi); }
.article__footer { display: grid; gap: var(--coupon-site-space-4); max-width: 44rem; margin: var(--coupon-site-space-5) auto 0; }
.article__tags { display: flex; flex-wrap: wrap; gap: .5rem; margin: 0; padding: 0; list-style: none; }
.article__tag {
	display: inline-flex;
	align-items: center;
	min-height: 36px;
	padding: .25rem .8rem;
	border: 1px solid var(--coupon-site-border-strong);
	border-radius: var(--coupon-site-radius-pill);
	color: var(--coupon-site-muted);
	font-size: .85rem;
	font-weight: 700;
	text-decoration: none;
	transition: border-color .2s ease, color .2s ease;
}
.article__tag:hover { border-color: var(--coupon-site-gold); color: var(--coupon-site-heading); }
.author-box {
	display: grid;
	grid-template-columns: auto minmax(0, 1fr);
	align-items: start;
	gap: var(--coupon-site-space-3) var(--coupon-site-space-4);
	padding: clamp(1.25rem, 3vw, 1.75rem);
	border: 1px solid var(--coupon-site-border);
	border-radius: var(--coupon-site-radius-card);
	background: radial-gradient(28rem 12rem at 100% 0%, rgb(227 168 58 / 12%), transparent 70%) var(--coupon-site-surface);
	box-shadow: var(--coupon-site-shadow-sm);
}
.author-box__avatar { width: 88px; height: 88px; font-size: 1.9rem; }
.author-box__label { margin: 0; color: var(--coupon-site-gold-text); font-size: .72rem; font-weight: 800; letter-spacing: .14em; text-transform: uppercase; }
.author-box__name { margin: .15rem 0 .4rem; color: var(--coupon-site-heading); font-family: var(--coupon-site-serif); font-size: 1.35rem; font-weight: 600; }
.author-box__bio { color: var(--coupon-site-muted); }
.author-box__bio p { margin: 0 0 .6rem; }
.author-box__more { font-weight: 800; }
.post-navigation { display: grid; gap: var(--coupon-site-space-3); max-width: 64rem; margin: var(--coupon-site-space-6) auto 0; }
.post-navigation__link {
	display: grid;
	gap: .3rem;
	padding: 1.1rem 1.35rem;
	border: 1px solid var(--coupon-site-border);
	border-radius: var(--coupon-site-radius-card);
	background: var(--coupon-site-surface);
	box-shadow: var(--coupon-site-shadow-sm);
	color: var(--coupon-site-heading);
	text-decoration: none;
	transition: border-color .3s ease, box-shadow .4s var(--coupon-site-ease-out), transform .4s var(--coupon-site-ease-out);
}
.post-navigation__link:hover { border-color: var(--coupon-site-gold); box-shadow: var(--coupon-site-shadow-hover); color: var(--coupon-site-heading); transform: translateY(-3px); }
.post-navigation__label { display: inline-flex; align-items: center; gap: .4rem; color: var(--coupon-site-muted); font-size: .75rem; font-weight: 800; letter-spacing: .12em; text-transform: uppercase; }
.post-navigation__link--previous .post-navigation__label::before,
.post-navigation__link--next .post-navigation__label::after {
	width: 1rem;
	height: 1rem;
	background: currentColor;
	content: "";
	-webkit-mask: var(--coupon-site-icon-arrow) center / contain no-repeat;
	mask: var(--coupon-site-icon-arrow) center / contain no-repeat;
}
.post-navigation__link--previous .post-navigation__label::before { rotate: 180deg; }
.post-navigation__title { font-family: var(--coupon-site-serif); font-size: 1.15rem; font-weight: 600; line-height: 1.3; }
.related-posts,
.article-stores { margin-top: var(--coupon-site-space-6); }
.page-links { display: flex; flex-wrap: wrap; align-items: center; gap: .4rem; margin-top: var(--coupon-site-space-4); font-weight: 700; }
.page-links a,
.page-links > .post-page-numbers { display: inline-flex; align-items: center; justify-content: center; min-width: 40px; min-height: 40px; padding: .3rem .7rem; border: 1px solid var(--coupon-site-border); border-radius: var(--coupon-site-radius-pill); background: var(--coupon-site-surface); text-decoration: none; }
.page-links .current { border-color: var(--coupon-site-solid); background: var(--coupon-site-solid); color: var(--coupon-site-white); }

/* Editor content: core blocks in the brand's typography (articles, pages, store texts). */
.entry-content > :first-child { margin-top: 0; }
.entry-content :where(p, ul, ol, dl, figure, blockquote, table, pre, details, .wp-block-buttons) { margin-block: 0 1.25em; }
.entry-content :where(h2, h3, h4) { margin: 1.8em 0 .6em; line-height: 1.25; scroll-margin-top: 1.5rem; }
.entry-content h2 { font-size: clamp(1.55rem, 3.2vw, 1.95rem); }
.entry-content h3 { font-size: 1.3rem; font-weight: 800; }
.entry-content h4 { font-size: 1.1rem; font-weight: 800; }
.entry-content a:not(.wp-block-button__link) { color: var(--coupon-site-link); text-decoration-color: rgb(227 168 58 / 75%); text-decoration-thickness: .1em; transition: color .2s ease, text-decoration-color .2s ease; }
.entry-content a:not(.wp-block-button__link):hover { color: var(--coupon-site-link-hover); text-decoration-color: currentColor; }
.entry-content :where(ul, ol) { padding-left: 1.4em; }
.entry-content li + li { margin-top: .35em; }
.entry-content li::marker { color: var(--coupon-site-gold); font-weight: 800; }
.entry-content blockquote {
	position: relative;
	margin-inline: 0;
	padding: 1.25rem 1.5rem 1.25rem 3.4rem;
	border-left: 4px solid var(--coupon-site-gold);
	border-radius: 0 var(--coupon-site-radius-sm) var(--coupon-site-radius-sm) 0;
	background: var(--coupon-site-gold-soft);
	color: var(--coupon-site-heading);
	font-family: var(--coupon-site-serif);
	font-size: 1.2rem;
	line-height: 1.5;
}
.entry-content blockquote::before { position: absolute; top: .55rem; left: .85rem; color: var(--coupon-site-gold); content: "\201C"; font-family: var(--coupon-site-serif); font-size: 3.4rem; line-height: 1; }
.entry-content blockquote > :last-child { margin-bottom: 0; }
.entry-content cite { display: block; margin-top: .6rem; color: var(--coupon-site-muted); font-family: var(--coupon-site-sans); font-size: .85rem; font-style: normal; font-weight: 700; letter-spacing: .03em; }
.entry-content .wp-block-pullquote { margin-block: 2em; padding: 1.75rem 1rem; border-block: 3px solid var(--coupon-site-gold); border-inline: 0; text-align: center; }
.entry-content .wp-block-pullquote blockquote { margin: 0; padding: 0; border: 0; background: none; font-size: clamp(1.4rem, 3vw, 1.8rem); }
.entry-content .wp-block-pullquote blockquote::before { display: none; }
.entry-content .wp-block-pullquote p { margin: 0; font-size: inherit; line-height: 1.35; }
.entry-content img { border-radius: var(--coupon-site-radius-sm); }
.entry-content .wp-block-image { margin-block: 1.6em; }
.entry-content :where(figcaption, .wp-element-caption) { margin-top: .5rem; color: var(--coupon-site-muted); font-size: .85rem; line-height: 1.5; text-align: center; }
.entry-content .wp-block-table { overflow-x: auto; }
.entry-content table { width: 100%; border-collapse: collapse; font-size: .95rem; line-height: 1.5; }
.entry-content table th,
.entry-content table td { padding: .65rem .85rem; border: 0; border-bottom: 1px solid var(--coupon-site-border); text-align: left; }
.entry-content table thead th { border-bottom: 2px solid var(--coupon-site-gold); color: var(--coupon-site-heading); font-weight: 800; }
.entry-content table tbody tr:nth-child(odd) { background: var(--coupon-site-surface); }
.entry-content :not(pre) > code { padding: .1em .4em; border-radius: .35rem; background: var(--coupon-site-gold-soft); color: var(--coupon-site-code-text); font-family: var(--coupon-site-mono); font-size: .9em; }
.entry-content pre { overflow-x: auto; padding: 1rem 1.25rem; border: 1px solid var(--coupon-site-border); border-radius: var(--coupon-site-radius-sm); background: var(--coupon-site-navy-dark); color: #f6f0e4; font-family: var(--coupon-site-mono); font-size: .9rem; line-height: 1.6; }
.entry-content pre code { padding: 0; background: none; color: inherit; }
/* Separators are the brand's bow tie; the wide style is a gold hairline. */
.entry-content hr,
.entry-content hr.wp-block-separator { width: 7.5rem; height: 1rem; margin: 2.25em auto; border: 0; background: var(--coupon-site-bowtie) center / contain no-repeat; opacity: 1; }
.entry-content hr.wp-block-separator.is-style-wide { width: 100%; height: 1px; background: linear-gradient(90deg, transparent, var(--coupon-site-gold), transparent); }
.entry-content hr.wp-block-separator.is-style-dots { width: auto; height: auto; background: none; color: var(--coupon-site-gold); }
.entry-content .wp-block-buttons { display: flex; flex-wrap: wrap; gap: .75rem; }
.entry-content .wp-block-button__link { padding: .7rem 1.4rem; font-size: 1rem; }
.entry-content .is-style-outline .wp-block-button__link { border: 2px solid var(--coupon-site-outline); background: transparent; box-shadow: none; color: var(--coupon-site-heading); }
.entry-content details { padding: .9rem 1.2rem; border: 1px solid var(--coupon-site-border); border-left: 4px solid var(--coupon-site-gold); border-radius: var(--coupon-site-radius-sm); background: var(--coupon-site-surface); }
.entry-content details summary { display: flex; align-items: center; gap: .6rem; color: var(--coupon-site-heading); cursor: pointer; font-weight: 800; list-style: none; }
.entry-content details summary::-webkit-details-marker { display: none; }
.entry-content details summary::before { flex: 0 0 auto; width: 1.1rem; height: 1.1rem; background: var(--coupon-site-chevron) center / contain no-repeat; content: ""; rotate: -90deg; transition: rotate .3s var(--coupon-site-ease-out); }
.entry-content details[open] summary::before { rotate: 0deg; }
.entry-content details[open] summary { margin-bottom: .6rem; }
.entry-content details > :last-child { margin-bottom: 0; }
.entry-content .wp-block-embed iframe { border-radius: var(--coupon-site-radius-sm); }
.entry-content .alignleft { float: left; max-width: 50%; margin: .35em 1.5em 1em 0; }
.entry-content .alignright { float: right; max-width: 50%; margin: .35em 0 1em 1.5em; }
.entry-content .aligncenter { margin-inline: auto; }

/* Utilities */
.screen-reader-text { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; border: 0; }
.screen-reader-text:focus { z-index: 100000; top: 1rem; left: 1rem; width: auto; height: auto; padding: .75rem 1rem; margin: 0; overflow: visible; clip: auto; background: var(--coupon-site-surface); color: var(--coupon-site-text); }

/*
 * Scroll reveal. enhance.js marks content below the fold as pending, lets it rise
 * into place once it scrolls into view, then removes the attribute so the
 * element's own transitions apply again. Without JavaScript, with reduced
 * motion, or in print, nothing is hidden.
 */
@media (prefers-reduced-motion: no-preference) {
	[data-reveal] {
		transition: opacity .7s var(--coupon-site-ease-out), translate .8s var(--coupon-site-ease-out);
		transition-delay: var(--coupon-site-reveal-delay, 0s);
	}
	[data-reveal="pending"] { opacity: 0; translate: 0 1.5rem; }
	/* Headings: the bow tie unfolds from its middle once the title is in. */
	.section-heading[data-reveal] .section-heading__title::after { transition: clip-path 1s var(--coupon-site-ease-in-out) calc(var(--coupon-site-reveal-delay, 0s) + .3s); }
	.section-heading[data-reveal="pending"] .section-heading__title::after { clip-path: inset(0 50%); }
	/* Steps: the number pops in after its card. */
	.how-it-works__step[data-reveal]::before { transition: scale .6s var(--coupon-site-ease-spring) calc(var(--coupon-site-reveal-delay, 0s) + .25s); }
	.how-it-works__step[data-reveal="pending"]::before { scale: 0; }
}
@media print {
	[data-reveal] { opacity: 1 !important; translate: none !important; }
}

/* Light/dark switch: the new theme grows as a circle from the toggle (theme-toggle.js). */
:root.coupon-site-theme-switch::view-transition-old(root),
:root.coupon-site-theme-switch::view-transition-new(root) { animation: none; mix-blend-mode: normal; }
:root.coupon-site-theme-switch::view-transition-new(root) { animation: coupon-site-theme-reveal .7s var(--coupon-site-ease-in-out); }
:root.coupon-site-theme-switch .site-header,
:root.coupon-site-theme-switch .site-header .site-branding,
:root.coupon-site-theme-switch .site-header .primary-navigation,
:root.coupon-site-theme-switch .site-header .theme-toggle { view-transition-name: none; }

@keyframes coupon-site-rise { from { opacity: 0; translate: 0 1rem; } }
@keyframes coupon-site-drop { from { opacity: 0; translate: 0 -.5rem; } }
@keyframes coupon-site-arrive { from { opacity: 0; translate: 0 1.5rem; scale: .94; } }
@keyframes coupon-site-draw { from { clip-path: inset(0 100% 0 0); } to { clip-path: inset(0); } }
@keyframes coupon-site-pop { from { scale: 0; } }
@keyframes coupon-site-aurora {
	from { transform: translate3d(-4%, 3%, 0) scale(1); }
	to { transform: translate3d(4%, -3%, 0) scale(1.1); }
}
@keyframes coupon-site-ping {
	0% { opacity: .6; scale: 1; }
	75%, 100% { opacity: 0; scale: 3; }
}
@keyframes coupon-site-spin { to { rotate: 360deg; } }
@keyframes coupon-site-progress { from { transform: scaleX(0); } to { transform: scaleX(1); } }
@keyframes coupon-site-float { 50% { translate: 0 -10px; } }
@keyframes coupon-site-twinkle {
	0%, 100% { opacity: .2; rotate: 0deg; scale: .5; }
	50% { opacity: 1; rotate: 90deg; scale: 1; }
}
@keyframes coupon-site-icon-in { from { opacity: 0; rotate: -120deg; scale: .4; } }
@keyframes coupon-site-copied {
	0% { box-shadow: 0 0 0 0 rgb(29 122 75 / 55%); scale: .94; }
	35% { scale: 1.05; }
	100% { box-shadow: 0 0 0 .6rem rgb(29 122 75 / 0%); scale: 1; }
}
@keyframes coupon-site-glint {
	0% { background-position: 100% 0; }
	55%, 100% { background-position: 0% 0; }
}
@keyframes coupon-site-theme-reveal {
	from { clip-path: circle(0 at var(--coupon-site-toggle-x, 100%) var(--coupon-site-toggle-y, 0)); }
	to { clip-path: circle(var(--coupon-site-toggle-r, 150vmax) at var(--coupon-site-toggle-x, 100%) var(--coupon-site-toggle-y, 0)); }
}

/* Responsive enhancements */
@media (max-width: 29.99rem) {
	/* Icon-only menu button leaves room for the brand next to the theme toggle. */
	.primary-navigation__summary { justify-content: center; width: 44px; padding: 0; }
	.primary-navigation__summary span { position: absolute; width: 1px; height: 1px; margin: -1px; padding: 0; overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; border: 0; }
	.site-branding__mascot { width: 2.9rem; }
	.site-branding__tagline { font-size: .55rem; letter-spacing: .14em; }
	.offer-search-form button { padding-inline: .9rem; }
	.home-hero__search button,
	.error-404__search button { padding-inline: 1.1rem; }
	.empty-state { padding-left: var(--coupon-site-space-4); background-image: none; }
	.store-detail__header { grid-template-columns: minmax(0, 1fr); }
	.store-detail__logo { width: 7.5rem; }
}

@media (min-width: 30rem) {
	.newsletter-teaser__controls { grid-template-columns: minmax(0, 1fr) auto; }
	.newsletter-teaser__controls button { width: auto; min-width: 9rem; }
}

@media (min-width: 48rem) {
	.site-header__inner { padding-block: 1rem; }
	.site-branding__mascot { width: 4.25rem; }
	.newsletter-teaser { grid-template-columns: minmax(0, 1fr) minmax(18rem, .9fr); align-items: end; }
	.home-hero__inner { grid-template-columns: minmax(0, 1.35fr) minmax(0, .8fr); }
	.home-hero__art { display: block; }
	.error-404__panel { grid-template-columns: minmax(0, 1.5fr) minmax(0, 1fr); gap: var(--coupon-site-space-5); }
	.error-404__art { flex-direction: column; order: 0; gap: 0; }
	.offer-card-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--coupon-site-space-4); }
	/* Side by side, grid cards reserve room for a code card's actions so perforations and buttons line up. */
	.offer-card-grid .offer-card:not(.offer-card--inactive) .offer-card__actions { justify-content: flex-end; min-height: 10.75rem; }
	/* Without a code there is a single button, so it sits in the middle of that space. */
	.offer-card-grid .offer-card:not(.offer-card--inactive) .offer-card__actions:not(:has(.offer-card__cta--code)) { justify-content: center; }
	.offer-card--row { display: grid; grid-template-columns: minmax(0, 1fr) 19rem; }
	.offer-card--row .offer-card__actions { padding-left: 1.5rem; border-top: 0; border-left: 2px dashed var(--coupon-site-border); }
	.offer-card--row .offer-card__actions::before,
	.offer-card--row .offer-card__actions::after { left: -.7rem; right: auto; }
	.offer-card--row .offer-card__actions::before { top: -.7rem; }
	.offer-card--row .offer-card__actions::after { top: auto; bottom: -.7rem; }
	.store-card-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
	.category-tile-list { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--coupon-site-space-3); }
	.store-tile-list { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--coupon-site-space-3); }
	.how-it-works__steps { grid-template-columns: repeat(3, minmax(0, 1fr)); }
	.post-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
	/* Featured post: the picture beside the text. */
	.post-card--featured { display: grid; grid-template-columns: minmax(0, 1.25fr) minmax(0, 1fr); }
	.post-card--featured .post-card__media { min-height: 20rem; aspect-ratio: auto; }
	.post-card--featured .post-card__body { justify-content: center; padding: clamp(1.5rem, 3vw, 2.5rem); }
	.post-navigation { grid-template-columns: repeat(2, minmax(0, 1fr)); }
	.post-navigation__link--next { grid-column: 2; justify-items: end; text-align: right; }
	/* Level with the step numbers, in the gap between two cards. */
	.how-it-works__step:not(:last-child)::after { top: 1.75rem; right: -1.5rem; bottom: auto; left: auto; rotate: none; translate: none; }
	.catalog-filters { grid-template-columns: repeat(2, minmax(0, 1fr)); }
	.catalog-filters__actions { grid-column: 1 / -1; }
}

@media (min-width: 64rem) {
	.site-main--with-sidebar { display: grid; grid-template-columns: minmax(0, 1fr) 18rem; align-items: start; gap: var(--coupon-site-space-5); }
	.site-main--with-sidebar .popular-stores { position: sticky; top: var(--coupon-site-space-3); margin-top: 0; }
	.site-main--with-sidebar .offer-card-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
	.site-main--with-sidebar .store-card-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
	.catalog-filters { grid-template-columns: repeat(4, minmax(0, 1fr)) auto; align-items: end; }
	.post-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
	.blog-header { grid-template-columns: minmax(0, 1fr) minmax(18rem, 26rem); }
	.catalog-filters__actions { grid-column: auto; }
	.catalog-filters:not(:has(#filter-category)) { grid-template-columns: repeat(3, minmax(0, 1fr)) auto; }
	/* Single offer: the action card sits next to the details. */
	.offer-detail { display: grid; grid-template-columns: minmax(0, 1fr) 22rem; align-items: start; gap: 0 var(--coupon-site-space-5); }
	.offer-detail > * { grid-column: 1; }
	.offer-detail > .offer-card { position: sticky; top: var(--coupon-site-space-3); grid-column: 2; grid-row: 1 / span 6; max-width: none; margin-top: 0; }
	.site-main--with-sidebar .offer-detail { grid-template-columns: minmax(0, 1fr); }
	.site-main--with-sidebar .offer-detail > .offer-card { position: static; grid-column: 1; grid-row: auto; max-width: 30rem; margin-top: var(--coupon-site-space-4); }
	/* Footer: brand next to the menus only from here. On tablets the brand column was
	   narrower than the logo and the text ran over the menus. max-content keeps it whole. */
	.site-footer__inner { grid-template-columns: minmax(max-content, 1fr) minmax(0, 2.5fr); align-items: start; }
	.site-footer__brand { grid-column: 1; grid-row: 1; }
	.site-footer__menus { grid-column: 2; grid-row: 1 / span 2; }
	.site-footer__social { grid-column: 1; grid-row: 2; align-self: start; }
	.site-footer__copyright { grid-column: 1 / -1; }
}

@media (min-width: 72rem) {
	/* Desktop header: brand on the left, search above a navy menu bar on the right. */
	.site-header__inner { grid-template-columns: auto minmax(0, 1fr); gap: var(--coupon-site-space-5); padding-block: 1.1rem; }
	.site-header__tools { display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: center; gap: .75rem .5rem; justify-items: stretch; min-width: 0; }
	.site-header__search,
	.site-header .primary-navigation,
	.site-header .theme-toggle { grid-column: auto; grid-row: auto; }
	.site-header__search { grid-column: 1 / -1; justify-self: end; width: min(100%, 44rem); }
	.site-branding__mascot { width: 5.25rem; }
	.site-branding__wordmark { font-size: 2rem; }
	.primary-navigation__disclosure { display: none; }
	.primary-navigation__desktop { display: block; justify-self: end; }
	/* The toggle sits at the end of the menu bar row; together they match the search width. */
	.site-header .primary-navigation { justify-self: end; width: min(100%, calc(44rem - 44px - .5rem)); }
	.primary-navigation__desktop > .primary-navigation__menu,
	.primary-navigation__desktop > .primary-navigation__menu > ul {
		display: flex;
		flex-wrap: wrap;
		gap: .15rem;
		padding: .3rem;
		border-radius: var(--coupon-site-radius-sm);
		background: var(--coupon-site-solid);
		box-shadow: var(--coupon-site-shadow-sm);
	}
	.primary-navigation__desktop > .primary-navigation__menu > ul { padding: 0; box-shadow: none; }
	.primary-navigation__desktop .primary-navigation__menu a { min-height: 40px; padding: .45rem 1rem; }
	.primary-navigation__desktop .primary-navigation__menu ul { width: 100%; }
	.primary-navigation__menu a:focus-visible { outline-offset: 2px; }
	.offer-card-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
	.store-card-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); }
	.category-tile-list { grid-template-columns: repeat(4, minmax(0, 1fr)); }
	.store-tile-list { grid-template-columns: repeat(5, minmax(0, 1fr)); }
	.home-hero__inner { grid-template-columns: minmax(0, 1.45fr) minmax(0, .85fr); gap: var(--coupon-site-space-6); }
	.home-hero__art { width: min(100%, 26rem); }
}

@media (prefers-reduced-motion: reduce) {
	html { scroll-behavior: auto; }
	*, *::before, *::after { scroll-behavior: auto !important; transition-duration: .01ms !important; animation-duration: .01ms !important; animation-iteration-count: 1 !important; }
	/* Hover states keep their colors but nothing moves. */
	.offer-card:hover,
	.offer-card__cta:not(.offer-card__cta--code):hover,
	.store-card:hover,
	.store-card:hover .store-card__logo,
	.store-card:hover .store-card__fallback,
	.store-tile:hover,
	.store-tile:hover .store-tile__logo,
	.store-tile:hover .store-tile__name,
	.category-tile:hover,
	.category-tile:hover::after,
	.post-card:hover,
	.post-card:hover .post-card__image,
	.post-card:hover .post-card__more::after,
	.post-navigation__link:hover,
	.site-branding__link:hover .site-branding__mascot,
	.theme-toggle:hover .theme-toggle__icon,
	.offer-search-form__controls:focus-within .offer-search-form__icon,
	.home-more__link:hover::after,
	.text-link-button:hover::after { transform: none; }
	.home-hero__store:hover,
	.error-404__link:hover,
	.nav-links a:hover,
	.blog-categories__link:hover,
	.site-footer__social-link:hover { translate: none; }
}

/* === etap 7 === */
.faq-group { margin-top: var(--coupon-site-space-5); }
.faq-group .section-heading__title { font-size: clamp(1.35rem, 3vw, 1.75rem); }

/* === etap menu === */
/* Submenus of the primary menu (stores, categories, occasions). The list is plain nested markup; the toggle button only exists once the page is scripted. */
.submenu-toggle {
	display: none;
	align-items: center;
	justify-content: center;
	width: 2.75rem;
	height: 44px;
	padding: 0;
	border: 0;
	border-radius: var(--coupon-site-radius-sm);
	background: transparent;
	color: var(--coupon-site-white);
	cursor: pointer;
	transition: background-color .2s ease;
}
html.coupon-site-nav-js .submenu-toggle { display: inline-flex; }
.submenu-toggle:hover { background: rgb(255 255 255 / 10%); }
.submenu-toggle:focus-visible { outline: 2px solid var(--coupon-site-gold); outline-offset: -2px; }
.submenu-toggle svg { transition: transform .25s var(--coupon-site-ease-out); }
.menu-item-has-children.is-open > .submenu-toggle svg { transform: rotate(180deg); }
.primary-navigation__menu a:not([href]) { cursor: pointer; }
.primary-navigation__menu .current-menu-ancestor > a { background: rgb(255 255 255 / 8%); box-shadow: inset 3px 0 0 var(--coupon-site-gold); }
.primary-navigation__menu .cs-menu-all { margin-top: .2rem; padding-top: .2rem; border-top: 1px solid rgb(255 255 255 / 14%); }
.primary-navigation__menu .cs-menu-all > a { color: var(--coupon-site-gold-bright); }

/* Mobile menu: the parent row is a link plus a toggle, its list is an accordion. */
.primary-navigation__disclosure > .primary-navigation__menu { max-height: calc(100dvh - 5.5rem); overflow-y: auto; overscroll-behavior: contain; }
.primary-navigation__disclosure .menu-item-has-children { display: grid; grid-template-columns: minmax(0, 1fr) 2.75rem; align-items: center; }
.primary-navigation__disclosure .menu-item-has-children > .sub-menu {
	display: grid;
	grid-column: 1 / -1;
	gap: .1rem;
	margin: 0 0 .35rem .85rem;
	padding: .1rem 0 0 var(--coupon-site-space-2);
	border-left: 2px solid rgb(255 255 255 / 18%);
}
.primary-navigation__disclosure .sub-menu a { min-height: 40px; font-weight: 600; }
html.coupon-site-nav-js .primary-navigation__disclosure .menu-item-has-children:not(.is-open) > .sub-menu { display: none; }

@media (min-width: 72rem) {
	/* Desktop bar: dropdowns hang under their item; "Kategorie" is a wide three-column panel under the bar. */
	/* The bar fits its items (seven with the chevrons would wrap in the search-wide box), and sits above the header hairline. */
	.site-header .primary-navigation { position: relative; z-index: 1; width: auto; max-width: 100%; }
	.primary-navigation__desktop { position: relative; }
	.primary-navigation__desktop .menu-item-has-children { position: relative; display: flex; align-items: center; }
	.primary-navigation__desktop .menu-item-has-children > a { padding-right: .25rem; }
	.primary-navigation__desktop .submenu-toggle { width: 1.75rem; height: 40px; margin-left: -.1rem; }
	.primary-navigation__desktop .primary-navigation__menu ul.sub-menu {
		position: absolute;
		top: 100%;
		left: 0;
		z-index: 30;
		display: none;
		gap: .1rem;
		width: max-content;
		min-width: 15rem;
		max-width: min(24rem, calc(100vw - 2rem));
		margin: .3rem 0 0;
		padding: .4rem;
		border-top: 3px solid var(--coupon-site-gold);
		border-radius: var(--coupon-site-radius-sm);
		background: var(--coupon-site-solid);
		box-shadow: var(--coupon-site-shadow-lg);
	}
	/* Keeps the pointer inside the item while it crosses the gap above the panel. */
	.primary-navigation__desktop .sub-menu::before { position: absolute; top: -.4rem; right: 0; left: 0; height: .4rem; content: ""; }
	html:not(.coupon-site-nav-js) .primary-navigation__desktop .menu-item-has-children:hover > .sub-menu,
	html:not(.coupon-site-nav-js) .primary-navigation__desktop .menu-item-has-children:focus-within > .sub-menu,
	.primary-navigation__desktop .menu-item-has-children.is-open > .sub-menu { display: grid; }
	.primary-navigation__desktop .menu-item-has-children.cs-menu-categories { position: static; }
	.primary-navigation__desktop .primary-navigation__menu .cs-menu-categories > .sub-menu {
		right: 0;
		left: auto;
		grid-template-columns: repeat(3, minmax(0, 1fr));
		width: 42rem;
		max-width: calc(100vw - 2rem);
	}
	.primary-navigation__desktop .primary-navigation__menu .cs-menu-occasions > .sub-menu { right: 0; left: auto; }
	.primary-navigation__desktop .sub-menu a { min-height: 40px; padding: .45rem .85rem; font-weight: 600; }
	.primary-navigation__desktop .sub-menu a::after { display: none; }
	.primary-navigation__desktop .current-menu-ancestor > a::after { transform: scaleX(1); }
	.primary-navigation__desktop .current-menu-ancestor > a { background: none; box-shadow: none; }
	.primary-navigation__desktop .primary-navigation__menu .sub-menu .current-menu-item > a { background: rgb(255 255 255 / 10%); box-shadow: inset 3px 0 0 var(--coupon-site-gold); }
	.primary-navigation__desktop .primary-navigation__menu .cs-menu-all { grid-column: 1 / -1; }
}

/* === etap 8 === */
/* Contact form (Contact Form 7), loaded only on the page that shows it. Colors come from the theme tokens, so both themes work (the error red too: --coupon-site-danger). */
.wpcf7 {
	margin-top: var(--coupon-site-space-4);
	padding: clamp(1.1rem, 3.5vw, 1.75rem);
	border: 1px solid var(--coupon-site-border);
	border-radius: var(--coupon-site-radius-card);
	background: var(--coupon-site-bg);
}
.wpcf7 .contact-form__field,
.wpcf7 .contact-form__consent,
.wpcf7 .contact-form__actions { margin: 0 0 var(--coupon-site-space-3); }
.wpcf7 .contact-form__field label { display: block; margin-bottom: .35rem; color: var(--coupon-site-heading); font-weight: 700; }
.wpcf7 .wpcf7-form-control-wrap { display: block; }
.wpcf7 input[type="text"],
.wpcf7 input[type="email"],
.wpcf7 textarea {
	display: block;
	box-sizing: border-box;
	width: 100%;
	min-height: 48px;
	padding: .65rem .9rem;
	border: 1px solid var(--coupon-site-border-strong);
	border-radius: var(--coupon-site-radius-sm);
	background: var(--coupon-site-surface);
	color: var(--coupon-site-text);
	font: inherit;
	line-height: 1.5;
	transition: border-color .2s ease, box-shadow .2s ease;
}
.wpcf7 textarea { min-height: 9rem; resize: vertical; }
.wpcf7 input[type="text"]:focus-visible,
.wpcf7 input[type="email"]:focus-visible,
.wpcf7 textarea:focus-visible { border-color: var(--coupon-site-focus); outline-offset: 1px; }
.wpcf7 [aria-invalid="true"] { border-color: var(--coupon-site-danger); box-shadow: 0 0 0 1px var(--coupon-site-danger); }
.wpcf7 .wpcf7-not-valid-tip { margin-top: .35rem; color: var(--coupon-site-danger); font-size: .95rem; font-weight: 600; }

/* Consent: the checkbox sits next to a wrapping text with a link. */
.wpcf7 .wpcf7-acceptance .wpcf7-list-item { display: block; margin: 0; }
.wpcf7 .wpcf7-acceptance label { display: flex; gap: .65rem; align-items: flex-start; color: var(--coupon-site-text); line-height: 1.5; }
.wpcf7 .wpcf7-acceptance input[type="checkbox"] { flex: 0 0 auto; width: 1.3rem; height: 1.3rem; margin: .1rem 0 0; accent-color: var(--coupon-site-solid); }
.wpcf7 .wpcf7-list-item-label::before,
.wpcf7 .wpcf7-list-item-label::after { content: none; }
.wpcf7 .wpcf7-acceptance a { color: var(--coupon-site-link); }

.wpcf7 .contact-form__actions { display: flex; flex-wrap: wrap; gap: var(--coupon-site-space-2); align-items: center; margin-bottom: 0; }
.wpcf7 .wpcf7-spinner { margin: 0; background-color: var(--coupon-site-heading); }
.wpcf7 .wpcf7-spinner::before { background-color: var(--coupon-site-surface); }

/* Answer under the button: a colored edge says whether it worked. */
.wpcf7 form .wpcf7-response-output {
	margin: var(--coupon-site-space-3) 0 0;
	padding: .75rem 1rem;
	border: 0;
	border-left: 4px solid var(--coupon-site-border-strong);
	border-radius: var(--coupon-site-radius-sm);
	background: var(--coupon-site-surface);
	color: var(--coupon-site-text);
	font-weight: 600;
}
.wpcf7 form.sent .wpcf7-response-output { border-color: var(--coupon-site-success); }
.wpcf7 form.invalid .wpcf7-response-output,
.wpcf7 form.unaccepted .wpcf7-response-output { border-color: var(--coupon-site-gold); }
.wpcf7 form.failed .wpcf7-response-output,
.wpcf7 form.aborted .wpcf7-response-output,
.wpcf7 form.spam .wpcf7-response-output { border-color: var(--coupon-site-danger); }

@media (max-width: 30rem) {
	.wpcf7 .contact-form__submit { width: 100%; }
}
/* === etap 3 === */
.occasion-off-season { margin-top: var(--coupon-site-space-6); }
.occasion-off-season__title { margin: 0; font-size: clamp(1.4rem, 4vw, 2rem); }
.occasion-off-season__message { margin: .5rem 0 var(--coupon-site-space-4); color: var(--coupon-site-muted); }
.occasion-off-season__more { margin: var(--coupon-site-space-4) 0 0; }

/* === etap 3b === */
.occasion-date { margin: 0 0 var(--coupon-site-space-1); color: var(--coupon-site-gold-text); font-size: 1.1rem; font-weight: 700; }
.occasion-stores,
.occasion-faq,
.occasion-guide { margin-top: var(--coupon-site-space-5); }
.occasion-stores > h2,
.occasion-faq > h2 { margin: 0 0 var(--coupon-site-space-3); font-size: clamp(1.4rem, 3.4vw, 1.85rem); }
.occasion-guide { max-width: var(--coupon-site-content); }
.occasion-off-season__next { margin: 0 0 var(--coupon-site-space-4); color: var(--coupon-site-gold-text); font-weight: 700; }

/* === etap 5 === */
/* Store page: the "Szczegóły ofert" card above the offer list on a phone, beside it when the article is wide enough. */
.store-detail { container: store-detail / inline-size; }
.offer-details {
	margin-top: var(--coupon-site-space-5);
	padding: var(--coupon-site-space-3) var(--coupon-site-space-4);
	border: 1px solid var(--coupon-site-border);
	border-radius: var(--coupon-site-radius-card);
	background: var(--coupon-site-surface);
	box-shadow: var(--coupon-site-shadow-sm);
}
.offer-details__title { margin: 0 0 var(--coupon-site-space-2); color: var(--coupon-site-heading); font-size: 1.2rem; }
.offer-details__list { margin: 0; }
.offer-details__row {
	display: flex;
	align-items: baseline;
	justify-content: space-between;
	gap: var(--coupon-site-space-2);
	padding: .55rem 0;
	border-top: 1px solid var(--coupon-site-border);
	font-size: .95rem;
}
.offer-details__row dt { color: var(--coupon-site-muted); }
.offer-details__row dd { margin: 0; color: var(--coupon-site-heading); font-weight: 700; text-align: right; white-space: nowrap; }
.offer-details__row dd.offer-details__discount { color: var(--coupon-site-gold-text); }
@container store-detail (min-width: 46rem) {
	.store-detail__offers { display: grid; grid-template-columns: minmax(0, 1fr) 17rem; align-items: start; gap: 0 var(--coupon-site-space-5); }
	.store-detail__offers > section { grid-column: 1; grid-row: 1; }
	.store-detail__offers > .offer-details { grid-column: 2; grid-row: 1; position: sticky; top: var(--coupon-site-space-3); }
	.store-detail__offers:not(:has(.offer-details)) { grid-template-columns: minmax(0, 1fr); }
}
/* Compact on a phone: the card above the list shows the key numbers side by side, so the first offer stays near the top. The code and promotion counts live in the filter buttons below. */
@container store-detail (max-width: 45.99rem) {
	.offer-details { margin-top: var(--coupon-site-space-3); padding: var(--coupon-site-space-2) var(--coupon-site-space-3); }
	.offer-details__title { margin-bottom: .15rem; font-size: 1rem; }
	.offer-details__list { display: flex; flex-wrap: wrap; gap: 0 var(--coupon-site-space-4); }
	.offer-details__row { display: block; flex: 1 1 7rem; padding: .4rem 0; }
	.offer-details__row:has(.offer-details__codes),
	.offer-details__row:has(.offer-details__promotions) { display: none; }
	.offer-details__row dt { font-size: .8rem; line-height: 1.3; }
	.offer-details__row dd { font-size: 1.05rem; text-align: left; }
}

/* === etap 4 === */
.related-stores,
.category-stores { margin-top: var(--coupon-site-space-5); }
.related-stores > h2,
.category-stores > h2 { margin: 0 0 var(--coupon-site-space-3); font-size: clamp(1.4rem, 3.4vw, 1.85rem); }
.related-stores__more { margin: var(--coupon-site-space-4) 0 0; }
@media (max-width: 30rem) {
	.related-stores__more .text-link-button { width: 100%; }
}

/* === etap 6 === */
/* Offer window: a click on an offer card opens a native dialog on the store page (offer-modal.js). */

/* A card that links to a window: with JavaScript the link opens it; without, the direct link goes to the shop. */
html:not(.coupon-site-js) .offer-card__cta--window { display: none; }
.coupon-site-js .offer-card__cta--direct { display: none; }

/* /kody-rabatowe/{store}/#kod-{id} without JavaScript lands on the card and marks it. */
.offer-card { scroll-margin-top: 6rem; }
.offer-card:target { outline: 3px solid var(--coupon-site-gold); outline-offset: 3px; }

/* The gutter stays reserved, so the page behind does not jump when the scrollbar goes away. */
html.has-offer-dialog { overflow: hidden; scrollbar-gutter: stable; }

.offer-dialog {
	width: min(32rem, calc(100% - 2rem));
	max-width: none;
	max-height: min(90dvh, 44rem);
	padding: 0;
	border: 0;
	border-radius: var(--coupon-site-radius-card);
	background: var(--coupon-site-surface);
	box-shadow: var(--coupon-site-shadow-lg);
	color: var(--coupon-site-text);
	overflow: hidden;
}
.offer-dialog::backdrop { background: rgb(11 26 51 / 62%); }
.offer-dialog[open] { display: flex; }
.offer-dialog__panel {
	display: flex;
	flex: 1 1 auto;
	flex-direction: column;
	gap: var(--coupon-site-space-3);
	min-width: 0;
	padding: 1.75rem 1.5rem 1.5rem;
	overflow-y: auto;
	overscroll-behavior: contain;
}
.offer-dialog__close {
	position: absolute;
	z-index: 1;
	top: .6rem;
	right: .6rem;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 44px;
	height: 44px;
	padding: 0;
	border: 0;
	border-radius: var(--coupon-site-radius-pill);
	background: var(--coupon-site-tint);
	color: var(--coupon-site-tint-text);
	cursor: pointer;
	transition: background-color .2s ease;
}
.offer-dialog__close:hover { background: var(--coupon-site-border-strong); }
.offer-dialog__body { display: flex; flex-direction: column; gap: var(--coupon-site-space-3); min-width: 0; }
.offer-dialog__body > * { margin: 0; }
.offer-dialog__store { padding-right: 3rem; color: var(--coupon-site-muted); font-size: .85rem; font-weight: 700; letter-spacing: .04em; text-transform: uppercase; }
.offer-dialog__title { padding-right: 3rem; font-size: clamp(1.3rem, 4.5vw, 1.65rem); }
.offer-dialog__badges { margin: 0; }
.offer-dialog__code {
	display: flex;
	align-items: center;
	gap: .5rem;
	min-height: var(--coupon-site-code-slot);
	padding: .35rem .35rem .35rem .9rem;
	border: 2px dashed var(--coupon-site-gold);
	border-radius: var(--coupon-site-radius-sm);
	background: var(--coupon-site-gold-soft);
}
.offer-dialog__code code {
	flex: 1 1 auto;
	min-width: 0;
	color: var(--coupon-site-code-text);
	font-family: var(--coupon-site-mono);
	font-size: 1.2rem;
	font-weight: 800;
	letter-spacing: .05em;
	overflow-wrap: anywhere;
	user-select: all;
}
.offer-dialog__copy {
	flex: 0 0 auto;
	align-self: stretch;
	min-width: 6rem;
	padding: 0 .9rem;
	border: 0;
	border-radius: .45rem;
	background: var(--coupon-site-solid);
	color: var(--coupon-site-white);
	cursor: pointer;
	font-weight: 800;
	transition: background-color .25s ease;
}
.offer-dialog__copy:hover { background: var(--coupon-site-solid-hover); }
.offer-dialog__copy.is-copied { background: var(--coupon-site-success); }
.offer-dialog__note { padding: .7rem .9rem; border-radius: var(--coupon-site-radius-sm); background: var(--coupon-site-tint); color: var(--coupon-site-tint-text); font-weight: 600; }
.offer-dialog__description { color: var(--coupon-site-text); line-height: 1.6; }
.offer-dialog__terms h3 { margin: 0 0 .25rem; font-size: .95rem; }
.offer-dialog__terms p { color: var(--coupon-site-muted); font-size: .9rem; }
.offer-dialog__validity { color: var(--coupon-site-muted); font-size: .875rem; font-weight: 600; }
.offer-dialog__validity::before {
	display: inline-block;
	width: .95rem;
	height: .95rem;
	margin-right: .35rem;
	vertical-align: -.15em;
	background: currentColor;
	content: "";
	-webkit-mask: var(--coupon-site-icon-clock) center / contain no-repeat;
	mask: var(--coupon-site-icon-clock) center / contain no-repeat;
}
.offer-dialog__shop {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: .5rem;
	min-height: 48px;
	padding: .6rem 1.25rem;
	border-radius: var(--coupon-site-radius-pill);
	background: var(--coupon-site-gold);
	box-shadow: inset 0 -2px 0 rgb(0 0 0 / 12%);
	color: var(--coupon-site-navy-dark);
	font-weight: 800;
	text-decoration: none;
	transition: background-color .2s ease, box-shadow .25s ease;
}
.offer-dialog__shop:hover { background: var(--coupon-site-gold-bright); box-shadow: inset 0 -2px 0 rgb(0 0 0 / 12%), var(--coupon-site-glow); color: var(--coupon-site-navy-dark); }
.offer-dialog__shop::after {
	width: 1em;
	height: 1em;
	background: currentColor;
	content: "";
	-webkit-mask: var(--coupon-site-icon-external) center / contain no-repeat;
	mask: var(--coupon-site-icon-external) center / contain no-repeat;
}
/* The result of copying is announced to screen readers; a failure also takes visible space. */
.offer-dialog__status { margin: 0; color: var(--coupon-site-success); font-size: .875rem; font-weight: 600; text-align: center; }
.offer-dialog__status:empty { display: none; }
.offer-dialog__status.is-error { color: var(--coupon-site-gold-text); }
.offer-dialog__status.is-hint { color: var(--coupon-site-text); }

@keyframes coupon-site-dialog-in { from { opacity: 0; translate: 0 1rem; } }
@keyframes coupon-site-backdrop-in { from { opacity: 0; } }
@media (prefers-reduced-motion: no-preference) {
	.offer-dialog[open] { animation: coupon-site-dialog-in .3s var(--coupon-site-ease-out); }
	.offer-dialog[open]::backdrop { animation: coupon-site-backdrop-in .3s ease; }
	.offer-dialog__copy.is-copied { animation: coupon-site-copied .7s var(--coupon-site-ease-out); }
}

/* Phones: the window rises from the bottom edge as a sheet. */
@media (max-width: 40rem) {
	.offer-dialog {
		width: 100%;
		max-height: 92dvh;
		margin: auto 0 0;
		border-radius: var(--coupon-site-radius-card) var(--coupon-site-radius-card) 0 0;
	}
	.offer-dialog__panel { padding: 1.5rem 1rem calc(1.25rem + env(safe-area-inset-bottom)); }
	.offer-dialog__code { flex-wrap: wrap; padding: .6rem; }
	.offer-dialog__code code { flex-basis: 100%; text-align: center; }
	.offer-dialog__copy { min-height: 44px; width: 100%; }
}
