/* =========================================================================
   KREED NOVA — v2.css
   Ajouts V2 : logo SVG, mega menu, sections home, asymétrie collection,
   galerie produit full-bleed, sticky mobile CTA, footer enrichi,
   pages éditoriales chapitrées, world map, timeline.
   ========================================================================= */

/* -------------------------------------------------------------------------
   1. LOGO SVG dans header / footer
   V2.2 — logo agrandi pour présence "maison de joaillerie".
   ------------------------------------------------------------------------- */
.kn-logo { display: inline-flex; align-items: center; line-height: 0; }
.kn-logo svg { display: block; height: 100%; width: auto; }

/* Header desktop : logo bien présent, à la VCA / Pomellato */
.kn-header__logo .kn-logo svg {
	height: 48px;
	color: var(--c-noir);
	transition: height var(--dur-base) var(--ease-out);
}
@media (max-width: 1023px) {
	.kn-header__logo .kn-logo svg { height: 40px; }
}
@media (max-width: 767px) {
	.kn-header__logo .kn-logo svg { height: 34px; }
}

/* Quand on scrolle, on rétrécit légèrement le logo (gain d'espace) */
.kn-header.is-scrolled .kn-header__logo .kn-logo svg {
	height: 38px;
}
@media (max-width: 767px) {
	.kn-header.is-scrolled .kn-header__logo .kn-logo svg { height: 30px; }
}

/* Header transparent sur hero : le logo conserve sa couleur noire mais
   bénéficie du scrim CSS (cf. section header.is-transparent plus bas)
   pour garantir la lisibilité sur toute photo de hero. */
.kn-header.is-transparent .kn-logo svg { color: var(--c-noir); }

/* Footer : logo full bien grand pour l'effet "signature de maison" */
.kn-footer .kn-logo--full {
	display: inline-block;
	margin-bottom: var(--sp-md);
}
.kn-footer .kn-logo--full svg {
	height: 130px;
	color: var(--c-ivoire);
}
@media (max-width: 767px) {
	.kn-footer .kn-logo--full svg { height: 100px; }
}

/* Monogramme watermark sur hero : plus grand et un peu plus visible */
.kn-monogram-watermark {
	position: absolute;
	bottom: var(--sp-2xl);
	right: var(--sp-2xl);
	width: 160px;
	opacity: 0.14;
	color: var(--c-noir);
	z-index: 1;
	pointer-events: none;
}
@media (max-width: 767px) {
	.kn-monogram-watermark { width: 90px; bottom: var(--sp-md); right: var(--sp-md); opacity: 0.1; }
}

/* -------------------------------------------------------------------------
   2. MEGA MENU DESKTOP
   ------------------------------------------------------------------------- */
.kn-mega {
	position: absolute;
	top: 100%;
	left: 0;
	right: 0;
	background: var(--c-ivoire);
	border-top: var(--bd-hairline);
	border-bottom: 1px solid rgba(26, 26, 26, 0.06);
	box-shadow: 0 32px 60px -28px rgba(26, 26, 26, 0.22);
	transform: translateY(-12px);
	opacity: 0;
	visibility: hidden;
	pointer-events: none;
	transition:
		transform var(--dur-base) var(--ease-luxe),
		opacity   var(--dur-base) var(--ease-out),
		visibility 0s linear var(--dur-base);
	z-index: 99;
	max-height: calc(100vh - var(--header-h));
	overflow-y: auto;
}
.kn-mega.is-open {
	transform: translateY(0);
	opacity: 1;
	visibility: visible;
	pointer-events: auto;
	transition:
		transform var(--dur-base) var(--ease-luxe),
		opacity   var(--dur-base) var(--ease-out),
		visibility 0s linear 0s;
}
.kn-mega__inner {
	max-width: var(--ct-max);
	margin: 0 auto;
	padding: var(--sp-xl) var(--gutter) var(--sp-2xl);
	display: grid;
	gap: var(--sp-xl);
}
@media (min-width: 1280px) {
	.kn-mega__inner { padding: var(--sp-2xl) var(--gutter); gap: var(--sp-2xl); }
}
.kn-mega--collection .kn-mega__inner { grid-template-columns: 1fr 1fr; }
.kn-mega--maison     .kn-mega__inner { grid-template-columns: 1fr 1fr; }

/* Petite suréchelle "Collection" / "La Maison" en haut du mega menu */
.kn-mega__overline {
	grid-column: 1 / -1;
	font-size: var(--fs-overline);
	letter-spacing: 0.22em;
	text-transform: uppercase;
	color: var(--c-pierre);
	margin: 0;
	padding-bottom: var(--sp-md);
	border-bottom: var(--bd-hairline);
}

.kn-mega__card {
	display: block;
	position: relative;
}
.kn-mega__card-media {
	aspect-ratio: 4 / 3;
	overflow: hidden;
	background: var(--c-ivoire-deep);
	margin-bottom: var(--sp-md);
}
.kn-mega__card-media img {
	width: 100%; height: 100%;
	object-fit: cover;
	transition: transform 800ms var(--ease-luxe);
}
.kn-mega__card:hover .kn-mega__card-media img { transform: scale(1.04); }
.kn-mega__card-title {
	font-family: var(--ff-serif);
	font-size: 1.5rem;
	margin: 0 0 4px;
	color: var(--c-noir);
}
.kn-mega__card-sub {
	font-style: italic;
	color: var(--c-pierre);
	font-size: 0.9375rem;
	margin: 0 0 var(--sp-2xs);
}
.kn-mega__card-meta {
	display: flex;
	justify-content: space-between;
	align-items: baseline;
	gap: var(--sp-md);
}
.kn-mega__card-price {
	font-family: var(--ff-serif);
	color: var(--c-or-dark);
	font-size: 1rem;
}

.kn-mega__col h4 {
	font-family: var(--ff-sans);
	font-size: 0.75rem;
	font-weight: 500;
	letter-spacing: 0.22em;
	text-transform: uppercase;
	color: var(--c-pierre);
	margin: 0 0 var(--sp-md);
}
.kn-mega__col ul li {
	border-bottom: var(--bd-hairline);
	padding: var(--sp-sm) 0;
}
.kn-mega__col ul li a {
	font-family: var(--ff-serif);
	font-size: 1.25rem;
	color: var(--c-noir);
}
.kn-mega__col ul li a:hover { color: var(--c-or-dark); }
.kn-mega__col ul li p {
	font-size: 0.8125rem;
	color: var(--c-pierre);
	margin: 4px 0 0;
}

@media (max-width: 1023px) { .kn-mega { display: none !important; } }

/* -------------------------------------------------------------------------
   3. HERO HOME V2.2 — typo majestueuse, watermark présent, citation déclamée
   ------------------------------------------------------------------------- */
.kn-hero { min-height: 100vh; }
.kn-hero__title {
	font-size: clamp(3rem, 7vw + 1.5rem, 8rem);
	line-height: 0.96;
	letter-spacing: -0.025em;
	margin-bottom: var(--sp-lg);
}
.kn-hero__title em { display: block; }

.kn-hero__quote {
	overflow: hidden;
}
.kn-hero__quote .kn-split__char {
	transition:
		transform 1200ms var(--ease-luxe),
		opacity   900ms ease-out;
}

/* Hero scroll indicator : plus discret, plus élégant, animation refinée */
.kn-hero__scroll {
	font-size: 0.75rem;
	letter-spacing: 0.22em;
}
@media (max-width: 767px) {
	.kn-hero { min-height: 92vh; }
	.kn-hero__title { letter-spacing: -0.02em; }
	.kn-hero__lede { font-size: 1.0625rem; }
}

/* -------------------------------------------------------------------------
   4. ASYMÉTRIE DUO (collection home)
   ------------------------------------------------------------------------- */
.kn-duo--asym {
	display: grid;
	grid-template-columns: 1fr;
	gap: var(--sp-2xl);
}
@media (min-width: 1024px) {
	.kn-duo--asym {
		grid-template-columns: 1.4fr 1fr;
		gap: var(--sp-3xl);
		align-items: stretch;
	}
	.kn-duo--asym .kn-duo__item--lead .kn-duo__media { aspect-ratio: 4 / 5.4; }
	.kn-duo--asym .kn-duo__item--companion { display: grid; align-content: end; }
	.kn-duo--asym .kn-duo__item--companion .kn-duo__media { aspect-ratio: 4 / 4.2; }
}

/* -------------------------------------------------------------------------
   5. SECTION "Le Savoir-Faire" (4 chapitres scroll horizontal sur mobile)
   ------------------------------------------------------------------------- */
.kn-savoir {
	padding: var(--sp-3xl) 0;
}
.kn-savoir__header {
	max-width: 620px;
	margin: 0 auto var(--sp-2xl);
	text-align: center;
	padding: 0 var(--gutter);
}
.kn-savoir__grid {
	display: grid;
	grid-template-columns: 1fr;
	gap: var(--sp-xl);
	max-width: var(--ct-wide);
	margin: 0 auto;
	padding: 0 var(--gutter);
}
@media (min-width: 768px)  { .kn-savoir__grid { grid-template-columns: repeat(2, 1fr); gap: var(--sp-2xl); } }
@media (min-width: 1024px) { .kn-savoir__grid { grid-template-columns: repeat(4, 1fr); gap: var(--sp-xl); } }

.kn-savoir__item { display: flex; flex-direction: column; }
.kn-savoir__media { aspect-ratio: 3 / 4; overflow: hidden; background: var(--c-ivoire-deep); margin-bottom: var(--sp-md); }
.kn-savoir__media img { width: 100%; height: 100%; object-fit: cover; }
.kn-savoir__num {
	font-family: var(--ff-serif);
	font-style: italic;
	color: var(--c-or-dark);
	font-size: 1rem;
	margin-bottom: var(--sp-2xs);
}
.kn-savoir__title {
	font-family: var(--ff-serif);
	font-size: 1.5rem;
	margin: 0 0 var(--sp-2xs);
}
.kn-savoir__txt {
	font-size: var(--fs-body-sm);
	color: var(--c-noir-soft);
	line-height: 1.65;
}

/* -------------------------------------------------------------------------
   6. SECTION "Engagement" (home + page dédiée)
   ------------------------------------------------------------------------- */
.kn-engagement {
	background: var(--c-creme);
	padding: var(--sp-3xl) 0;
}
.kn-engagement__inner {
	max-width: var(--ct-max);
	margin: 0 auto;
	padding: 0 var(--gutter);
	display: grid;
	grid-template-columns: 1fr;
	gap: var(--sp-xl);
	align-items: center;
}
@media (min-width: 1024px) {
	.kn-engagement__inner { grid-template-columns: 1fr 1.2fr; gap: var(--sp-3xl); }
}
.kn-engagement__txt h2 { margin-bottom: var(--sp-md); }
.kn-engagement__txt p { font-size: var(--fs-body-lg); color: var(--c-noir-soft); line-height: 1.7; }

.kn-engagement__points {
	display: grid;
	gap: var(--sp-md);
	margin-top: var(--sp-lg);
}
.kn-engagement__points li {
	display: flex;
	gap: var(--sp-sm);
	font-size: var(--fs-body);
}
.kn-engagement__points li::before {
	content: "";
	flex-shrink: 0;
	display: block;
	width: 10px;
	height: 10px;
	margin-top: 9px;
	background: var(--c-or);
	transform: rotate(45deg);
}

/* World map SVG container — V2.2 plus net */
.kn-worldmap {
	background: transparent;
	color: var(--c-noir);
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: var(--sp-md);
}
.kn-worldmap svg {
	width: 100%;
	height: auto;
	max-width: 720px;
}
.kn-worldmap .kn-wm-land { fill: var(--c-ivoire-deep); }
.kn-worldmap .kn-wm-point { fill: var(--c-or); }
.kn-worldmap__caption {
	font-family: var(--ff-serif);
	font-style: italic;
	color: var(--c-pierre);
	font-size: 0.9375rem;
	margin: 0;
	text-align: center;
	max-width: 38ch;
}

/* -------------------------------------------------------------------------
   7. SECTION "Le geste de l'atelier" (3 visuels)
   ------------------------------------------------------------------------- */
.kn-atelier {
	padding: var(--sp-3xl) 0;
}
.kn-atelier__grid {
	max-width: var(--ct-wide);
	margin: 0 auto;
	padding: 0 var(--gutter);
	display: grid;
	gap: var(--sp-md);
	grid-template-columns: 1fr;
}
@media (min-width: 768px)  {
	.kn-atelier__grid {
		grid-template-columns: 1.5fr 1fr 1fr;
		gap: var(--sp-md);
	}
}
.kn-atelier__item {
	position: relative;
	overflow: hidden;
	aspect-ratio: 3 / 4;
	background: var(--c-ivoire-deep);
}
.kn-atelier__item--lead { aspect-ratio: 3 / 4.5; }
@media (min-width: 768px) {
	.kn-atelier__item--lead { grid-row: span 2; aspect-ratio: auto; }
}
.kn-atelier__item img { width: 100%; height: 100%; object-fit: cover; transition: transform 1.2s var(--ease-luxe); }
.kn-atelier__item:hover img { transform: scale(1.04); }
.kn-atelier__caption {
	position: absolute;
	left: var(--sp-md);
	bottom: var(--sp-md);
	color: var(--c-ivoire);
	font-family: var(--ff-serif);
	font-style: italic;
	font-size: 1.0625rem;
	max-width: 16ch;
	line-height: 1.4;
	text-shadow: 0 1px 8px rgba(0,0,0,0.3);
}

/* -------------------------------------------------------------------------
   8. COLLECTION V2 — sticky filter sidebar + grille asymétrique
   ------------------------------------------------------------------------- */
.kn-collection-layout {
	display: grid;
	grid-template-columns: 1fr;
	gap: var(--sp-2xl);
}
@media (min-width: 1024px) {
	.kn-collection-layout { grid-template-columns: 220px 1fr; gap: var(--sp-3xl); }
}
.kn-collection-sidebar {
	display: none;
}
@media (min-width: 1024px) {
	.kn-collection-sidebar {
		display: block;
		position: sticky;
		top: calc(var(--header-h) + 24px);
		align-self: flex-start;
	}
}
.kn-collection-sidebar h3 {
	font-family: var(--ff-sans);
	font-size: 0.75rem;
	font-weight: 500;
	letter-spacing: 0.22em;
	text-transform: uppercase;
	color: var(--c-pierre);
	margin: 0 0 var(--sp-md);
}
.kn-collection-sidebar ul { display: grid; gap: var(--sp-xs); margin-bottom: var(--sp-lg); }
.kn-collection-sidebar li button {
	font-family: var(--ff-serif);
	font-size: 1.0625rem;
	color: var(--c-pierre);
	text-align: left;
	width: 100%;
	padding: 4px 0;
	transition: color var(--dur-fast) var(--ease-out);
}
.kn-collection-sidebar li button[aria-pressed="true"],
.kn-collection-sidebar li button:hover { color: var(--c-noir); }
.kn-collection-sidebar li button[disabled] { opacity: 0.4; cursor: not-allowed; font-style: italic; }

/* Filter drawer mobile */
.kn-filter-drawer-toggle {
	display: inline-flex;
	align-items: center;
	gap: var(--sp-2xs);
	font-size: var(--fs-overline);
	letter-spacing: 0.16em;
	text-transform: uppercase;
	color: var(--c-noir);
	padding: var(--sp-sm) 0;
	border-bottom: var(--bd-hairline);
	width: 100%;
	margin-bottom: var(--sp-md);
}
@media (min-width: 1024px) { .kn-filter-drawer-toggle { display: none; } }

/* Asymétrie de la grille produits */
.kn-products-grid--asym {
	display: grid;
	grid-template-columns: 1fr;
	gap: var(--sp-2xl);
}
@media (min-width: 768px) {
	.kn-products-grid--asym {
		grid-template-columns: 1fr 1fr;
		gap: var(--sp-xl);
		align-items: end;
	}
	.kn-products-grid--asym > article:nth-child(odd)  { margin-top: 0; }
	.kn-products-grid--asym > article:nth-child(even) { margin-top: var(--sp-3xl); }
}

/* -------------------------------------------------------------------------
   9. PRODUIT V2 — galerie full-bleed + sticky CTA mobile + sections édito
   ------------------------------------------------------------------------- */
.kn-product__gallery--v2 {
	display: grid;
	grid-template-columns: 1fr;
	gap: 4px;
}
@media (min-width: 768px) {
	.kn-product__gallery--v2 {
		grid-template-columns: 1fr 1fr;
		gap: 6px;
	}
	.kn-product__gallery--v2 > figure:first-child { grid-column: 1 / -1; }
}
.kn-product__gallery--v2 figure { margin: 0; overflow: hidden; background: var(--c-ivoire-deep); }
.kn-product__gallery--v2 img { width: 100%; height: 100%; aspect-ratio: 4 / 5; object-fit: cover; }

/* Sections éditoriales sous galerie : split full-bleed */
.kn-product-edito {
	display: grid;
	grid-template-columns: 1fr;
	gap: 0;
	margin: 0;
}
@media (min-width: 1024px) {
	.kn-product-edito { grid-template-columns: 1fr 1fr; min-height: 72vh; }
	.kn-product-edito--reverse > *:first-child { order: 2; }
}
.kn-product-edito__media { overflow: hidden; background: var(--c-ivoire-deep); }
.kn-product-edito__media img { width: 100%; height: 100%; object-fit: cover; aspect-ratio: 1 / 1; }
@media (min-width: 1024px) {
	.kn-product-edito__media img { aspect-ratio: auto; min-height: 72vh; }
}
.kn-product-edito__txt {
	padding: var(--sp-2xl) var(--gutter);
	display: flex;
	flex-direction: column;
	justify-content: center;
	max-width: 620px;
	margin: 0 auto;
}
.kn-product-edito__txt h2 {
	font-size: clamp(2rem, 3vw + 1rem, 3.25rem);
	margin-bottom: var(--sp-md);
}
.kn-product-edito__txt p {
	font-family: var(--ff-serif);
	font-style: italic;
	font-size: var(--fs-body-lg);
	color: var(--c-noir-soft);
	line-height: 1.7;
}

/* Section "Comment la porter" */
.kn-wear {
	padding: var(--sp-3xl) 0;
	background: var(--c-creme);
}
.kn-wear__grid {
	max-width: var(--ct-wide);
	margin: 0 auto;
	padding: 0 var(--gutter);
	display: grid;
	gap: var(--sp-md);
	grid-template-columns: 1fr;
}
@media (min-width: 768px) { .kn-wear__grid { grid-template-columns: repeat(3, 1fr); } }
.kn-wear__item { aspect-ratio: 3 / 4; overflow: hidden; background: var(--c-ivoire-deep); position: relative; }
.kn-wear__item img { width: 100%; height: 100%; object-fit: cover; }
.kn-wear__label {
	position: absolute;
	bottom: var(--sp-md);
	left: var(--sp-md);
	font-family: var(--ff-serif);
	font-style: italic;
	color: var(--c-ivoire);
	font-size: 1rem;
	letter-spacing: 0.02em;
	text-shadow: 0 1px 8px rgba(0,0,0,0.4);
}

/* Sticky CTA mobile sur fiche produit
   Cachée par défaut (desktop), visible uniquement < 1024px ET quand le CTA
   principal sort du viewport (le JS ajoute .is-visible).
*/
.kn-sticky-cta {
	display: none;
}
@media (max-width: 1023px) {
	.kn-sticky-cta {
		position: fixed;
		left: 0;
		right: 0;
		bottom: 0;
		z-index: 90;
		background: var(--c-ivoire);
		border-top: var(--bd-hairline);
		padding: var(--sp-sm) var(--gutter);
		display: flex;
		align-items: center;
		gap: var(--sp-sm);
		transform: translateY(110%);
		transition: transform var(--dur-base) var(--ease-luxe);
		box-shadow: 0 -1px 18px rgba(26, 26, 26, 0.06);
	}
	.kn-sticky-cta.is-visible {
		transform: translateY(0);
	}
	.kn-sticky-cta__thumb {
		width: 48px; height: 48px;
		object-fit: cover;
		flex-shrink: 0;
	}
	.kn-sticky-cta__info {
		flex: 1;
		min-width: 0;
		line-height: 1.2;
	}
	.kn-sticky-cta__name {
		font-family: var(--ff-serif);
		font-size: 1rem;
		color: var(--c-noir);
		display: block;
		white-space: nowrap;
		overflow: hidden;
		text-overflow: ellipsis;
	}
	.kn-sticky-cta__price {
		font-size: 0.875rem;
		color: var(--c-or-dark);
		display: block;
		margin-top: 2px;
	}
	.kn-sticky-cta__btn {
		padding: 14px 20px;
		font-size: 0.75rem;
		flex-shrink: 0;
	}
}

/* -------------------------------------------------------------------------
   10. PAGE LA MAISON — chapitrée (style VCA)
   ------------------------------------------------------------------------- */
.kn-chapter {
	padding: var(--sp-4xl) 0;
}
.kn-chapter__num {
	display: block;
	text-align: center;
	font-family: var(--ff-serif);
	font-style: italic;
	color: var(--c-or-dark);
	font-size: 1.5rem;
	margin-bottom: var(--sp-sm);
}
.kn-chapter__title {
	text-align: center;
	font-size: clamp(3rem, 6vw + 1rem, 6rem);
	font-weight: 300;
	letter-spacing: -0.02em;
	margin: 0 auto var(--sp-2xl);
	max-width: 14ch;
}
.kn-chapter__media {
	max-width: var(--ct-wide);
	margin: 0 auto var(--sp-2xl);
	padding: 0 var(--gutter);
}
.kn-chapter__media img { width: 100%; aspect-ratio: 16/9; object-fit: cover; }
.kn-chapter__body {
	max-width: var(--ct-text);
	margin: 0 auto;
	padding: 0 var(--gutter);
}
.kn-chapter__body p {
	font-family: var(--ff-serif);
	font-size: var(--fs-body-lg);
	color: var(--c-noir-soft);
	line-height: 1.8;
}

/* Timeline */
.kn-timeline {
	max-width: var(--ct-narrow);
	margin: var(--sp-2xl) auto 0;
	padding: 0 var(--gutter);
	position: relative;
}
.kn-timeline::before {
	content: "";
	position: absolute;
	left: 50%;
	top: 0;
	bottom: 0;
	width: 1px;
	background: var(--c-or);
	transform: translateX(-50%);
}
.kn-timeline__item {
	display: grid;
	grid-template-columns: 1fr 40px 1fr;
	gap: var(--sp-md);
	margin-bottom: var(--sp-xl);
	align-items: start;
}
.kn-timeline__year {
	font-family: var(--ff-serif);
	font-style: italic;
	color: var(--c-or-dark);
	text-align: right;
}
.kn-timeline__dot {
	width: 10px; height: 10px;
	background: var(--c-or);
	border-radius: 0;
	transform: rotate(45deg);
	margin: 8px auto 0;
}
.kn-timeline__txt {
	font-size: var(--fs-body);
	color: var(--c-noir-soft);
}
@media (max-width: 767px) {
	.kn-timeline::before { left: 14px; transform: none; }
	.kn-timeline__item { grid-template-columns: 28px 1fr; }
	.kn-timeline__year { display: block; grid-column: 1 / -1; text-align: left; padding-left: 28px; margin-bottom: 4px; }
	.kn-timeline__dot { margin: 0; }
}

/* -------------------------------------------------------------------------
   11. PAGE PRESSE
   ------------------------------------------------------------------------- */
.kn-press-grid {
	max-width: var(--ct-narrow);
	margin: 0 auto;
	padding: var(--sp-2xl) var(--gutter);
	display: grid;
	gap: var(--sp-lg);
}
.kn-press-item {
	display: grid;
	grid-template-columns: 1fr;
	gap: var(--sp-md);
	padding: var(--sp-md) 0;
	border-bottom: var(--bd-hairline);
}
@media (min-width: 768px) { .kn-press-item { grid-template-columns: 160px 1fr auto; align-items: center; } }
.kn-press-item__media { color: var(--c-pierre); font-family: var(--ff-serif); font-size: 0.875rem; letter-spacing: 0.16em; text-transform: uppercase; }
.kn-press-item__title { font-family: var(--ff-serif); font-style: italic; font-size: 1.125rem; color: var(--c-noir); margin: 0; }
.kn-press-item__date { font-size: var(--fs-caption); color: var(--c-pierre); }

/* -------------------------------------------------------------------------
   12. FOOTER ENRICHI — trust badges + sélecteur pays
   ------------------------------------------------------------------------- */
.kn-trust-badges {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: var(--sp-sm);
	margin-top: var(--sp-lg);
	padding-top: var(--sp-lg);
	border-top: 1px solid rgba(239, 233, 220, 0.1);
}
@media (max-width: 480px) {
	.kn-trust-badges { gap: var(--sp-xs); }
}
.kn-trust-badge {
	font-size: 0.6875rem;
	letter-spacing: 0.12em;
	text-transform: uppercase;
	color: var(--c-or-pale);
	opacity: 0.85;
	line-height: 1.35;
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	gap: 6px;
}
.kn-trust-badge svg { color: var(--c-or); flex-shrink: 0; }

.kn-country-selector {
	display: inline-flex;
	align-items: center;
	gap: var(--sp-2xs);
	color: var(--c-or-pale);
	font-size: 0.75rem;
	letter-spacing: 0.14em;
	text-transform: uppercase;
	padding: var(--sp-2xs) 0;
	cursor: pointer;
	border: 0;
	background: transparent;
}
.kn-country-selector:hover { color: var(--c-or); }

/* -------------------------------------------------------------------------
   13. CHECKOUT V2 — résumé visuel + Stripe Express positionnement
   ------------------------------------------------------------------------- */
.woocommerce-checkout #order_review {
	background: var(--c-creme);
	padding: var(--sp-lg);
	position: sticky;
	top: calc(var(--header-h) + 24px);
	align-self: flex-start;
}
.kn-stripe-express {
	margin-bottom: var(--sp-lg);
	padding-bottom: var(--sp-lg);
	border-bottom: var(--bd-hairline);
}
.kn-stripe-express__label {
	font-size: var(--fs-overline);
	letter-spacing: 0.18em;
	text-transform: uppercase;
	color: var(--c-pierre);
	margin: 0 0 var(--sp-sm);
	text-align: center;
}

/* Timeline livraison (thank-you) */
.kn-delivery-timeline {
	margin: var(--sp-2xl) auto;
	max-width: 540px;
	display: grid;
	gap: var(--sp-md);
}
.kn-delivery-timeline__step {
	display: grid;
	grid-template-columns: 36px 1fr auto;
	gap: var(--sp-md);
	align-items: center;
	padding: var(--sp-sm) 0;
	border-bottom: var(--bd-hairline);
}
.kn-delivery-timeline__step:last-child { border: 0; }
.kn-delivery-timeline__step::before {
	content: "";
	width: 10px;
	height: 10px;
	background: var(--c-or);
	transform: rotate(45deg);
}
.kn-delivery-timeline__step.is-done::before {
	background: var(--c-success);
}
.kn-delivery-timeline__label {
	font-family: var(--ff-serif);
	font-size: 1rem;
}
.kn-delivery-timeline__date {
	font-size: var(--fs-caption);
	color: var(--c-pierre);
	font-family: var(--ff-sans);
	letter-spacing: 0.04em;
}

/* -------------------------------------------------------------------------
   14. CARTE ENGAGEMENT — points or
   ------------------------------------------------------------------------- */
/* Pulse anchor sur Paris (cercle expansif) */
@keyframes kn-wm-pulse {
	0%   { transform: scale(0.6); opacity: 0.9; }
	100% { transform: scale(2.2); opacity: 0;   }
}
.kn-worldmap .kn-wm-pulse {
	transform-origin: 488px 135px;
	animation: kn-wm-pulse 2.6s ease-out infinite;
}
/* Points origines : pulsation très discrète */
@keyframes kn-pulse-gold {
	0%, 100% { opacity: 0.7; }
	50%      { opacity: 1;   }
}
.kn-worldmap .kn-wm-point {
	animation: kn-pulse-gold 3.2s ease-in-out infinite;
	transform-origin: center;
}

/* -------------------------------------------------------------------------
   15. SECTION ORNEMENT — séparateur or avec losange central
   V2.2 : trait plus long, dégradé subtil pour effet "filet de maison"
   ------------------------------------------------------------------------- */
.kn-rule {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: var(--sp-md);
	margin: var(--sp-lg) auto;
	max-width: 260px;
}
.kn-rule::before, .kn-rule::after {
	content: "";
	flex: 1;
	height: 1px;
	background: linear-gradient(to right, transparent, var(--c-or) 80%);
}
.kn-rule::after { background: linear-gradient(to left, transparent, var(--c-or) 80%); }
.kn-rule__diamond {
	width: 7px;
	height: 7px;
	background: var(--c-or);
	transform: rotate(45deg);
	flex-shrink: 0;
	box-shadow: 0 0 0 1px var(--c-or-pale);
}

/* -------------------------------------------------------------------------
   16. IMAGE LOADING SKELETON
   ------------------------------------------------------------------------- */
.kn-skeleton {
	background: linear-gradient(90deg, var(--c-ivoire-deep) 0%, var(--c-creme) 50%, var(--c-ivoire-deep) 100%);
	background-size: 200% 100%;
	animation: kn-skeleton 1.4s ease-in-out infinite;
}
@keyframes kn-skeleton {
	to { background-position: -200% 0; }
}