:root {
	--kwk-banner-navy: #003a9b;
	--kwk-banner-navy-dark: #002d73;
	--kwk-banner-bg-start: #dceaf5;
	--kwk-banner-bg-end: #f5fafd;
	--kwk-banner-bar-height: 90px;
	--kwk-banner-z: 99990;
	--kwk-banner-draft-accent: #ffe8a3;
	--kwk-banner-promo-border: #fff265;
}

.kwk-banner[hidden],
.kwk-banner-modal[hidden] {
	display: none !important;
}

/* Bandeau pleine largeur (sort du conteneur Bridge .content_inner) */
.kwk-banner {
	position: relative;
	box-sizing: border-box;
	width: 100vw;
	max-width: 100vw;
	margin-left: calc(50% - 50vw);
	margin-right: calc(50% - 50vw);
	z-index: 102;
	overflow-anchor: none;
	font-family: 'Montserrat', sans-serif;
}

/*
 * Bridge : marge uniquement si le header est fixe ET que .content n’a pas déjà
 * de marge haute (content_top_margin_none).
 */
body.qode-theme-bridge:has(header.fixed) .content.content_top_margin_none>.content_inner>.kwk-banner:first-child,
body.qode-theme-bridge:has(header.fixed_hiding) .content.content_top_margin_none>.content_inner>.kwk-banner:first-child,
body.qode-theme-bridge:has(header.fixed_top_header) .content.content_top_margin_none>.content_inner>.kwk-banner:first-child {
	margin-top: 100px;
}

@media (max-width: 782px) {

	body.qode-theme-bridge:has(header.fixed) .content.content_top_margin_none>.content_inner>.kwk-banner:first-child,
	body.qode-theme-bridge:has(header.fixed_hiding) .content.content_top_margin_none>.content_inner>.kwk-banner:first-child,
	body.qode-theme-bridge:has(header.fixed_top_header) .content.content_top_margin_none>.content_inner>.kwk-banner:first-child {
		margin-top: 70px;
	}
}

.kwk-banner.is-draft .kwk-banner__bar {
	outline: 2px dashed rgba(15, 45, 82, 0.45);
	outline-offset: -2px;
}

.kwk-banner.is-draft .kwk-banner__inner {
	flex-wrap: wrap;
}

.kwk-banner__draft-label {
	flex: 0 0 100%;
	order: -1;
	display: inline-block;
	width: fit-content;
	margin-bottom: 0.15rem;
	padding: 0.2rem 0.5rem;
	border-radius: 3px;
	font-size: 0.7rem;
	font-weight: 700;
	letter-spacing: 0.05em;
	text-transform: uppercase;
	color: #7a4b00;
	background: var(--kwk-banner-draft-accent);
}

.kwk-banner__bar {
	background: linear-gradient(270deg, var(--kwk-banner-bg-start) 0%, var(--kwk-banner-bg-end) 45%, #fff 100%);
	border-bottom: 1px solid rgba(0, 59, 149, 0.08);
	box-shadow: 0 2px 12px rgba(0, 59, 149, 0.06);
}

.kwk-banner__inner {
	display: flex;
	flex-wrap: nowrap;
	align-items: center;
	position: relative;
	width: 100%;
	max-width: 100%;
	min-width: 0;
	min-height: var(--kwk-banner-bar-height);
	margin: 0;
	padding: 0;
}

.kwk-banner__media {
	flex: 0 0 auto;
	align-self: stretch;
	width: 15%;
	margin: 0;
	padding: 0;
	overflow: hidden;
	line-height: 0;
}

.kwk-banner__media img {
	display: block;
	width: 100%;
	height: 100%;
	min-height: var(--kwk-banner-bar-height);
	object-fit: cover;
}

.kwk-banner__middle {
	flex: 1 1 auto;
	display: flex;
	align-items: center;
	gap: 20px;
	min-width: 0;
	padding: 0.5rem clamp(0.75rem, 1.5vw, 1.25rem);
}

.kwk-banner__offer {
	display: flex;
	flex-wrap: nowrap;
	align-items: center;
	gap: 0.85rem 1.35rem;
	min-width: 0;
	max-width: 100%;
}

.kwk-banner__badge {
	flex: 0 0 auto;
	padding: 2px 15px;
	border-radius: 5px;
	font-family: inherit;
	font-size: 16px;
	font-weight: 600;
	text-transform: uppercase;
	white-space: nowrap;
	color: #fff;
	background: var(--kwk-banner-navy);
	border: 3px solid var(--kwk-banner-promo-border);
}

.kwk-banner__sep {
	flex: 0 0 1px;
	align-self: stretch;
	height: 18px;
	margin: auto 0;
	background: #000;
}

.kwk-banner__headline {
	display: flex;
	flex: 0 1 auto;
	align-items: center;
	gap: 10px;
	margin: 0;
	line-height: 1.3;
	white-space: nowrap;
	color: #000;
}

.kwk-banner__headline-before {
	font-size: 22px;
	font-weight: 700;
	color: #000;
}

.kwk-banner__price {
	font-size: clamp(1.4rem, 2.4vw, 2.15rem);
	font-weight: 700;
	letter-spacing: -0.02em;
	color: var(--kwk-banner-navy);
}

.kwk-banner__validity {
	flex: 0 1 auto;
	margin: 0;
	padding: 0 0.5rem;
	font-size: 16px;
	font-weight: 400;
	line-height: 1.35;
	text-align: center;
	white-space: nowrap;
	color: #000;
}

.kwk-banner__actions {
	flex: 0 0 auto;
	display: flex;
	align-items: center;
	gap: 0.35rem 0.75rem;
	padding: 0.5rem clamp(0.75rem, 2vw, 1.5rem) 0.5rem 0.75rem;
}

.kwk-banner__cta {
	display: inline-flex;
	flex: 0 0 auto;
	align-items: center;
	gap: 0.45rem;
	padding: 0.6rem 1.25rem;
	border: 3px solid var(--kwk-banner-promo-border);
	border-radius: 999px;
	box-sizing: border-box;
	font-family: inherit;
	font-size: 18px;
	font-weight: 500;
	white-space: nowrap;
	color: #fff;
	background: var(--kwk-banner-navy);
	cursor: pointer;
	transition: background 0.2s ease;
}

.kwk-banner__cta:hover,
.kwk-banner__cta:focus-visible {
	background: var(--kwk-banner-navy-dark);
	outline: 2px solid var(--kwk-banner-navy);
	outline-offset: 2px;
}

.kwk-banner__cta-arrow {
	display: block;
	flex-shrink: 0;
	width: 1.15rem;
	height: 1.15rem;
}

.kwk-banner__close {
	flex: 0 0 auto;
	padding: 0.25rem 0.35rem;
	border: none;
	font-size: 1.65rem;
	font-weight: 300;
	line-height: 1;
	color: #2d3748;
	background: transparent;
	cursor: pointer;
	opacity: 0.85;
}

.kwk-banner__close:hover,
.kwk-banner__close:focus-visible {
	opacity: 1;
}

/* Mobile : pastille FAB */
.kwk-banner__pill-wrap {
	display: none;
	position: fixed;
	top: 115px;
	right: 10px;
	z-index: calc(var(--kwk-banner-z) + 1);
	pointer-events: auto;
}

.kwk-banner__fab {
	position: relative;
	width: 68px;
	height: 68px;
}

.kwk-banner__fab-main {
	position: relative;
	z-index: 1;
	display: flex;
	align-items: center;
	justify-content: center;
	width: 100%;
	height: 100%;
	padding: 0;
	border: none;
	border-radius: 50%;
	overflow: hidden;
	color: #fff;
	background: var(--kwk-banner-navy);
	box-shadow: 0 0 0 3px var(--kwk-banner-promo-border), 0 6px 22px rgba(0, 58, 155, 0.35);
	cursor: pointer;
	transition: background 0.2s ease, transform 0.15s ease;
}

.kwk-banner__fab-label-svg {
	position: absolute;
	inset: 0;
	z-index: 1;
	width: 100%;
	height: 100%;
	overflow: visible;
	pointer-events: none;
}

.kwk-banner__fab-svg-text {
	fill: #fff;
	font-family: 'Montserrat', sans-serif;
	font-weight: 500;
}

.kwk-banner__fab-svg-text--top {
	font-size: 15px;
	letter-spacing: 1px;
}

.kwk-banner__fab-svg-text--bottom {
	font-size: 14px;
	letter-spacing: 4px;
}

.kwk-banner__fab-icon-wrap {
	position: relative;
	z-index: 2;
	display: flex;
	align-items: center;
	justify-content: center;
}

.kwk-banner__fab-gift,
.kwk-banner__fab-icon {
	display: block;
	width: 1.65rem;
	height: 1.65rem;
	object-fit: contain;
	transform-origin: center center;
	animation: kwk-banner-fab-hop-wiggle 4s ease-in-out infinite;
}

/* Pause → saut → atterrissage → wiggle (rythme lent, ~2 s de mouvement) */
@keyframes kwk-banner-fab-hop-wiggle {

	0%,
	58%,
	100% {
		transform: translateY(0) rotate(0deg);
	}

	62% {
		transform: translateY(-4px) rotate(0deg);
	}

	66% {
		transform: translateY(0) rotate(0deg);
	}

	68% {
		transform: translateY(1px) rotate(-12deg);
	}

	71% {
		transform: translateY(0) rotate(12deg);
	}

	74% {
		transform: translateY(0) rotate(-8deg);
	}

	77% {
		transform: translateY(0) rotate(8deg);
	}

	80% {
		transform: translateY(0) rotate(-4deg);
	}

	83% {
		transform: translateY(0) rotate(0deg);
	}
}

@media (prefers-reduced-motion: reduce) {

	.kwk-banner__fab-gift,
	.kwk-banner__fab-icon {
		animation: none;
	}
}

.kwk-banner__fab-main:hover,
.kwk-banner__fab-main:focus-visible {
	background: #1a6ae8;
	outline: 2px solid #fff;
	outline-offset: 2px;
}

.kwk-banner__fab-main:active {
	transform: scale(0.97);
}

.kwk-banner__fab-close {
	position: absolute;
	top: 0;
	right: 0;
	z-index: 2;
	display: flex;
	align-items: center;
	justify-content: center;
	width: 1.125rem;
	height: 1.125rem;
	padding: 0;
	border: none;
	border-radius: 50%;
	font-size: 0.75rem;
	font-weight: 600;
	line-height: 0;
	color: #2f7cf6;
	background: #fff;
	box-shadow: 0 2px 8px rgba(0, 40, 100, 0.18);
	cursor: pointer;
	transform: translate(18%, -18%);
}

.kwk-banner__fab-close span {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 100%;
	height: 100%;
	margin: 0;
	padding: 0;
	line-height: 1;
}

.kwk-banner__fab-close:hover,
.kwk-banner__fab-close:focus-visible {
	background: #f0f6ff;
	outline: 2px solid #2f7cf6;
	outline-offset: 1px;
}

@media (max-width: 782px) {
	.kwk-banner__bar {
		display: none;
	}

	.kwk-banner__pill-wrap {
		display: flex;
	}

	.kwk-banner:not(.is-visible) .kwk-banner__pill-wrap,
	.kwk-banner[hidden] .kwk-banner__pill-wrap {
		display: none;
	}
}

/* ≤ 1700px : layout « tablette » (validité sous le titre), typos identiques au desktop */
@media (min-width: 783px) and (max-width: 1700px) {
	.kwk-banner__media {
		width: 10%;
	}

	.kwk-banner__middle {
		display: grid;
		grid-template-columns: auto auto minmax(0, 1fr);
		grid-template-rows: auto auto;
		align-items: center;
		column-gap: 0.85rem;
		row-gap: 0.08rem;
	}

	.kwk-banner__offer {
		display: contents;
	}

	.kwk-banner__badge {
		grid-column: 1;
		grid-row: 1 / 3;
		align-self: center;
	}

	.kwk-banner__sep {
		grid-column: 2;
		grid-row: 1 / 3;
		align-self: center;
	}

	.kwk-banner__headline {
		grid-column: 3;
		grid-row: 1;
		min-width: 0;
		white-space: nowrap;
	}

	.kwk-banner__validity {
		grid-column: 3;
		grid-row: 2;
		justify-self: start;
		max-width: 100%;
		padding: 0;
		overflow: hidden;
		text-align: left;
		text-overflow: ellipsis;
		white-space: nowrap;
	}
}

/* ≤ 1235px : badge au-dessus du titre, typos légèrement réduites */
@media (min-width: 783px) and (max-width: 1235px) {
	.kwk-banner__middle {
		grid-template-columns: minmax(0, 1fr);
		grid-template-rows: auto auto auto;
		align-items: start;
		row-gap: 0.2rem;
	}

	.kwk-banner__badge {
		grid-column: 1;
		grid-row: 1;
		justify-self: start;
		align-self: start;
		width: fit-content;
		max-width: 100%;
		font-size: 15px;
	}

	.kwk-banner__sep {
		display: none;
	}

	.kwk-banner__headline {
		grid-column: 1;
		grid-row: 2;
		flex-wrap: wrap;
		white-space: normal;
	}

	.kwk-banner__headline-before {
		font-size: 20px;
	}

	.kwk-banner__price {
		font-size: clamp(1.3rem, 2.1vw, 1.95rem);
	}

	.kwk-banner__validity {
		grid-column: 1;
		grid-row: 3;
		font-size: 15px;
		text-align: left;
	}

	.kwk-banner__cta {
		font-size: 17px;
		padding: 0.55rem 1.1rem;
	}
}

/* Modal */
.kwk-banner-modal {
	position: fixed;
	inset: 0;
	z-index: calc(var(--kwk-banner-z) + 10);
	display: flex;
	align-items: center;
	justify-content: center;
	padding: 1.5rem;
}

.kwk-banner-modal__overlay {
	position: absolute;
	inset: 0;
	background: rgba(10, 25, 45, 0.55);
}

.kwk-banner-modal__dialog {
	position: relative;
	width: 100%;
	max-width: 640px;
	max-height: min(85vh, 720px);
	padding: 2rem 1.75rem 1.75rem;
	overflow: auto;
	border: 1px solid rgba(0, 59, 149, 0.1);
	border-radius: 8px;
	background: linear-gradient(to bottom right, #fff 0%, var(--kwk-banner-bg-end) 35%, var(--kwk-banner-bg-start) 100%);
	box-shadow: 0 24px 64px rgba(0, 59, 149, 0.18);
}

.kwk-banner-modal__content {
	font-family: 'Montserrat', sans-serif;
	font-size: 16px;
	line-height: 1.6;
	white-space: normal;
	color: #333;
}

.kwk-banner-modal__content.entry-content,
.kwk-banner-modal__content.entry-content p,
.kwk-banner-modal__content.entry-content li {
	font-size: 16px;
}

.kwk-banner-modal__content p {
	margin: 0 0 1em;
}

.kwk-banner-modal__content p:first-child {
	margin-top: 0;
}

.kwk-banner-modal__content p:last-child {
	margin-bottom: 0;
}

.kwk-banner-modal__content ul,
.kwk-banner-modal__content ol {
	margin: 0 0 1em 1.25em;
	padding: 0;
}

.kwk-banner-modal__content li+li {
	margin-top: 0.35em;
}

.kwk-banner-modal__footer {
	margin: 1.5rem 0 0;
	padding: 0;
	text-align: center;
}

.kwk-banner-modal__button {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 0.45rem;
	padding: 0.7rem 1.5rem;
	border-radius: 999px;
	font-family: inherit;
	font-size: 0.95rem;
	font-weight: 600;
	line-height: 1.25;
	text-decoration: none;
	color: #fff;
	background: var(--kwk-banner-navy);
	transition: background 0.2s ease;
}

.kwk-banner-modal__button:visited {
	color: #fff;
	text-decoration: none;
}

.kwk-banner-modal__button:hover,
.kwk-banner-modal__button:focus-visible {
	color: #fff;
	text-decoration: none;
	background: var(--kwk-banner-navy-dark);
	outline: 2px solid var(--kwk-banner-navy);
	outline-offset: 2px;
}

.kwk-banner-modal__button-arrow {
	display: block;
	flex-shrink: 0;
	width: 1.15rem;
	height: 1.15rem;
}

.kwk-banner-modal__close {
	position: absolute;
	top: 0.65rem;
	right: 0.65rem;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 2.25rem;
	height: 2.25rem;
	padding: 0;
	border: none;
	border-radius: 50%;
	color: #1a1a1a;
	background: transparent;
	cursor: pointer;
	transition: background-color 0.2s ease, color 0.2s ease;
}

.kwk-banner-modal__close-icon {
	display: block;
	width: 1.15rem;
	height: 1.15rem;
}

.kwk-banner-modal__close:hover,
.kwk-banner-modal__close:focus-visible {
	color: #000;
	background: rgba(0, 0, 0, 0.06);
	outline: none;
}

.kwk-banner-modal__close:focus-visible {
	box-shadow: 0 0 0 2px rgba(0, 0, 0, 0.15);
}

body.kwk-banner-modal-open {
	overflow: hidden;
}