/* =========================================================
   EYOKON — Bolt CSS v3
   Styles principaux pour toutes les pages et sections.
   Reproduction fidèle du design project/ (React/Tailwind).
   ========================================================= */

/* =====================================================
   HERO PATTERN (dot overlay)
   ===================================================== */
.eyokon-hero-pattern {
	background-image: url("data:image/svg+xml,%3Csvg width='60' height='60' viewBox='0 0 60 60' xmlns='http://www.w3.org/2000/svg'%3E%3Cg fill='none' fill-rule='evenodd'%3E%3Cg fill='%2322A05A' fill-opacity='0.04'%3E%3Ccircle cx='30' cy='30' r='2'/%3E%3C/g%3E%3C/g%3E%3C/svg%3E");
}

/* =====================================================
   PAGE HERO (dark hero for inner pages)
   ===================================================== */
.eyk-page-hero {
	background: var(--ey-earth-900);
	color: #fff;
	padding: 8rem 0 4rem;
}
@media (min-width: 1024px) {
	.eyk-page-hero {
		padding: 9.5rem 0 4rem;
	}
}
.eyk-page-hero--tall { padding: 10rem 0 6rem; }
@media (min-width: 1024px) {
	.eyk-page-hero--tall {
		padding: 11.5rem 0 6rem;
	}
}
.eyk-page-hero--with-image {
	position: relative;
	overflow: hidden;
}
.eyk-page-hero__bg {
	position: absolute;
	inset: 0;
	background-size: cover;
	background-position: center;
	opacity: 0.2;
}
.eyk-page-hero__content { position: relative; z-index: 1; }
.eyk-page-hero h1 {
	font-family: var(--eyokon-font-display);
	font-size: 3rem;
	font-weight: 600;
	color: #fff;
	line-height: 1.1;
	margin-bottom: 1rem;
}
@media (min-width: 640px) { .eyk-page-hero h1 { font-size: 3.75rem; } }
.eyk-page-hero p {
	color: var(--ey-earth-300);
	font-family: var(--eyokon-font-sans);
	font-size: 1.125rem;
	max-width: 36rem;
	line-height: 1.625;
}

/* =====================================================
   HOME — HERO
   ===================================================== */
.eyokon-home-hero {
	position: relative;
	min-height: 100vh;
	display: flex;
	align-items: center;
	justify-content: center;
	overflow: hidden;
	padding-top: 5rem;
}
@media (min-width: 1024px) {
	.eyokon-home-hero {
		padding-top: 6rem;
	}
}
.eyokon-home-hero__bg {
	position: absolute;
	inset: 0;
	background-size: cover;
	background-position: center;
	background-repeat: no-repeat;
}
.eyokon-home-hero__overlay {
	position: absolute;
	inset: 0;
	background: linear-gradient(135deg, rgba(5,46,22,.8) 0%, rgba(20,83,45,.6) 50%, rgba(23,128,72,.7) 100%);
}
.eyokon-home-hero__pattern {
	position: absolute;
	inset: 0;
	opacity: 0.3;
}
.eyokon-home-hero__content {
	position: relative;
	z-index: 10;
	max-width: 64rem;
	margin: -2.5rem auto 0;
	padding: 0 1rem;
	text-align: center;
}
@media (min-width: 640px) { .eyokon-home-hero__content { padding: 0 1.5rem; margin-top: -2rem; } }
@media (min-width: 1024px) { .eyokon-home-hero__content { padding: 0 2rem; margin-top: -1rem; } }

/* Hero badge */
.eyokon-home-hero__badge {
	display: inline-flex;
	align-items: center;
	gap: 0.5rem;
	padding: 0.5rem 1rem;
	background: rgba(255,255,255,.1);
	backdrop-filter: blur(4px);
	border: 1px solid rgba(255,255,255,.2);
	border-radius: var(--eyokon-radius);
	margin-bottom: 2rem;
	color: var(--ey-primary-300);
}
.eyokon-home-hero__badge span {
	font-size: 0.875rem;
	font-family: var(--eyokon-font-sans);
	color: rgba(255,255,255,.9);
	letter-spacing: 0.025em;
}

/* Hero title */
.eyokon-home-hero h1 {
	font-family: var(--eyokon-font-display);
	font-size: 3rem;
	font-weight: 600;
	color: #fff;
	line-height: 1.1;
	margin-bottom: 1.5rem;
}
@media (min-width: 640px) { .eyokon-home-hero h1 { font-size: 3.75rem; } }
@media (min-width: 1024px) { .eyokon-home-hero h1 { font-size: 4.5rem; } }
.eyokon-home-hero h1 em {
	color: var(--ey-primary-300);
	font-style: italic;
}

/* Hero subtitle */
.eyokon-home-hero__subtitle {
	font-size: 1.125rem;
	color: rgba(255,255,255,.75);
	font-family: var(--eyokon-font-sans);
	font-weight: 300;
	max-width: 42rem;
	margin: 0 auto 2.5rem;
	line-height: 1.625;
}
@media (min-width: 640px) { .eyokon-home-hero__subtitle { font-size: 1.25rem; } }
 
/* Hero CTA */
.eyokon-home-hero__cta {
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	gap: 1rem;
}
@media (min-width: 640px) { .eyokon-home-hero__cta { flex-direction: row; } }

/* Hero stats */
.eyokon-home-hero__stats {
	margin-top: 3rem;
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	gap: 2rem;
}
.eyokon-home-hero__stat-value {
	font-family: var(--eyokon-font-display);
	font-size: 1.875rem;
	font-weight: 600;
	color: var(--ey-primary-300);
}
.eyokon-home-hero__stat-label {
	font-size: 0.875rem;
	color: rgba(255,255,255,.6);
	font-family: var(--eyokon-font-sans);
	margin-top: 0.125rem;
}

/* Hero scroll indicator */
.eyokon-home-hero__scroll {
	position: absolute;
	bottom: 2rem;
	left: 50%;
	transform: translateX(-50%);
	color: rgba(255,255,255,.5);
	transition: color 200ms;
	text-decoration: none;
}
.eyokon-home-hero__scroll:hover { color: rgba(255,255,255,.8); }

/* =====================================================
   HOME — FEATURES STRIP
   ===================================================== */
.eyokon-features {
	background: var(--ey-primary-700);
	color: #fff;
}
.eyokon-features__grid {
	display: grid;
	grid-template-columns: repeat(2, 1fr);
}
@media (min-width: 1024px) {
	.eyokon-features__grid { grid-template-columns: repeat(4, 1fr); }
}
.eyokon-features__item {
	padding: 1.25rem 1.5rem;
	text-align: center;
	border-right: 1px solid var(--ey-primary-500);
}
.eyokon-features__item:last-child { border-right: none; }
@media (max-width: 1023px) {
	.eyokon-features__item:nth-child(2) { border-right: none; }
	.eyokon-features__item:nth-child(3),
	.eyokon-features__item:nth-child(4) { border-top: 1px solid var(--ey-primary-500); }
}
.eyokon-features__icon {
	display: flex;
	justify-content: center;
	margin-bottom: 0.5rem;
	color: var(--ey-primary-200);
}
.eyokon-features__title {
	font-family: var(--eyokon-font-display);
	font-size: 0.875rem;
	font-weight: 600;
	color: #fff;
}
.eyokon-features__desc {
	font-size: 0.75rem;
	color: var(--ey-primary-200);
	margin-top: 0.125rem;
	font-family: var(--eyokon-font-sans);
}

/* =====================================================
   HOME — FEATURED PRODUCTS
   ===================================================== */
.eyokon-featured { padding: 5rem 0; background: var(--ey-earth-50); }
.eyokon-featured__header {
	display: flex;
	flex-direction: column;
	gap: 1rem;
	margin-bottom: 3rem;
}
@media (min-width: 640px) {
	.eyokon-featured__header {
		flex-direction: row;
		align-items: flex-end;
		justify-content: space-between;
	}
}
.eyokon-featured__header h2 {
	font-family: var(--eyokon-font-display);
	font-size: 2.5rem;
	font-weight: 600;
	color: var(--ey-earth-900);
}
@media (min-width: 640px) { .eyokon-featured__header h2 { font-size: 3rem; } }
.eyokon-featured__header p {
	color: var(--ey-earth-500);
	margin-top: 0.75rem;
	font-family: var(--eyokon-font-sans);
	max-width: 32rem;
}
.eyokon-featured__empty {
	text-align: center;
	padding: 3rem 0;
	color: var(--ey-earth-400);
}
.eyokon-featured__empty p {
	font-family: var(--eyokon-font-display);
	font-size: 1.125rem;
}

/* =====================================================
   HOME — FEATURED CAROUSEL
   ===================================================== */
.eyk-carousel {
	position: relative;
	user-select: none;
	padding: 0 2rem;
}
@media (max-width: 639px) {
	.eyk-carousel { padding: 0; }
}
.eyk-carousel__track-wrap {
	overflow: hidden;
	border-radius: var(--eyokon-radius);
}
.eyk-carousel__track {
	display: flex;
	gap: 1.5rem;
	width: 100%;
	transition: transform 420ms cubic-bezier(0.25, 0.46, 0.45, 0.94);
	will-change: transform;
	cursor: grab;
}
.eyk-carousel__track:active { cursor: grabbing; }
.eyk-carousel__slide {
	flex: 0 0 auto;
	min-width: 0;
}

/* Flèches */
.eyk-carousel__arrow {
	position: absolute;
	top: 50%;
	transform: translateY(-50%);
	z-index: 10;
	width: 2.75rem;
	height: 2.75rem;
	border-radius: 50%;
	border: none;
	background: #fff;
	box-shadow: 0 2px 12px rgba(0,0,0,.14);
	display: flex;
	align-items: center;
	justify-content: center;
	cursor: pointer;
	color: var(--ey-earth-800);
	transition: background 200ms, box-shadow 200ms, transform 200ms;
}
.eyk-carousel__arrow:hover {
	background: var(--ey-primary-600);
	color: #fff;
	box-shadow: 0 4px 16px rgba(0,0,0,.2);
}
.eyk-carousel__arrow:active { transform: translateY(-50%) scale(.93); }
.eyk-carousel__arrow--prev { left: 0; }
.eyk-carousel__arrow--next { right: 0; }
.eyk-carousel__arrow[disabled] {
	opacity: 0.35;
	pointer-events: none;
}

/* Dots */
.eyk-carousel__dots {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 0.5rem;
	margin-top: 2rem;
}
.eyk-carousel__dot {
	width: 0.5rem;
	height: 0.5rem;
	border-radius: 999px;
	border: none;
	background: var(--ey-earth-200);
	cursor: pointer;
	padding: 0;
	transition: background 200ms, width 200ms, opacity 200ms;
}
.eyk-carousel__dot.is-active {
	background: var(--ey-primary-600);
	width: 1.5rem;
}
.eyk-carousel__dot:hover:not(.is-active) {
	background: var(--ey-earth-400);
}

/* =====================================================
   HOME — GALERIE TICKER INFINI
   ===================================================== */
.eyokon-gallery {
	padding: 5rem 0;
	background: var(--ey-earth-50);
}

/* Conteneur masque — cache le débordement */
.eyk-ticker__mask {
	overflow: hidden;
	width: 100%;
	/* Dégradés latéraux pour effet fondu */
	-webkit-mask-image: linear-gradient(to right, transparent 0%, black 8%, black 92%, transparent 100%);
	mask-image: linear-gradient(to right, transparent 0%, black 8%, black 92%, transparent 100%);
}

/* Track qui défile — contient 2× les slides */
.eyk-ticker__track {
	display: flex;
	gap: 1.5rem;
	width: max-content;
	animation: eyk-ticker-scroll 28s linear infinite;
	will-change: transform;
}
.eyk-ticker__track:hover {
	animation-play-state: paused;
}

@keyframes eyk-ticker-scroll {
	0%   { transform: translateX(0); }
	100% { transform: translateX(-50%); }
}

/* Chaque item */
.eyk-ticker__item {
	flex: 0 0 auto;
	width: 340px;
}
@media (max-width: 767px) {
	.eyk-ticker__item { width: 260px; }
}
@media (max-width: 479px) {
	.eyk-ticker__item { width: 200px; }
}

/* Boîte image */
.eyk-gallery-slide__inner {
	position: relative;
	overflow: hidden;
	border-radius: 12px;
	aspect-ratio: 3 / 2;
	max-height: 260px;
	background: var(--ey-earth-100);
	box-shadow: 0 2px 16px rgba(0,0,0,.08);
	transition: box-shadow 300ms;
}
.eyk-gallery-slide__inner:hover {
	box-shadow: 0 8px 32px rgba(0,0,0,.18);
}
.eyk-gallery-slide__inner img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	display: block;
	transition: transform 500ms cubic-bezier(0.25, 0.46, 0.45, 0.94);
}
.eyk-gallery-slide__inner:hover img {
	transform: scale(1.06);
}
.eyk-gallery-slide__caption {
	position: absolute;
	bottom: 0;
	left: 0;
	right: 0;
	background: linear-gradient(to top, rgba(0,0,0,.65) 0%, transparent 100%);
	padding: 2rem 1rem 0.875rem;
	display: flex;
	align-items: flex-end;
}
.eyk-gallery-slide__caption span {
	font-family: var(--eyokon-font-sans);
	font-size: 0.8125rem;
	font-weight: 600;
	color: #fff;
	letter-spacing: 0.03em;
	text-shadow: 0 1px 3px rgba(0,0,0,.4);
}

/* =====================================================
   HOME — ABOUT SNIPPET
   ===================================================== */
.eyokon-about-snippet { padding: 5rem 0; background: #fff; }
.eyokon-about-snippet__grid {
	display: grid;
	grid-template-columns: 1fr;
	gap: 4rem;
	align-items: center;
}
@media (min-width: 1024px) { .eyokon-about-snippet__grid { grid-template-columns: 1fr 1fr; } }

.eyokon-about-snippet h2 {
	font-family: var(--eyokon-font-display);
	font-size: 2.5rem;
	font-weight: 600;
	color: var(--ey-earth-900);
	line-height: 1.15;
	margin-bottom: 1.5rem;
}
@media (min-width: 640px) { .eyokon-about-snippet h2 { font-size: 3rem; } }

.eyokon-about-snippet__text p {
	color: var(--ey-earth-600);
	font-family: var(--eyokon-font-sans);
	line-height: 1.625;
	margin-bottom: 1rem;
}
.eyokon-about-snippet__features {
	display: grid;
	grid-template-columns: repeat(2, 1fr);
	gap: 1.5rem;
	margin-bottom: 2rem;
}
.eyokon-about-snippet__feature {
	display: flex;
	align-items: flex-start;
	gap: 0.75rem;
}
.eyokon-about-snippet__feature svg { color: var(--ey-primary-600); flex-shrink: 0; margin-top: 0.125rem; }
.eyokon-about-snippet__feature-title {
	font-family: var(--eyokon-font-sans);
	font-size: 0.875rem;
	font-weight: 600;
	color: var(--ey-earth-900);
}
.eyokon-about-snippet__feature-desc {
	font-size: 0.75rem;
	color: var(--ey-earth-500);
	margin-top: 0.125rem;
}

/* Image side with floating cards */
.eyokon-about-snippet__image { position: relative; }
.eyokon-about-snippet__image img {
	width: 100%;
	aspect-ratio: 4/5;
	object-fit: cover;
	border-radius: var(--eyokon-radius);
}
.eyokon-about-snippet__image::after {
	content: '';
	position: absolute;
	inset: 0;
	background: linear-gradient(to top, rgba(42,30,22,.4), transparent);
	border-radius: var(--eyokon-radius);
	pointer-events: none;
}
.eyokon-about-snippet__float-km {
	position: absolute;
	bottom: -1.5rem;
	left: -1.5rem;
	background: var(--ey-primary-600);
	color: #fff;
	padding: 1.25rem;
	border-radius: var(--eyokon-radius);
	box-shadow: var(--eyokon-shadow-xl);
	z-index: 2;
}
.eyokon-about-snippet__float-km strong {
	font-family: var(--eyokon-font-display);
	font-size: 1.875rem;
	font-weight: 700;
	display: block;
}
.eyokon-about-snippet__float-km span {
	font-size: 0.75rem;
	color: var(--ey-primary-200);
	font-family: var(--eyokon-font-sans);
}
.eyokon-about-snippet__float-rating {
	position: absolute;
	top: -1rem;
	right: -1rem;
	background: #fff;
	border: 1px solid var(--ey-earth-100);
	box-shadow: var(--eyokon-shadow-lg);
	border-radius: var(--eyokon-radius);
	padding: 1rem;
	z-index: 2;
}
.eyokon-about-snippet__float-rating-stars { display: flex; align-items: center; gap: 0.125rem; margin-bottom: 0.25rem; }
.eyokon-about-snippet__float-rating p {
	font-size: 0.75rem;
	font-weight: 500;
	color: var(--ey-earth-900);
	font-family: var(--eyokon-font-sans);
}
.eyokon-about-snippet__float-rating small {
	font-size: 10px;
	color: var(--ey-earth-400);
}

/* =====================================================
   HOME — CATEGORIES (filières)
   ===================================================== */
.eyokon-categories { padding: 5rem 0; background: var(--ey-earth-50); }
.eyokon-categories__grid {
	display: grid;
	grid-template-columns: 1fr;
	gap: 1.5rem;
}
@media (min-width: 768px) { .eyokon-categories__grid { grid-template-columns: repeat(2, 1fr); } }

.eyokon-categories__card {
	position: relative;
	overflow: hidden;
	border-radius: var(--eyokon-radius);
	aspect-ratio: 16/9;
	display: flex;
	align-items: flex-end;
	text-decoration: none;
	color: #fff;
}
.eyokon-categories__card img {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	object-fit: cover;
	transition: transform 500ms;
}
.eyokon-categories__card:hover img { transform: scale(1.05); }
.eyokon-categories__card-overlay {
	position: absolute;
	inset: 0;
}
.eyokon-categories__card-overlay--primary {
	background: linear-gradient(to top, rgba(16,66,40,.7), transparent);
}
.eyokon-categories__card-overlay--secondary {
	background: linear-gradient(to top, rgba(30,68,32,.7), transparent);
}
.eyokon-categories__card-content {
	position: relative;
	z-index: 10;
	padding: 2rem;
}
.eyokon-categories__card-subtitle {
	font-size: 0.75rem;
	font-family: var(--eyokon-font-sans);
	font-weight: 600;
	letter-spacing: 0.1em;
	text-transform: uppercase;
	color: rgba(255,255,255,.7);
	margin-bottom: 0.25rem;
}
.eyokon-categories__card-content h3 {
	font-family: var(--eyokon-font-display);
	font-size: 1.5rem;
	font-weight: 600;
	color: #fff;
	margin-bottom: 0.5rem;
}
.eyokon-categories__card-desc {
	font-size: 0.875rem;
	color: rgba(255,255,255,.7);
	font-family: var(--eyokon-font-sans);
	line-height: 1.625;
	margin-bottom: 1rem;
	max-width: 20rem;
}
.eyokon-categories__card-link {
	display: inline-flex;
	align-items: center;
	gap: 0.5rem;
	font-size: 0.875rem;
	color: #fff;
	font-weight: 500;
	transition: gap 200ms;
}
.eyokon-categories__card:hover .eyokon-categories__card-link { gap: 0.75rem; }

/* =====================================================
   HOME — B2B
   ===================================================== */
.eyokon-b2b {
	padding: 5rem 0;
	background: var(--ey-earth-900);
	color: #fff;
	position: relative;
	overflow: hidden;
}
.eyokon-b2b__pattern {
	position: absolute;
	inset: 0;
	opacity: 0.2;
}
.eyokon-b2b__inner { position: relative; }
.eyokon-b2b__grid {
	display: grid;
	grid-template-columns: 1fr;
	gap: 3rem;
	align-items: center;
}
@media (min-width: 1024px) { .eyokon-b2b__grid { grid-template-columns: 1fr 1fr; } }

.eyokon-b2b h2 {
	font-family: var(--eyokon-font-display);
	font-size: 2.5rem;
	font-weight: 600;
	line-height: 1.15;
	margin-bottom: 1.5rem;
}
@media (min-width: 640px) { .eyokon-b2b h2 { font-size: 3rem; } }
.eyokon-b2b__desc {
	color: var(--ey-earth-300);
	font-family: var(--eyokon-font-sans);
	line-height: 1.625;
	margin-bottom: 1.5rem;
}
.eyokon-b2b__list {
	list-style: none;
	padding: 0;
	margin: 0 0 2rem;
}
.eyokon-b2b__list li {
	display: flex;
	align-items: flex-start;
	gap: 0.75rem;
	font-size: 0.875rem;
	color: var(--ey-earth-300);
	font-family: var(--eyokon-font-sans);
	margin-bottom: 0.75rem;
}
.eyokon-b2b__list-dot {
	width: 0.375rem;
	height: 0.375rem;
	border-radius: 50%;
	background: var(--ey-primary-400);
	margin-top: 0.375rem;
	flex-shrink: 0;
}

.eyokon-b2b__stats {
	display: grid;
	grid-template-columns: repeat(2, 1fr);
	gap: 1rem;
}
.eyokon-b2b__stat {
	background: rgba(94,69,48,.6);
	border: 1px solid var(--ey-earth-700);
	border-radius: var(--eyokon-radius);
	padding: 1.25rem;
}
.eyokon-b2b__stat-value {
	font-family: var(--eyokon-font-display);
	font-size: 1.875rem;
	font-weight: 700;
	color: var(--ey-primary-300);
	margin-bottom: 0.25rem;
}
.eyokon-b2b__stat-label {
	font-size: 0.875rem;
	font-weight: 600;
	color: #fff;
	font-family: var(--eyokon-font-sans);
}
.eyokon-b2b__stat-sub {
	font-size: 0.75rem;
	color: var(--ey-earth-400);
	margin-top: 0.125rem;
	font-family: var(--eyokon-font-sans);
}

/* =====================================================
   HOME — DELIVERY
   ===================================================== */
.eyokon-delivery { padding: 5rem 0; background: #fff; }
.eyokon-delivery__grid {
	display: grid;
	grid-template-columns: 1fr;
	gap: 1.5rem;
}
@media (min-width: 768px) { .eyokon-delivery__grid { grid-template-columns: repeat(3, 1fr); } }

.eyokon-delivery__card {
	background: var(--ey-earth-50);
	border: 1px solid var(--ey-earth-100);
	border-radius: var(--eyokon-radius);
	padding: 1.5rem;
	transition: box-shadow 300ms, transform 300ms;
}
.eyokon-delivery__card:hover {
	box-shadow: var(--eyokon-shadow-lg);
	transform: translateY(-2px);
}
.eyokon-delivery__card-icon {
	width: 3rem;
	height: 3rem;
	background: var(--ey-primary-100);
	border-radius: var(--eyokon-radius);
	display: flex;
	align-items: center;
	justify-content: center;
	margin-bottom: 1rem;
	color: var(--ey-primary-600);
}
.eyokon-delivery__card-tag {
	display: inline-block;
	padding: 0.125rem 0.5rem;
	background: var(--ey-primary-100);
	color: var(--ey-primary-700);
	font-size: 0.75rem;
	font-family: var(--eyokon-font-sans);
	font-weight: 600;
	border-radius: var(--eyokon-radius);
	margin-bottom: 0.75rem;
}
.eyokon-delivery__card h3 {
	font-family: var(--eyokon-font-display);
	font-size: 1.125rem;
	font-weight: 600;
	color: var(--ey-earth-900);
	margin-bottom: 0.5rem;
}
.eyokon-delivery__card p {
	font-size: 0.875rem;
	color: var(--ey-earth-500);
	font-family: var(--eyokon-font-sans);
	line-height: 1.625;
}

/* =====================================================
   HOME — PLANTATIONS
   ===================================================== */
.eyokon-plantations { padding: 5rem 0; background: #fff; }
.eyokon-plantations__grid {
	display: grid;
	grid-template-columns: 1fr;
	gap: 0;
	border-radius: var(--eyokon-radius);
	overflow: hidden;
	box-shadow: var(--eyokon-shadow-lg);
}
@media (min-width: 1024px) { .eyokon-plantations__grid { grid-template-columns: 1fr 1fr; } }

.eyokon-plantations__card {
	position: relative;
	overflow: hidden;
}
.eyokon-plantations__card-img {
	aspect-ratio: 4/3;
	overflow: hidden;
}
@media (min-width: 1024px) {
	.eyokon-plantations__card-img {
		aspect-ratio: auto;
		height: 480px;
	}
}
.eyokon-plantations__card-img img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	transition: transform 700ms;
}
.eyokon-plantations__card:hover .eyokon-plantations__card-img img {
	transform: scale(1.05);
}
.eyokon-plantations__card-overlay {
	position: absolute;
	inset: 0;
	background: linear-gradient(to top, rgba(5,46,22,.85) 0%, rgba(20,83,45,.3) 50%, transparent 100%);
}
.eyokon-plantations__card-content {
	position: absolute;
	bottom: 0;
	left: 0;
	right: 0;
	padding: 2rem;
}
.eyokon-plantations__card-badge {
	display: inline-block;
	padding: 0.25rem 0.75rem;
	border: 1px solid rgba(62,187,117,.4);
	background: rgba(34,160,90,.3);
	color: var(--ey-primary-200);
	font-size: 0.75rem;
	font-family: var(--eyokon-font-sans);
	font-weight: 600;
	letter-spacing: 0.1em;
	text-transform: uppercase;
	border-radius: var(--eyokon-radius);
	margin-bottom: 0.75rem;
}
.eyokon-plantations__card-badge--terracotta {
	border-color: rgba(245,200,32,.4);
	background: rgba(224,174,10,.3);
	color: var(--ey-terracotta-200);
}
.eyokon-plantations__card-content h3 {
	font-family: var(--eyokon-font-display);
	font-size: 1.875rem;
	font-weight: 600;
	color: #fff;
	margin-bottom: 0.5rem;
}
.eyokon-plantations__card-content p {
	color: rgba(255,255,255,.7);
	font-family: var(--eyokon-font-sans);
	font-size: 0.875rem;
	line-height: 1.625;
}

/* =====================================================
   HOME — REFERENCES
   ===================================================== */
.eyokon-references {
	padding: 4rem 0;
	background: var(--ey-earth-50);
	border-top: 1px solid var(--ey-earth-100);
}
.eyokon-references__list {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	align-items: center;
	gap: 2rem;
}
@media (min-width: 1024px) { .eyokon-references__list { gap: 4rem; } }
.eyokon-references__item {
	font-family: var(--eyokon-font-display);
	font-size: 1.125rem;
	font-weight: 600;
	color: var(--ey-earth-400);
}

/* =====================================================
   HOME — CTA
   ===================================================== */
.eyokon-cta {
	padding: 5rem 0;
	background: var(--ey-primary-600);
	text-align: center;
}
.eyokon-cta h2 {
	font-family: var(--eyokon-font-display);
	font-size: 2.5rem;
	font-weight: 600;
	color: #fff;
	margin-bottom: 1rem;
}
@media (min-width: 640px) { .eyokon-cta h2 { font-size: 3rem; } }
.eyokon-cta p {
	color: var(--ey-primary-100);
	font-family: var(--eyokon-font-sans);
	font-size: 1.125rem;
	margin-bottom: 2rem;
	line-height: 1.625;
}
.eyokon-cta__buttons {
	display: flex;
	flex-direction: column;
	gap: 1rem;
	justify-content: center;
}
@media (min-width: 640px) { .eyokon-cta__buttons { flex-direction: row; } }

/* =====================================================
   ABOUT PAGE
   ===================================================== */
.eyokon-about-story { padding: 5rem 0; background: #fff; }
.eyokon-about-story__grid {
	display: grid;
	grid-template-columns: 1fr;
	gap: 4rem;
	align-items: center;
}
@media (min-width: 1024px) { .eyokon-about-story__grid { grid-template-columns: 1fr 1fr; } }

.eyokon-about-story__image { position: relative; }
.eyokon-about-story__image img {
	width: 100%;
	aspect-ratio: 3/4;
	object-fit: cover;
	border-radius: var(--eyokon-radius);
}
.eyokon-about-story__float {
	position: absolute;
	bottom: 1.5rem;
	right: 1.5rem;
	background: #fff;
	box-shadow: var(--eyokon-shadow-xl);
	border-radius: var(--eyokon-radius);
	padding: 1rem;
	border: 1px solid var(--ey-earth-100);
}
.eyokon-about-story__float svg { color: var(--ey-primary-600); margin-bottom: 0.5rem; }
.eyokon-about-story__float strong {
	font-family: var(--eyokon-font-display);
	font-size: 1.5rem;
	font-weight: 700;
	color: var(--ey-earth-900);
	display: block;
}
.eyokon-about-story__float span {
	font-size: 0.75rem;
	color: var(--ey-earth-500);
	font-family: var(--eyokon-font-sans);
}

.eyokon-about-story__text h2 {
	font-family: var(--eyokon-font-display);
	font-size: 2.5rem;
	font-weight: 600;
	color: var(--ey-earth-900);
	margin-bottom: 1.5rem;
}
.eyokon-about-story__text p {
	color: var(--ey-earth-600);
	font-family: var(--eyokon-font-sans);
	line-height: 1.625;
	margin-bottom: 1rem;
}

/* About — Locations */
.eyokon-about-locations { padding: 5rem 0; background: var(--ey-earth-50); }
.eyokon-about-locations__card {
	background: #fff;
	border: 1px solid var(--ey-earth-100);
	border-radius: var(--eyokon-radius);
	overflow: hidden;
	transition: box-shadow 300ms, transform 300ms;
}
.eyokon-about-locations__card:hover {
	box-shadow: var(--eyokon-shadow-lg);
	transform: translateY(-2px);
}
.eyokon-about-locations__card img {
	width: 100%;
	aspect-ratio: 16/9;
	object-fit: cover;
}
.eyokon-about-locations__card-body { padding: 1.5rem; }
.eyokon-about-locations__card-meta {
	display: flex;
	align-items: center;
	gap: 0.5rem;
	margin-bottom: 0.75rem;
}
.eyokon-about-locations__card-location {
	display: flex;
	align-items: center;
	gap: 0.25rem;
	font-size: 0.875rem;
	color: var(--ey-earth-500);
	font-family: var(--eyokon-font-sans);
}
.eyokon-about-locations__card h3 {
	font-family: var(--eyokon-font-display);
	font-size: 1.5rem;
	font-weight: 600;
	color: var(--ey-earth-900);
	margin-bottom: 0.5rem;
}
.eyokon-about-locations__card p {
	font-size: 0.875rem;
	color: var(--ey-earth-600);
	font-family: var(--eyokon-font-sans);
	line-height: 1.625;
	margin-bottom: 1rem;
}
.eyokon-about-locations__detail-list {
	list-style: none;
	padding: 0;
	margin: 0;
}
.eyokon-about-locations__detail-list li {
	display: flex;
	align-items: center;
	gap: 0.5rem;
	font-size: 0.875rem;
	color: var(--ey-earth-500);
	font-family: var(--eyokon-font-sans);
	margin-bottom: 0.375rem;
}
.eyokon-about-locations__detail-dot {
	width: 0.25rem;
	height: 0.25rem;
	border-radius: 50%;
	background: var(--ey-primary-500);
	flex-shrink: 0;
}

/* About — Values */
.eyokon-about-values { padding: 5rem 0; background: #fff; }
.eyokon-about-values__card {
	display: flex;
	align-items: flex-start;
	gap: 1rem;
	padding: 1.5rem;
	background: var(--ey-earth-50);
	border: 1px solid var(--ey-earth-100);
	border-radius: var(--eyokon-radius);
}
.eyokon-about-values__icon {
	width: 3rem;
	height: 3rem;
	background: var(--ey-primary-100);
	border-radius: var(--eyokon-radius);
	display: flex;
	align-items: center;
	justify-content: center;
	color: var(--ey-primary-600);
	flex-shrink: 0;
}
.eyokon-about-values__card h3 {
	font-family: var(--eyokon-font-display);
	font-size: 1.125rem;
	font-weight: 600;
	color: var(--ey-earth-900);
	margin-bottom: 0.5rem;
}
.eyokon-about-values__card p {
	font-size: 0.875rem;
	color: var(--ey-earth-600);
	font-family: var(--eyokon-font-sans);
	line-height: 1.625;
}

/* About — Supply chain */
.eyokon-about-chain { padding: 5rem 0; background: var(--ey-earth-50); }
.eyokon-about-chain__steps {
	display: grid;
	grid-template-columns: repeat(2, 1fr);
	gap: 1rem;
	margin-top: 2.5rem;
}
@media (min-width: 640px) { .eyokon-about-chain__steps { grid-template-columns: repeat(4, 1fr); } }

.eyokon-about-chain__step { position: relative; text-align: center; }
.eyokon-about-chain__step-num {
	width: 3rem;
	height: 3rem;
	background: var(--ey-primary-600);
	border-radius: 50%;
	display: flex;
	align-items: center;
	justify-content: center;
	margin: 0 auto 0.75rem;
	font-family: var(--eyokon-font-display);
	font-weight: 700;
	color: #fff;
	font-size: 1.125rem;
}
.eyokon-about-chain__step h4 {
	font-family: var(--eyokon-font-display);
	font-size: 1rem;
	font-weight: 600;
	color: var(--ey-earth-900);
	margin-bottom: 0.25rem;
}
.eyokon-about-chain__step p {
	font-size: 0.75rem;
	color: var(--ey-earth-500);
	font-family: var(--eyokon-font-sans);
	line-height: 1.5;
}

/* =====================================================
   LIVRAISON PAGE
   ===================================================== */
.eyokon-livraison-section { margin-bottom: 4rem; }

.eyokon-livraison-section__header {
	display: flex;
	align-items: center;
	gap: 0.75rem;
	margin-bottom: 2rem;
}
.eyokon-livraison-section__icon {
	width: 2.5rem;
	height: 2.5rem;
	background: var(--ey-primary-100);
	border-radius: var(--eyokon-radius);
	display: flex;
	align-items: center;
	justify-content: center;
	color: var(--ey-primary-600);
}
.eyokon-livraison-section__header h2 {
	font-family: var(--eyokon-font-display);
	font-size: 1.875rem;
	font-weight: 600;
	color: var(--ey-earth-900);
}

.eyokon-livraison-card {
	background: #fff;
	border: 1px solid var(--ey-earth-100);
	border-radius: var(--eyokon-radius);
	padding: 1.5rem;
}
.eyokon-livraison-card h3 {
	font-family: var(--eyokon-font-display);
	font-size: 1.25rem;
	font-weight: 600;
	color: var(--ey-earth-900);
	margin-bottom: 0.5rem;
}
.eyokon-livraison-card p {
	font-size: 0.875rem;
	color: var(--ey-earth-600);
	font-family: var(--eyokon-font-sans);
	line-height: 1.625;
	margin-bottom: 1rem;
}
.eyokon-livraison-check-list {
	list-style: none;
	padding: 0;
	margin: 0;
}
.eyokon-livraison-check-list li {
	display: flex;
	align-items: flex-start;
	gap: 0.5rem;
	font-size: 0.875rem;
	color: var(--ey-earth-600);
	font-family: var(--eyokon-font-sans);
	margin-bottom: 0.5rem;
}
.eyokon-livraison-check-list svg { color: var(--ey-secondary-500); flex-shrink: 0; margin-top: 0.125rem; }

/* Délais section */
.eyokon-livraison-delais {
	background: #fff;
	border: 1px solid var(--ey-earth-100);
	border-radius: var(--eyokon-radius);
	padding: 2rem;
}
.eyokon-livraison-delais__grid {
	display: grid;
	grid-template-columns: 1fr;
	gap: 1.5rem;
}
@media (min-width: 640px) { .eyokon-livraison-delais__grid { grid-template-columns: repeat(3, 1fr); } }
.eyokon-livraison-delai {
	text-align: center;
	padding: 1rem;
	background: var(--ey-earth-50);
	border-radius: var(--eyokon-radius);
}
.eyokon-livraison-delai__time {
	font-family: var(--eyokon-font-display);
	font-size: 1.875rem;
	font-weight: 700;
	color: var(--ey-primary-600);
	margin-bottom: 0.25rem;
}
.eyokon-livraison-delai__label {
	font-family: var(--eyokon-font-sans);
	font-weight: 600;
	color: var(--ey-earth-800);
	font-size: 0.875rem;
	margin-bottom: 0.25rem;
}
.eyokon-livraison-delai__desc {
	font-size: 0.75rem;
	color: var(--ey-earth-500);
	font-family: var(--eyokon-font-sans);
}

/* Alert notices */
.eyokon-notice {
	display: flex;
	align-items: flex-start;
	gap: 0.75rem;
	padding: 1.25rem;
	border-radius: var(--eyokon-radius);
}
.eyokon-notice--info {
	background: var(--ey-earth-50);
	border: 1px solid var(--ey-earth-200);
}
.eyokon-notice--warning {
	background: #fffbeb;
	border: 1px solid #fde68a;
}
.eyokon-notice--warning svg { color: #d97706; }
.eyokon-notice--success {
	background: var(--ey-secondary-50);
	border: 1px solid var(--ey-secondary-200);
}
.eyokon-notice__title {
	font-family: var(--eyokon-font-sans);
	font-weight: 600;
	font-size: 0.875rem;
}
.eyokon-notice--warning .eyokon-notice__title { color: #92400e; }
.eyokon-notice p {
	font-size: 0.875rem;
	font-family: var(--eyokon-font-sans);
	margin-top: 0.25rem;
}
.eyokon-notice--warning p { color: #b45309; }

/* Payment grid */
.eyokon-paiement-grid {
	display: grid;
	grid-template-columns: repeat(2, 1fr);
	gap: 1rem;
}
@media (min-width: 640px) { .eyokon-paiement-grid { grid-template-columns: repeat(4, 1fr); } }

.eyokon-paiement-card {
	padding: 1rem;
	border-radius: var(--eyokon-radius);
	border: 1px solid;
	text-align: center;
}
.eyokon-paiement-card--available {
	background: var(--ey-secondary-50);
	border-color: var(--ey-secondary-200);
}
.eyokon-paiement-card--unavailable {
	background: var(--ey-earth-50);
	border-color: var(--ey-earth-200);
	opacity: 0.6;
}
.eyokon-paiement-card svg { margin: 0 auto 0.5rem; }
.eyokon-paiement-card--available svg { color: var(--ey-secondary-600); }
.eyokon-paiement-card--unavailable svg { color: var(--ey-earth-400); }
.eyokon-paiement-card__name {
	font-size: 0.875rem;
	font-weight: 600;
	font-family: var(--eyokon-font-sans);
}
.eyokon-paiement-card--available .eyokon-paiement-card__name { color: var(--ey-secondary-800); }
.eyokon-paiement-card--unavailable .eyokon-paiement-card__name { color: var(--ey-earth-600); }
.eyokon-paiement-card__desc {
	font-size: 0.75rem;
	color: var(--ey-earth-500);
	margin-top: 0.25rem;
	font-family: var(--eyokon-font-sans);
}
.eyokon-paiement-card__soon {
	font-size: 10px;
	color: var(--ey-earth-400);
	margin-top: 0.25rem;
	font-family: var(--eyokon-font-sans);
}

/* =====================================================
   CONTACT PAGE
   ===================================================== */
.eyokon-contact__grid {
	display: grid;
	grid-template-columns: 1fr;
	gap: 3rem;
}
@media (min-width: 1024px) {
	.eyokon-contact__grid { grid-template-columns: 1fr 2fr; }
}

/* Contact sidebar */
.eyokon-contact-info h2 {
	font-family: var(--eyokon-font-display);
	font-size: 1.5rem;
	font-weight: 600;
	color: var(--ey-earth-900);
	margin-bottom: 1.5rem;
}
.eyokon-contact-info__item {
	display: flex;
	align-items: flex-start;
	gap: 0.75rem;
	margin-bottom: 1.25rem;
}
.eyokon-contact-info__item svg { color: var(--ey-primary-600); flex-shrink: 0; margin-top: 0.125rem; }
.eyokon-contact-info__label {
	font-size: 0.75rem;
	font-weight: 600;
	color: var(--ey-earth-500);
	text-transform: uppercase;
	letter-spacing: 0.05em;
	font-family: var(--eyokon-font-sans);
	margin-bottom: 0.125rem;
}
.eyokon-contact-info__value {
	font-size: 0.875rem;
	color: var(--ey-earth-600);
	font-family: var(--eyokon-font-sans);
}
.eyokon-contact-info__value a {
	color: var(--ey-earth-700);
	text-decoration: none;
	transition: color 200ms;
}
.eyokon-contact-info__value a:hover { color: var(--ey-primary-600); }

/* Social links */
.eyokon-contact-social h3 {
	font-family: var(--eyokon-font-display);
	font-size: 1.125rem;
	font-weight: 600;
	color: var(--ey-earth-900);
	margin-bottom: 0.75rem;
}
.eyokon-contact-social__link {
	display: flex;
	align-items: center;
	gap: 0.75rem;
	padding: 0.75rem;
	background: #fff;
	border: 1px solid var(--ey-earth-100);
	border-radius: var(--eyokon-radius);
	text-decoration: none;
	transition: border-color 200ms;
	margin-bottom: 0.75rem;
}
.eyokon-contact-social__link:hover { border-color: var(--ey-primary-300); }
.eyokon-contact-social__icon {
	width: 2rem;
	height: 2rem;
	border-radius: var(--eyokon-radius);
	display: flex;
	align-items: center;
	justify-content: center;
	color: #fff;
}
.eyokon-contact-social__icon--fb { background: #1877f2; }
.eyokon-contact-social__icon--tk { background: var(--ey-earth-900); }
.eyokon-contact-social__link span {
	font-size: 0.875rem;
	font-weight: 500;
	color: var(--ey-earth-700);
	font-family: var(--eyokon-font-sans);
}

/* B2B card */
.eyokon-contact-b2b {
	background: var(--ey-primary-50);
	border: 1px solid var(--ey-primary-200);
	border-radius: var(--eyokon-radius);
	padding: 1.25rem;
}
.eyokon-contact-b2b svg { color: var(--ey-primary-600); margin-bottom: 0.75rem; }
.eyokon-contact-b2b h3 {
	font-family: var(--eyokon-font-display);
	font-size: 1rem;
	font-weight: 600;
	color: var(--ey-primary-900);
	margin-bottom: 0.5rem;
}
.eyokon-contact-b2b p {
	font-size: 0.875rem;
	color: var(--ey-primary-700);
	font-family: var(--eyokon-font-sans);
	line-height: 1.625;
}

/* Contact form area */
.eyokon-contact-form {
	background: #fff;
	border: 1px solid var(--ey-earth-100);
	border-radius: var(--eyokon-radius);
	padding: 1.5rem;
}
.eyokon-contact-form h2 {
	font-family: var(--eyokon-font-display);
	font-size: 1.5rem;
	font-weight: 600;
	color: var(--ey-earth-900);
	margin-bottom: 1.25rem;
}

/* Form label */
.eyk-label {
	display: block;
	font-size: 0.75rem;
	font-weight: 600;
	color: var(--ey-earth-600);
	text-transform: uppercase;
	letter-spacing: 0.05em;
	margin-bottom: 0.375rem;
	font-family: var(--eyokon-font-sans);
}

/* Form row */
.eyk-form-row {
	display: grid;
	grid-template-columns: 1fr;
	gap: 1rem;
	margin-bottom: 1.25rem;
}
@media (min-width: 640px) { .eyk-form-row--2 { grid-template-columns: 1fr 1fr; } }

/* Inline CTA (rounded bg-primary-600 for page sections) */
.eyokon-section-cta {
	background: var(--ey-primary-600);
	border-radius: var(--eyokon-radius);
	padding: 2rem;
	color: #fff;
	text-align: center;
}
.eyokon-section-cta h2 {
	font-family: var(--eyokon-font-display);
	font-size: 1.875rem;
	font-weight: 600;
	margin-bottom: 0.75rem;
}
.eyokon-section-cta p {
	color: var(--ey-primary-100);
	font-family: var(--eyokon-font-sans);
	margin-bottom: 1.5rem;
}

/* =====================================================
   UTILITY: .eyk-icon-primary
   ===================================================== */
.eyk-icon-primary { color: var(--ey-primary-400); }