:root {
	--geeknplay-theme-shadow: 0 18px 44px rgba(0, 0, 0, 0.28);
	--geeknplay-theme-radius-sm: 10px;
	--geeknplay-theme-radius-md: 18px;
	--geeknplay-theme-radius-lg: 24px;
	--geeknplay-theme-container: 1280px;
	--geeknplay-theme-transition: 180ms ease;
}

html[data-theme="dark"] {
	--geeknplay-theme-bg: #0b0f17;
	--geeknplay-theme-surface: #131a26;
	--geeknplay-theme-surface-alt: #1a2433;
	--geeknplay-theme-border: #243247;
	--geeknplay-theme-text: #f3f6fb;
	--geeknplay-theme-muted: #9aa8bc;
	--geeknplay-theme-primary: #0d3884;
	--geeknplay-theme-primary-alt: #154da8;
	--geeknplay-theme-accent: #fccb06;
	--geeknplay-theme-danger: #da0915;
	--geeknplay-theme-header-bg: rgba(11, 15, 23, 0.86);
	--geeknplay-theme-topbar-bg: rgba(19, 26, 38, 0.78);
	--geeknplay-theme-menu-bg: rgba(19, 26, 38, 0.98);
	--geeknplay-theme-button-text: #ffffff;
	--geeknplay-theme-card-text: #e7edf7;
	--geeknplay-theme-link: #fccb06;
	--geeknplay-theme-link-hover: #ffda47;
}

html[data-theme="light"] {
	--geeknplay-theme-bg: #f5f7fb;
	--geeknplay-theme-surface: #ffffff;
	--geeknplay-theme-surface-alt: #eef2f8;
	--geeknplay-theme-border: #d8e0ec;
	--geeknplay-theme-text: #152033;
	--geeknplay-theme-muted: #5f6f86;
	--geeknplay-theme-primary: #0d3884;
	--geeknplay-theme-primary-alt: #154da8;
	--geeknplay-theme-accent: #c89200;
	--geeknplay-theme-danger: #c62828;
	--geeknplay-theme-header-bg: rgba(255, 255, 255, 0.92);
	--geeknplay-theme-topbar-bg: rgba(243, 246, 251, 0.88);
	--geeknplay-theme-menu-bg: rgba(255, 255, 255, 0.98);
	--geeknplay-theme-button-text: #ffffff;
	--geeknplay-theme-card-text: #1d2a3f;
	--geeknplay-theme-link: #0d3884;
	--geeknplay-theme-link-hover: #154da8;
}

*,
*::before,
*::after {
	box-sizing: border-box;
}

html {
	scroll-behavior: smooth;
}

body {
	margin: 0;
	background: var(--geeknplay-theme-bg);
	color: var(--geeknplay-theme-text);
	font-family: Inter, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
	line-height: 1.65;
	transition:
		background var(--geeknplay-theme-transition),
		color var(--geeknplay-theme-transition);
}

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

a {
	color: inherit;
}

button,
input,
select,
textarea {
	font: inherit;
}

.gnp-container {
	width: min(100% - 2rem, var(--geeknplay-theme-container));
	margin-inline: auto;
}

.gnp-stack {
	padding-block: 2rem 3rem;
}

.site-main {
	min-height: 70vh;
	padding-top: 1.5rem;
}

.home .site-main,
.front-page .site-main {
	padding-top: 0;
}

.gnp-front-page {
	padding-block: 0 3rem;
}

/* Header */

.site-header {
	position: sticky;
	top: 0;
	z-index: 1000;
	backdrop-filter: blur(16px);
	background: var(--geeknplay-theme-header-bg);
	border-bottom: 1px solid rgba(36, 50, 71, 0.18);
	transition:
		background var(--geeknplay-theme-transition),
		border-color var(--geeknplay-theme-transition);
}

/* 🔹 Topbar */
.site-topbar__inner {
	display: flex;
	justify-content: space-between;
	align-items: center;
	gap: 10px;
}

#gnp-releases-carousel {
	flex: 1;
	position: relative;
	color: var(--geeknplay-theme-text);
	overflow: hidden;
	min-height: 24px;
	display: flex;
	align-items: center;
}

.gnp-releases-compact__list {
	position: relative;
	width: 100%;
	height: 100%;
}

.gnp-releases-compact__item-wrapper {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	opacity: 0;
	transition: opacity 0.8s ease-in-out;
	display: flex;
	align-items: center;
}

.gnp-releases-compact__item-wrapper.active {
	opacity: 1;
	position: relative;
	z-index: 10;
}

.gnp-releases-compact__item {
	display: flex;
	align-items: center;
	gap: 8px;
	text-decoration: none;
	width: 100%;
}

.gnp-releases-compact__date {
	background: var(--geeknplay-theme-accent);
	color: #fff;
	padding: 2px 6px;
	border-radius: 4px;
	font-weight: 600;
	font-size: 12px;
}

@media (max-width: 860px) {
	.gnp-releases-compact__date, .gnp-releases-compact__title {
		font-size: 9px;
		padding: 1px 4px;
	}
	.gnp-releases-compact__date {
		width:20%;
	}
}

.gnp-releases-compact__title {
	font-weight: 500;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
	max-width: 200px;
}

/* Meta + social */
.site-topbar__meta-and-social {
	display: flex;
	align-items: center;
	gap: 10px;
}

.site-topbar__social {
	display: flex;
	gap: 10px;
	align-items: center;
}

.site-topbar__social a {
	color: var(--geeknplay-theme-text);
	display: flex;
	align-items: center;
	justify-content: center;
}

.site-topbar__social svg {
	width: 18px;
	height: 18px;
	fill: currentColor;
	transition: transform 0.2s ease;
}

.site-topbar__social a:hover svg {
	transform: rotate(-10deg) scale(1.1);
}

/* Search */
.search-container {
	position: relative;
	display: flex;
	align-items: center;
}

.search-toggle {
	background: none;
	border: none;
	color: var(--geeknplay-theme-text);
	cursor: pointer;
	padding: 5px;
}

.search-toggle svg {
	width: 20px;
	height: 20px;
	fill: currentColor;
}

.search-form {
	position: absolute;
	right: 0;
	opacity: 0;
	pointer-events: none;
	transform: translateX(10px);
	transition: all 0.25s ease;
}

.search-container.active .search-form {
	opacity: 1;
	pointer-events: auto;
	transform: translateX(0);
}

.search-field {
	padding: 6px 10px;
	border-radius: 6px;
	border: 1px solid rgba(0,0,0,0.1);
	min-width: 200px;
}

/* Lien Connexion */
.site-topbar__login-link {
	margin-left: 20px;
	font-weight: bold !important;
}

.site-topbar__login-link a {
	color: var(--geeknplay-theme-text) !important;
	transition: color 0.2s ease;
}

.header-login-link a {
	text-decoration: none !important;
	font-weight: bold !important;
}

.site-topbar__login-link a:hover {
	color: var(--geeknplay-theme-accent) !important;
}

.site-header--admin-bar {
	top: 32px;
}

.site-topbar {
	border-bottom: 1px solid rgba(36, 50, 71, 0.14);
	background: var(--geeknplay-theme-topbar-bg);
	transition:
		background var(--geeknplay-theme-transition),
		border-color var(--geeknplay-theme-transition);
	position: relative;
	z-index: 100;
}

.site-topbar__inner {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 1rem;
	padding-block: 0.6rem;
}

.site-topbar__tagline,
.site-topbar__meta {
	margin: 0;
	font-size: 0.82rem;
	color: var(--geeknplay-theme-muted);
}

.site-header__main {
	padding-block: 1rem;
	position: relative;
	z-index: 101;
}

.site-header__inner {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 1.5rem;
}

.site-branding {
	flex-shrink: 0;
}

.site-branding__link {
	display: inline-flex;
	align-items: center;
	text-decoration: none;
	font-size: 1.45rem;
	font-weight: 900;
	letter-spacing: -0.03em;
	color: var(--geeknplay-theme-text);
}

.site-logo {
	max-height: 52px;
	width: auto;
}

.primary-navigation {
	margin-left: auto;
}

.primary-menu {
	display: flex;
	align-items: center;
	gap: 1.25rem;
	list-style: none;
	margin: 0;
	padding: 0;
}

.primary-menu a {
	text-decoration: none;
	color: var(--geeknplay-theme-muted);
	font-weight: 700;
	transition: color var(--geeknplay-theme-transition);
}

.primary-menu a:hover,
.primary-menu .current-menu-item > a,
.primary-menu .current-menu-ancestor > a {
	color: var(--geeknplay-theme-text);
}

.menu-toggle {
	display: none;
	width: 44px;
	height: 44px;
	padding: 0;
	border: 1px solid var(--geeknplay-theme-border);
	border-radius: 12px;
	background: var(--geeknplay-theme-surface);
	cursor: pointer;
	transition:
		background var(--geeknplay-theme-transition),
		border-color var(--geeknplay-theme-transition);
	position: relative;
	z-index: 2001;
}

.menu-toggle span {
		display: block;
	width: 20px;
	height: 2px;
	margin: 4px auto;
	background: var(--geeknplay-theme-text);
	transition: transform 0.3s ease;
}

/* Add animation for the burger icon */
.menu-toggle.active span:nth-child(1) {
	transform: translateY(6px) rotate(45deg);
}

.menu-toggle.active span:nth-child(2) {
	opacity: 0;
}

.menu-toggle.active span:nth-child(3) {
	transform: translateY(-6px) rotate(-45deg);
}

/* Archive */

.archive-header {
	margin-bottom: 1.5rem;
	padding: 1.25rem;
		border: 1px solid var(--geeknplay-theme-border);
	border-radius: var(--geeknplay-theme-radius-lg);
	background:
		linear-gradient(180deg, rgba(255, 255, 255, 0.02), rgba(255, 255, 255, 0)),
		var(--geeknplay-theme-surface);
	box-shadow: var(--geeknplay-theme-shadow);
}

.archive-header__title {
	margin: 0;
	font-size: clamp(1.6rem, 3vw, 2.5rem);
	line-height: 1.08;
	letter-spacing: -0.03em;
}

.archive-header__description {
	margin-top: 0.8rem;
	color: var(--geeknplay-theme-muted);
}

.archive-grid {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: 1.25rem;
}

.premium-grid {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 24px;
	margin-top: 32px;
}

/* Archive premium grid: featured first + compact cards on the right */
.gnp-archive-grid {
	grid-template-columns: 2fr 1fr 1fr;
	gap: 28px;
	align-items: start;
}

.gnp-archive-grid .premium-card {
		display: flex;
	flex-direction: column;
	height: 100%;
	transition: transform 260ms var(--geeknplay-theme-transition), box-shadow 260ms var(--geeknplay-theme-transition);
	}

.gnp-archive-grid .premium-card__image {
	position: relative;
	overflow: hidden;
	padding-top: 56.25%; /* 16:9 */
}

.gnp-archive-grid .premium-card__image img {
	position: absolute;
	top: 0; left: 0;
	width: 100%; height: 100%;
	object-fit: cover;
	transition: transform 420ms cubic-bezier(.2,.9,.2,1);
}

.gnp-archive-grid .premium-card__content {
	padding: 18px;
}

.gnp-archive-grid .premium-card__title {
	margin: 0 0 8px 0;
	font-size: 1.05rem;
	line-height: 1.22;
	font-weight: 800;
}

.gnp-archive-grid .premium-card__excerpt {
	color: var(--geeknplay-theme-muted);
	font-size: 0.98rem;
	line-height: 1.5;
}

.gnp-archive-grid .premium-card:hover {
	transform: translateY(-6px);
	box-shadow: var(--geeknplay-theme-shadow);
}

/* Featured card rules */
.gnp-archive-grid .premium-card--featured {
	grid-row: span 2;
	border-radius: 20px;
	overflow: hidden;
}

.gnp-archive-grid .premium-card--featured .premium-card__image--large {
	padding-top: 50%; /* taller hero */
}

.gnp-archive-grid .premium-card--featured .premium-card__title {
	font-size: 1.6rem;
	line-height: 1.08;
	color: var(--geeknplay-theme-text);
}

.gnp-archive-grid .premium-card--featured .premium-card__excerpt {
	color: var(--geeknplay-theme-muted);
	font-size: 1rem;
}

@media (max-width: 1100px) {
	.gnp-archive-grid {
		grid-template-columns: repeat(2, 1fr);
	}
	.gnp-archive-grid .premium-card--featured {
		grid-column: 1 / -1;
		grid-row: auto;
	}
}

@media (max-width: 640px) {
	.gnp-archive-grid {
		display: block;
	}
	.gnp-archive-grid .premium-card {
		margin-bottom: 1rem;
	}
}

.premium-card {
	background: var(--geeknplay-theme-surface);
	border: 1px solid var(--geeknplay-theme-border);
	border-radius: var(--geeknplay-theme-radius-md);
	overflow: hidden;
	box-shadow: var(--geeknplay-theme-shadow);
	transition: transform var(--geeknplay-theme-transition), box-shadow var(--geeknplay-theme-transition);
	display: flex;
	flex-direction: column;
}

.premium-card:hover {
	transform: translateY(-6px);
	box-shadow: 0 22px 56px rgba(0,0,0,0.32);
}

.premium-card__link {
	color: inherit;
	text-decoration: none;
	display: flex;
	flex-direction: column;
	height: 100%;
}

.premium-card__image {
	position: relative;
	width: 100%;
	padding-top: 56.25%; /* 16:9 */
	overflow: hidden;
}

.premium-card__image img {
	position: absolute;
	top: 0; left: 0;
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.premium-card__score {
	position: absolute;
	top: 8px;
	right: 8px;
	background: var(--geeknplay-theme-accent);
	color: var(--geeknplay-theme-button-text);
	font-weight: bold;
	font-size: 0.9rem;
	padding: 4px 6px;
	border-radius: var(--geeknplay-theme-radius-sm);
	box-shadow: 0 2px 8px rgba(0,0,0,0.3);
}

.premium-card__content {
	padding: 16px;
	display: flex;
	flex-direction: column;
	flex: 1;
}

.premium-card__category {
	font-size: 0.8rem;
	font-weight: 600;
	text-transform: uppercase;
	margin-bottom: 4px;
	display: inline-block;
}

.premium-card__title {
	font-size: 1.15rem;
	font-weight: 700;
	margin: 0 0 8px 0;
	line-height: 1.3;
}

.premium-card__excerpt {
	font-size: 0.95rem;
	color: var(--geeknplay-theme-muted);
	flex: 1;
}

@media (max-width: 1024px) {
	.premium-grid {
		grid-template-columns: repeat(2, 1fr);
	}
}

@media (max-width: 767px) {
	.premium-grid {
		grid-template-columns: 1fr;
	}
}

/* Pagination */

.pagination-wrap {
	margin-top: 2rem;
}

.pagination {
	display: flex;
	flex-wrap: wrap;
	gap: 0.5rem;
}

.page-numbers {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-width: 42px;
	height: 42px;
	padding-inline: 0.9rem;
	border-radius: 999px;
	border: 1px solid var(--geeknplay-theme-border);
	background: var(--geeknplay-theme-surface);
	color: var(--geeknplay-theme-text);
	text-decoration: none;
	transition:
		background var(--geeknplay-theme-transition),
		color var(--geeknplay-theme-transition),
		border-color var(--geeknplay-theme-transition);
}

.page-numbers.current {
	background: var(--geeknplay-theme-primary);
	color: #fff;
	border-color: transparent;
}

/* Single */

.gnp-single-layout {
	padding-block: 1rem 3rem;
}

.single-article {
	position: relative;
	padding: 1.5rem;
	border: 1px solid var(--geeknplay-theme-border);
	border-radius: var(--geeknplay-theme-radius-lg);
	background:
		linear-gradient(180deg, rgba(255, 255, 255, 0.02), rgba(255, 255, 255, 0)),
		var(--geeknplay-theme-surface);
	box-shadow: var(--geeknplay-theme-shadow);
}

.single-article__header {
	margin-bottom: 1.5rem;
}

.single-article__terms {
	display: flex;
	flex-wrap: wrap;
	gap: 0.5rem;
	margin: 0 0 0.9rem;
}

.single-article__child-term {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	padding: 0.35rem 0.7rem;
	border-radius: 999px;
	background: rgba(255, 255, 255, 0.04);
	border: 1px solid var(--geeknplay-theme-border);
	font-size: 0.8rem;
	font-weight: 800;
	text-decoration: none;
	text-transform: uppercase;
	letter-spacing: 0.04em;
	transition:
		transform var(--geeknplay-theme-transition),
		opacity var(--geeknplay-theme-transition),
		border-color var(--geeknplay-theme-transition);
}

.single-article__child-term:hover,
.single-article__child-term:focus-visible {
	transform: translateY(-1px);
	opacity: 0.92;
}

.single-article__term {
	margin: 0 0 0.75rem;
	font-size: 0.8rem;
	font-weight: 800;
	text-transform: uppercase;
	letter-spacing: 0.08em;
}

.single-article__term a {
	color: var(--geeknplay-theme-accent);
	text-decoration: none;
}

.single-article__title {
	margin: 0;
	font-size: clamp(2rem, 4vw, 3.4rem);
	line-height: 1.02;
	letter-spacing: -0.04em;
}

.single-article__excerpt {
	margin-top: 1rem;
	max-width: 70ch;
	font-size: 1.08rem;
	line-height: 1.65;
	color: var(--geeknplay-theme-muted);
}

.single-article__layout {
	display: grid;
	grid-template-columns: minmax(0, 1fr) 320px;
	gap: 2rem;
	align-items: start;
}

/* When no sidebar widgets (TOC or media box), let the main content take full width */
.single-article__layout.single-no-sidebar {
	grid-template-columns: 1fr;
}

/* Make the aside itself sticky — simpler, avoid double-wrapping sticky
   The top is computed dynamically by JS and exposed via --single-sidebar-top */
.single-article__sidebar {
	position: sticky;
	top: var(--single-sidebar-top, calc(var(--site-header-offset, 72px) + 1rem));
	align-self: start;
}

/* The inner wrapper should remain in normal flow when the aside is sticky */
.single-article__sidebar-inner {
	position: static;
	top: auto;
}

/* JS sticky fallback animation states */
.single-article__sidebar-inner.gnp-js-sticky--fixed {
	/* animate opacity/transform to make the fixed state less jarring */
	top: var(--single-sidebar-top);
	transition: opacity 300ms cubic-bezier(.2,.9,.2,1), transform 300ms cubic-bezier(.2,.9,.2,1), box-shadow 240ms ease;
	opacity: 1;
	transform: translateY(0);
	box-shadow: 0 10px 26px rgba(0,0,0,0.08);
}

.single-article__sidebar-inner.gnp-js-sticky--enter {
	opacity: 0;
	transform: translateY(-6px);
}

.single-article__sidebar-inner.gnp-js-sticky--bottom {
	/* softer elevation when near footer */
	box-shadow: 0 6px 12px rgba(0,0,0,0.04);
	opacity: 0.98;
}

.gnp-js-sticky-placeholder {
	display: block;
}

/* Exiting state: fade out gently before restoring to normal flow */
.single-article__sidebar-inner.gnp-js-sticky--exiting {
	opacity: 0;
	transform: translateY(-6px);
	transition: opacity 320ms cubic-bezier(.2,.9,.2,1), transform 320ms cubic-bezier(.2,.9,.2,1);
}

@media (max-width: 1080px) {
	.single-article__sidebar {
		position: static;
		top: auto;
	}
	.single-article__sidebar-inner {
		position: static;
		top: auto;
	}
}

.single-media-box {
	position: relative;
	padding: 1.25rem;
	border: 1px solid var(--geeknplay-theme-border);
	border-radius: var(--geeknplay-theme-radius-lg);
	background:
		linear-gradient(180deg, rgba(255,255,255,0.02), rgba(255,255,255,0)),
		var(--geeknplay-theme-surface);
	box-shadow: var(--geeknplay-theme-shadow);
}

.single-media-box__title {
	margin: 0 0 1rem;
	font-size: 1.2rem;
	line-height: 1.1;
	letter-spacing: -0.02em;
}

.single-media-box__title a {
	text-decoration: none;
	color: var(--geeknplay-theme-text);
}

.single-media-box__meta {
	margin: 0;
	display: grid;
	gap: 0.85rem;
}

.single-media-box__row {
	display: grid;
	gap: 0.2rem;
}

.single-media-box__row dt {
	font-size: 0.78rem;
	font-weight: 800;
	text-transform: uppercase;
	letter-spacing: 0.06em;
	color: var(--geeknplay-theme-muted);
}

.single-media-box__row dd {
	margin: 0;
	color: var(--geeknplay-theme-text);
	font-size: 0.96rem;
	line-height: 1.45;
}

.single-media-box__score {
	margin-top: 1.25rem;
	padding-top: 1rem;
	border-top: 1px solid var(--geeknplay-theme-border);
}

.single-media-box__score-value {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	padding: 0.55rem 0.85rem;
	border-radius: 10px;
	background: var(--geeknplay-theme-danger);
	color: #fff;
	font-size: 1.05rem;
	font-weight: 900;
}

.single-media-box__score-link {
	display: inline-block;
	margin-top: 0.75rem;
	font-weight: 700;
	text-decoration: none;
	color: var(--geeknplay-theme-link);
}

.entry-content .wp-block-image,
.entry-content .wp-block-video,
.entry-content .wp-block-embed,
.entry-content figure,
.entry-content iframe,
.entry-content video,
.entry-content .twitter-tweet {
	margin-left: auto;
	margin-right: auto;
}

.entry-content iframe,
.entry-content video {
	display: block;
	max-width: 100%;
}

.entry-content .wp-block-image img,
.entry-content .wp-block-video video {
	margin-inline: auto;
}

.entry-content .wp-block-embed__wrapper,
.entry-content .wp-block-embed.is-type-video {
	display: flex;
	justify-content: center;
}

.entry-content blockquote.twitter-tweet {
	margin-left: auto;
	margin-right: auto;
}

@media (max-width: 1080px) {
	.single-article__layout {
		grid-template-columns: 1fr;
	}

	.single-media-box {
		position: static;
	}
}

.entry-meta {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 0.45rem;
	margin-top: 0.9rem;
	color: var(--geeknplay-theme-muted);
	font-size: 0.92rem;
}

.entry-meta__separator {
	opacity: 0.65;
}

.single-article__thumbnail {
	margin: 0 0 1.5rem;
	overflow: hidden;
	border-radius: var(--geeknplay-theme-radius-md);
}

.entry-content {
	font-size: 1.06rem;
	color: var(--geeknplay-theme-card-text);
}

.entry-content > * + * {
	margin-top: 1.15em;
}

.entry-content a {
	color: var(--geeknplay-theme-link);
	text-decoration: underline;
	text-underline-offset: 0.14em;
}

.entry-content a:hover,
.entry-content a:focus-visible {
	color: var(--geeknplay-theme-link-hover);
}

.entry-content h2,
.entry-content h3,
.entry-content h4 {
	line-height: 1.15;
	letter-spacing: -0.02em;
}

.entry-content figure {
	margin-inline: 0;
}

/* Footer */

.site-footer {
	margin-top: 3rem;
	border-top: 1px solid rgba(36, 50, 71, 0.18);
	background: var(--geeknplay-theme-surface);
	transition:
		background var(--geeknplay-theme-transition),
		border-color var(--geeknplay-theme-transition);
}

.site-footer__inner {
	display: flex;
	justify-content: space-between;
	gap: 2rem;
	padding-block: 2rem;
}

.site-footer__title {
	margin: 0 0 0.5rem;
	font-size: 1.1rem;
	font-weight: 800;
	color: var(--geeknplay-theme-text);
}

.site-footer__text {
	margin: 0;
	color: var(--geeknplay-theme-muted);
}

.footer-menu {
	display: flex;
	flex-wrap: wrap;
	gap: 1rem;
	list-style: none;
	margin: 0;
	padding: 0;
}

.footer-menu a {
	color: var(--geeknplay-theme-muted);
	text-decoration: none;
	transition: color var(--geeknplay-theme-transition);
}

.footer-menu a:hover,
.footer-menu a:focus-visible {
	color: var(--geeknplay-theme-text);
}

.site-footer__bottom {
	border-top: 1px solid rgba(36, 50, 71, 0.18);
}

.site-footer__bottom-inner {
	padding-block: 1rem;
	color: var(--geeknplay-theme-muted);
	font-size: 0.9rem;
}

/* Bloc supérieur en 2 colonnes */
.site-footer__top {
	display: flex;
	align-items: center;
	width: 100%;
	gap: 40px;
}

/* Logo */
.site-footer__branding img {
	flex: 0 0 auto;
}

/* Menu aligné verticalement à droite */
.site-footer__nav {
	margin-left: auto;
	display: flex;
	justify-content: flex-end;
}

.footer-menu {
	list-style: none;
	margin: 0;
	padding: 0;
	display: flex;
	gap: 25px;
	align-items: center;
}

/* Couleurs texte et liens selon le thème */
.site-footer,
.site-footer p {
	color: var(--geeknplay-theme-text);
}

.site-footer a {
	color: var(--geeknplay-theme-text);
	text-decoration: none;
	transition: color 0.3s;
}

/* Footer bottom et réseaux sociaux */
.site-footer__bottom {
	border-top: 1px solid var(--geeknplay-theme-border);
	padding-top: 15px;
	text-align: center;
	font-size: 13px;
	opacity: 0.8;
}

.site-footer__social-bottom {
	display: flex;
	justify-content: center;
	gap: 12px;
	margin-top: 10px;
}

.site-footer__social-bottom svg {
	width: 24px;
	height: 24px;
	fill: currentColor;
	transition: transform 0.2s ease, color 0.3s ease;
}

.site-footer__social-bottom a:hover svg {
	transform: scale(1.2);
	color: var(--geeknplay-theme-link-hover);
}

/* Responsive */
@media (max-width: 767px) {
	.site-footer__top {
		flex-direction: column;
		align-items: center;
		gap: 20px;
	}
	.site-footer__nav {
		justify-content: center;
	}
}

/* 404 */

.error-404 {
	padding: 2rem;
	border: 1px solid var(--geeknplay-theme-border);
	border-radius: var(--geeknplay-theme-radius-lg);
	background: var(--geeknplay-theme-surface);
	text-align: center;
	box-shadow: var(--geeknplay-theme-shadow);
}

.error-404__title {
	margin: 0 0 1rem;
	font-size: clamp(2rem, 4vw, 3rem);
}

.error-404__text {
	margin: 0 0 1.25rem;
	color: var(--geeknplay-theme-muted);
}

.error-page-area {
	display: flex;
	justify-content: center;
	align-items: center;
	min-height: 80vh;
	text-align: center;
	padding: 2rem;
	background: var(--geeknplay-theme-bg);
	color: var(--geeknplay-theme-text);
	font-family: 'Courier New', monospace;
}

.error-page-content h2.error-title {
	font-size: 5rem;
	position: relative;
	display: inline-block;
	margin-bottom: 1rem;
	color: var(--geeknplay-theme-accent);
}

.error-page-content h2.error-title::after {
	content: attr(data-glitch);
	position: absolute;
	left: 2px;
	top: 2px;
	color: var(--geeknplay-theme-link);
	z-index: -1;
}

.error-page-content p.error-desc {
	font-size: 1.2rem;
	margin-bottom: 2rem;
}

.go-home .button-style-1 {
	display: inline-block;
	padding: 0.7rem 1.5rem;
	background: var(--geeknplay-theme-link);
	color: var(--geeknplay-theme-bg);
	font-weight: bold;
	text-decoration: none;
	border-radius: var(--geeknplay-theme-radius-md);
	transition: var(--geeknplay-theme-transition);
}

.go-home .button-style-1:hover {
	background: var(--geeknplay-theme-link-hover);
	color: var(--geeknplay-theme-bg);
}

.item-img svg {
	width: 200px;
	height: 200px;
	margin-bottom: 2rem;
	animation: float 3s ease-in-out infinite;
}

@keyframes float {
	0%, 100% { transform: translateY(0); }
	50% { transform: translateY(-15px); }
}

/* Buttons */

.button-primary {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	padding: 0.85rem 1.2rem;
	border-radius: 999px;
	background: var(--geeknplay-theme-primary);
	color: var(--geeknplay-theme-button-text);
	font-weight: 800;
	text-decoration: none;
	transition:
		background var(--geeknplay-theme-transition),
		transform var(--geeknplay-theme-transition);
}

.button-primary:hover,
.button-primary:focus-visible {
	background: var(--geeknplay-theme-primary-alt);
	transform: translateY(-1px);
}

/* Connexion */

body.page-template-page-connexion {
	background: radial-gradient(circle at top, #0f172a, #020617);
	color: #e2e8f0;
	font-family: 'Inter', sans-serif;
}

.gnp-auth-container {
	max-width: 420px;
	margin: 80px auto;
	padding: 40px 30px;
	border-radius: 16px;
	background: rgba(15, 23, 42, 0.85);
	backdrop-filter: blur(12px);
	box-shadow: 0 0 40px rgba(251, 191, 36, 0.2);
	text-align: center;
	position: relative;
	transition: all 0.3s ease;
}

.gnp-auth-container:hover {
	transform: translateY(-5px);
	box-shadow: 0 10px 50px rgba(251, 191, 36, 0.35);
}

.gnp-auth-logo {
	width: 140px;
	margin-bottom: 20px;
	filter: drop-shadow(0 0 12px rgba(251,191,36,0.6));
}

.gnp-auth-container h2 {
	font-size: 2.2rem;
	margin-bottom: 10px;
	color: #facc15;
	letter-spacing: 1px;
}

.gnp-auth-phrase {
	font-size: 0.95rem;
	margin-bottom: 25px;
	opacity: 0.8;
	transition: opacity 0.3s ease;
}

.gnp-auth-container input {
	width: 100%;
	padding: 14px;
	margin-bottom: 15px;
	border-radius: 10px;
	border: 1px solid rgba(255,255,255,0.15);
	background: rgba(2,6,23,0.7);
	color: #fff;
	font-size: 1rem;
	transition: 0.3s;
}

.gnp-auth-container input:focus {
	border-color: #facc15;
	box-shadow: 0 0 12px rgba(250,204,21,0.6);
	outline: none;
}

.gnp-auth-container button {
	width: 100%;
	padding: 14px;
	border-radius: 10px;
	border: none;
	background: linear-gradient(135deg, #facc15, #f59e0b);
	color: #020617;
	font-weight: 700;
	font-size: 1rem;
	cursor: pointer;
	transition: all 0.3s ease;
}

.gnp-auth-container button:hover {
	transform: scale(1.05);
	box-shadow: 0 0 20px rgba(250,204,21,0.7);
}

.gnp-auth-toggle {
	margin-top: 20px;
	font-size: 0.9rem;
}

.gnp-auth-toggle a {
	color: #facc15;
	font-weight: bold;
	text-decoration: none;
	transition: color 0.3s;
}

.gnp-auth-toggle a:hover {
	color: #f59e0b;
	text-decoration: underline;
}

.gnp-auth-message {
	margin-top: 15px;
	font-size: 0.95rem;
	min-height: 1.2em;
	font-weight: 500;
	transition: all 0.3s ease;
}

/* Theme toggle */

.theme-toggle {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 0.45rem;
	height: 42px;
	padding: 0 0.85rem;
	border: 1px solid var(--geeknplay-theme-border);
	border-radius: 999px;
	background: var(--geeknplay-theme-surface);
	color: var(--geeknplay-theme-text);
	cursor: pointer;
	box-shadow: var(--geeknplay-theme-shadow);
	transition:
		background var(--geeknplay-theme-transition),
		color var(--geeknplay-theme-transition),
		border-color var(--geeknplay-theme-transition),
		transform var(--geeknplay-theme-transition);
}

.theme-toggle:hover,
.theme-toggle:focus-visible {
	transform: translateY(-1px);
}

.theme-toggle__label {
	font-size: 0.84rem;
	font-weight: 800;
}

.theme-toggle__icon {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	font-size: 0.95rem;
	line-height: 1;
}

html[data-theme="dark"] .theme-toggle__icon--light,
html[data-theme="light"] .theme-toggle__icon--dark {
	display: none;
}

.theme-toggle--floating {
	position: fixed;
	right: 1rem;
	bottom: 1rem;
	z-index: 1200;
}

/* Light-mode polish */

html[data-theme="light"] .site-header {
	background: var(--geeknplay-theme-header-bg);
	border-bottom: 1px solid #e3e9f3;
}

html[data-theme="light"] .site-topbar {
	background: #f3f6fb;
	border-bottom: 1px solid #e3e9f3;
}

html[data-theme="light"] .site-topbar__tagline,
html[data-theme="light"] .site-topbar__meta {
	color: #5f6f86;
}

html[data-theme="light"] .primary-menu a {
	color: #5f6f86;
}

html[data-theme="light"] .primary-menu a:hover,
html[data-theme="light"] .primary-menu .current-menu-item > a,
html[data-theme="light"] .primary-menu .current-menu-ancestor > a {
	color: #152033;
}

html[data-theme="light"] .site-footer {
	background: #ffffff;
	border-top: 1px solid #e3e9f3;
}

html[data-theme="light"] .site-footer__bottom {
	border-top: 1px solid #e3e9f3;
}

html[data-theme="light"] .archive-header,
html[data-theme="light"] .single-article,
html[data-theme="light"] .error-404 {
	box-shadow: 0 12px 28px rgba(15, 23, 42, 0.07);
}

/* Améliorations visuelles pour les boxes de review (plugin GNP Reviews) en mode clair */
html[data-theme="light"] .gnp-review-box {
	background: var(--geeknplay-theme-surface, #ffffff);
	border: 1px solid rgba(21,32,51,0.06);
	box-shadow: 0 10px 30px rgba(16,24,40,0.06);
}

html[data-theme="light"] .gnp-review-box__verdict {
	color: var(--geeknplay-theme-card-text, #1d2a3f);
	background: rgba(13,56,132,0.03);
	padding: 0.75rem 1rem;
	border-radius: 12px;
	border: 1px solid rgba(13,56,132,0.06);
}

html[data-theme="light"] .gnp-review-box__column {
	background: rgba(13,56,132,0.03);
	border: 1px solid rgba(13,56,132,0.06);
}

html[data-theme="light"] .gnp-review-box__column--pros {
	background: linear-gradient(90deg, rgba(11,136,52,0.03), rgba(11,136,52,0.01));
	border-color: rgba(11,136,52,0.06);
}

html[data-theme="light"] .gnp-review-box__column--cons {
	background: linear-gradient(90deg, rgba(198,50,50,0.02), rgba(198,50,50,0.01));
	border-color: rgba(198,50,50,0.06);
}

html[data-theme="light"] .gnp-review-box__list li {
	color: var(--geeknplay-theme-card-text, #1d2a3f);
}

/* Pros / Cons colored bullets (light mode) */
html[data-theme="light"] .gnp-review-box__column--pros .gnp-review-box__list li,
html[data-theme="light"] .gnp-review-box__column--cons .gnp-review-box__list li {
	position: relative;
	padding-left: 30px;
}

html[data-theme="light"] .gnp-review-box__column--pros .gnp-review-box__list li::before {
	content: "✓";
	position: absolute;
	left: 0;
	top: 50%;
	transform: translateY(-50%);
	display: inline-block;
	width: 20px;
	height: 20px;
	line-height: 20px;
	text-align: center;
	border-radius: 50%;
	background: rgba(11,136,52,0.12);
	color: rgba(11,136,52,0.95);
	font-weight: 800;
	font-size: 0.9rem;
}

html[data-theme="light"] .gnp-review-box__column--cons .gnp-review-box__list li::before {
	content: "✕";
	position: absolute;
	left: 0;
	top: 50%;
	transform: translateY(-50%);
	display: inline-block;
	width: 20px;
	height: 20px;
	line-height: 20px;
	text-align: center;
	border-radius: 50%;
	background: rgba(198,50,50,0.08);
	color: rgba(198,50,50,0.95);
	font-weight: 800;
	font-size: 0.9rem;
}

/* Responsive */

@media (max-width: 1024px) {
	.archive-grid {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}
}

/* Archive header styling: make the title more visible and add a subtle accent */
.archive-header{
	margin: 28px 0 18px;
	padding: 18px 0;
}
.archive-header__title{
	font-size: clamp(1.35rem, 2.6vw, 2.05rem);
	font-weight: 900;
	margin: 0 0 6px 0;
	color: var(--geeknplay-theme-text, #0b1724);
	letter-spacing: -0.02em;
	line-height: 1.03;
	position: relative;
}
.archive-header__title::before{
	content: '';
	display: block;
	position: absolute;
	left: 0;
	bottom: -10px;
	width: 48px;
	height: 6px;
	border-radius: 4px;
	background: linear-gradient(90deg,var(--gnp-accent), #ff7a66);
	box-shadow: 0 6px 18px rgba(255,122,102,0.08);
}
.archive-header__kicker{
	display:inline-block;
	font-size:.75rem;
	font-weight:700;
	text-transform:uppercase;
	letter-spacing:.12em;
	color:var(--geeknplay-theme-muted,#6b7280);
	margin-bottom:8px;
}
.archive-header__description{
	color: var(--geeknplay-theme-muted, #6b7280);
	margin-top: 6px;
}

/* Load more button for archives */
.archive-load-more-wrap{
	display:flex;
	justify-content:center;
	margin: 18px 0 28px;
}
.gnp-load-more{
	background: linear-gradient(135deg,var(--gnp-accent),#ff5a5f);
	color: #fff;
	border: none;
	padding: 10px 16px;
	border-radius: 999px;
	cursor: pointer;
	font-weight: 700;
}
.gnp-load-more[disabled]{
	opacity: 0.6;
	cursor: default;
}


/* Bouton retour en haut (single pages) */
.gnp-to-top {
	position: fixed;
	/* leave space for floating theme-toggle (right:1rem, width ~44px) */
	right: calc(1rem + 56px);
	bottom: 1.25rem;
	width: 44px;
	height: 44px;
	border-radius: 10px;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	background: var(--geeknplay-theme-surface, #131a26);
	color: var(--geeknplay-theme-button-text, #fff);
	border: 1px solid rgba(255,255,255,0.06);
	box-shadow: 0 8px 20px rgba(0,0,0,0.12);
	cursor: pointer;
	z-index: 1400;
	transition: transform 160ms ease, opacity 160ms ease;
	opacity: 0;
	transform: translateY(8px) scale(0.98);
	margin-bottom:45px;
}

.gnp-to-top[hidden] { display: none; }

.gnp-to-top.is-visible {
	opacity: 1;
	transform: translateY(0) scale(1);
}

/* Light mode variant */
html[data-theme="light"] .gnp-to-top {
	background: #ffffff;
	color: var(--geeknplay-theme-text, #152033);
	border: 1px solid rgba(21,32,51,0.08);
	box-shadow: 0 8px 24px rgba(16,24,40,0.06);
}

@media (max-width: 640px) {
	/* small screens: account for slightly smaller spacing */
	.gnp-to-top { right: calc(0.75rem + 56px); bottom: 1rem; width: 40px; height: 40px; }
}

@media (max-width: 860px) {
	/* On mobile: hide the burger button, show the menu normally, keep header sticky */
	.menu-toggle {
		display: none !important;
	}

	.primary-navigation {
		position: static;
		margin-left: 0;
	}

	.primary-menu {
		display: flex;
		flex-direction: row;
		flex-wrap: wrap;
		gap: 0.15rem;
		padding: 0;
		list-style: none;
		margin: 0;
		align-items: center;
		justify-content: flex-start;
	}

	.primary-menu a {
		display: inline-block;
		padding: 0.2rem 0.4rem;
		border-radius: 6px;
		color: var(--geeknplay-theme-text);
		text-decoration: none;
		font-size: 0.65rem;
		font-weight: 600;
		transition: background var(--geeknplay-theme-transition);
	}

	.primary-menu a:hover {
		background: rgba(255, 255, 255, 0.1);
	}

	/* Reduce SVG sizes in menu for small screens */
	.primary-menu svg {
		display: none;
	}

	/* Keep topbar social SVG visible on mobile, just reduce size */
	.site-topbar__social svg {
		width: 14px;
		height: 14px;
	}

	/* Reduce the date size on mobile */
	.site-topbar__meta {
		font-size: 0.65rem !important;
	}

	/* Transform login link into icon button on mobile */
	.header-login-link a {
		display: inline-flex !important;
		align-items: center;
		justify-content: center;
		width: 32px;
		height: 32px;
		padding: 0 !important;
		border-radius: 8px;
		border: none;
		background: transparent;
		font-size: 0;
		position: relative;
		flex-shrink: 0;
		color: var(--geeknplay-theme-text);
		transition: opacity 0.2s ease;
	}

	.header-login-link a:hover {
		opacity: 0.7;
	}

	/* User icon as SVG via ::before pseudo-element */
	.header-login-link a::before {
		content: url('data:image/svg+xml;utf8,<svg width="20" height="20" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M8 7C9.65685 7 11 5.65685 11 4C11 2.34315 9.65685 1 8 1C6.34315 1 5 2.34315 5 4C5 5.65685 6.34315 7 8 7Z" fill="currentColor"/><path d="M14 12C14 10.3431 12.6569 9 11 9H5C3.34315 9 2 10.3431 2 12V15H14V12Z" fill="currentColor"/></svg>');
		display: inline-block;
		width: 20px;
		height: 20px;
		line-height: 1;
	}

	/* Reduce site logo size on smaller viewports */
	.site-logo {
		max-height: 40px;
	}
}

@media (max-width: 640px) {
	.primary-menu svg,
	.site-topbar__social svg {
		width: 16px;
		height: 16px;
	}

	.site-logo {
		max-height: 36px;
	}
}

/* Mobile: smaller SVGs, hide clutter in topbar, make search an overlay */
@media (max-width: 640px) {
	/* Make all header icons smaller */
	.site-topbar__social svg,
	.primary-menu svg,
	.site-header .search-toggle svg {
		width: 14px;
		height: 14px;
	}

	/* Footer icons smaller on mobile */
	.site-footer__social-bottom svg,
	.site-footer__top svg {
		width: 14px;
		height: 14px;
	}

	/* Reduce footer branding/logo size on small viewports */
	.site-footer__branding img {
		max-height: 32px;
	}

	/* Keep social/meta and login visible on mobile but reduce size */
	.site-topbar__meta,
	.site-topbar__social,
	.header-login-link {
		display: flex;
		align-items: center;
		gap: 8px;
	}

	/* Keep branding visible */
	.site-branding {
		flex: 0 0 auto;
	}

	/* Ensure the magnifier (search toggle) is visible on mobile */
	.search-toggle {
		display: inline-flex;
		align-items: center;
		justify-content: center;
		padding: 6px;
	}

	/* Search overlay (doesn't push layout) */
	.search-container {
		position: relative;
	}

	/* keep form in document flow but hidden via opacity on mobile to avoid layout shifts */
	.search-form {
		display: block; /* keep block for consistent sizing */
		position: absolute;
		left: 0.5rem;
		right: 0.5rem;
		top: calc(100% + 6px);
		z-index: 1300;
		background: var(--geeknplay-theme-surface);
		border: 1px solid var(--geeknplay-theme-border);
		padding: 0.5rem;
		border-radius: 10px;
		box-shadow: 0 10px 30px rgba(0,0,0,0.08);
		opacity: 0;
		pointer-events: none;
		transform: translateY(-6px);
		transition: opacity 180ms ease, transform 200ms ease;
		max-width: calc(100% - 2rem);
		box-sizing: border-box;
		margin-left: auto;
		margin-right: auto;
	}

	.search-container.active .search-form {
		opacity: 1;
		pointer-events: auto;
		transform: translateY(0);
	}

	.search-form .search-field {
		width: 100%;
		padding: 8px 10px;
		border-radius: 8px;
		border: 1px solid var(--geeknplay-theme-border);
		background: var(--geeknplay-theme-surface);
		color: var(--geeknplay-theme-text);
	}
}

/* Prevent header from creating horizontal overflow on small screens */
@media (max-width: 640px) {
	.site-header, .site-topbar, .site-header__main {
		overflow-x: hidden;
	}
}

@media (max-width: 640px) {
	.gnp-container {
		width: min(100% - 1rem, var(--geeknplay-theme-container));
	}

	.site-main {
		padding-top: 1rem;
	}

	.home .site-main,
	.front-page .site-main {
		padding-top: 0;
	}

	.archive-grid {
		grid-template-columns: 1fr;
	}

	.single-article {
		padding: 1rem;
	}

	.single-article__title {
		font-size: clamp(1.8rem, 8vw, 2.6rem);
	}

	.entry-content {
		font-size: 1rem;
	}

	.theme-toggle--floating {
		right: 0.75rem;
		bottom: 0.75rem;
	}
}


.reading-progress {
	position: sticky;
	top: 0;
	z-index: 1002;
	height: 4px;
	background: transparent;
	pointer-events: none;
}

.site-header--admin-bar + .reading-progress {
	top: 32px;
}

.reading-progress__bar {
	display: block;
	width: 100%;
	height: 100%;
	transform: scaleX(0);
	transform-origin: left center;
	background: linear-gradient(90deg, var(--geeknplay-theme-accent), var(--geeknplay-theme-primary));
	box-shadow: 0 0 12px rgba(0, 0, 0, 0.16);
	transition: transform 80ms linear;
}

.single-toc {
	margin-top: 0;
	margin-bottom: 1rem;
}

.single-toc__inner {
	padding: 1rem 1.1rem;
	border: 1px solid var(--geeknplay-theme-border);
	border-radius: var(--geeknplay-theme-radius-lg);
	background:
		linear-gradient(180deg, rgba(255,255,255,0.02), rgba(255,255,255,0)),
		var(--geeknplay-theme-surface);
	box-shadow: var(--geeknplay-theme-shadow);
}

.single-toc__title {
	margin: 0 0 0.85rem;
	font-size: 1rem;
	font-weight: 800;
	letter-spacing: -0.02em;
	color: var(--geeknplay-theme-text);
}

.single-toc__empty {
	margin: 0;
	font-size: 0.92rem;
	color: var(--geeknplay-theme-muted);
}

.single-toc__list {
	margin: 0;
	padding-left: 1.1rem;
	display: grid;
	gap: 0.55rem;
}

.single-toc__item {
	margin: 0;
}

.single-toc__link {
	color: var(--geeknplay-theme-muted);
	text-decoration: none;
	font-size: 0.95rem;
	line-height: 1.45;
	transition: color var(--geeknplay-theme-transition);
}

.single-toc__link:hover,
.single-toc__link:focus-visible {
	color: var(--geeknplay-theme-text);
}

/* Gutenberg / Classic image left alignment inside article content */
.single-article__content .wp-block-image.alignleft,
.single-article__content figure.alignleft,
.single-article__content img.alignleft {
	float: left !important;
	margin: 0 1rem 0.9rem 0 !important;
	max-width: 40% !important;
	width: auto !important;
}

/* If the block has a caption, ensure it stays below the image */
.single-article__content figure.alignleft .wp-caption-text {
	display: block;
}

/* Responsive: on small screens, images should be full width and stacked */
@media (max-width: 699px) {
	.single-article__content .wp-block-image.alignleft,
	.single-article__content figure.alignleft,
	.single-article__content img.alignleft {
		float: none !important;
		display: block !important;
		margin: 0 0 1rem 0 !important;
		max-width: 100% !important;
		width: 100% !important;
	}
}

/* Style pour images harmonisées (classe ajoutée par JS : .gnp-uniform)
 * On utilise des variables CSS définies sur le conteneur (par JS) :
 * --gnp-article-img-w et --gnp-article-img-h
 * On applique object-fit:cover pour garder un rendu régulier, et border-radius + hover
 */
.single-article__content .wp-block-image,
.single-article__content figure,
.single-article__content .article-image {
	position: relative;
	overflow: hidden;
	border-radius: 8px;
	background: var(--gnp-color-media-bg, #f2f4f8);
	aspect-ratio: 16 / 9;
	width: 100%;
	max-width: 100%;
}

.single-article__content .wp-block-image img,
.single-article__content figure img,
.single-article__content .article-image img {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	object-fit: cover;
	display: block;
	transition: transform 0.36s cubic-bezier(.2,.9,.2,1), box-shadow 180ms ease;
}

.single-article__content .wp-block-image:hover img,
.single-article__content figure:hover img,
.single-article__content .article-image:hover img {
	transform: scale(1.04);
}

/* Float/alignleft variant: smaller fixed width but same aspect ratio */
.single-article__content .wp-block-image.alignleft,
.single-article__content figure.alignleft,
.single-article__content img.alignleft {
	float: left !important;
	margin: 0 1rem 0.9rem 0 !important;
	width: 320px !important;
	aspect-ratio: 16 / 9 !important;
	overflow: hidden;
	border-radius: 8px;
	background: var(--gnp-color-media-bg, #f2f4f8);
}

/* Apply card-like visual treatment to raw images aligned left */
.single-article__content img.alignleft {
	display: block;
	object-fit: cover;
	transition: transform 0.36s cubic-bezier(.2,.9,.2,1), box-shadow 180ms ease, filter 160ms ease;
	box-shadow: 0 2px 6px rgba(0,0,0,0.06);
}

.single-article__content img.alignleft:hover {
	transform: translateY(-4px) scale(1.04);
	box-shadow: 0 12px 30px rgba(0,0,0,0.12);
	filter: brightness(0.98) saturate(1.02);
}

/* Responsive fallback: on small screens use full width and natural height */
@media (max-width: 699px) {
	.single-article__content .wp-block-image,
	.single-article__content figure,
	.single-article__content .article-image {
		position: static;
		aspect-ratio: auto;
		width: 100%;
	}

	.single-article__content .wp-block-image img,
	.single-article__content figure img,
	.single-article__content .article-image img {
		position: static;
		width: 100%;
		height: auto;
		object-fit: contain;
	}
}

/* Styles pour la galerie legacy rendue par geeknplay_legacy_gallery_render */
.gnp-legacy-gallery {
	margin: 1rem 0;
}

.gnp-legacy-gallery__item {
	margin: 0;
}

.gnp-legacy-gallery__media {
	position: relative;
	width: 100%;
	aspect-ratio: 16 / 9;
	overflow: hidden;
	border-radius: 8px;
	background: var(--gnp-color-media-bg, #f2f4f8);
}

.gnp-legacy-gallery__media img {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	object-fit: cover;
	display: block;
	transition: transform 0.36s cubic-bezier(.2,.9,.2,1), box-shadow 180ms ease, filter 160ms ease;
}

.gnp-legacy-gallery__link:hover .gnp-legacy-gallery__media img {
	transform: scale(1.04);
	box-shadow: 0 12px 30px rgba(0,0,0,0.12);
	filter: brightness(0.98) saturate(1.02);
}

@media (max-width: 699px) {
	.gnp-legacy-gallery {
		grid-template-columns: 1fr !important;
	}
	.gnp-legacy-gallery__media {
		aspect-ratio: auto;
	}
	.gnp-legacy-gallery__media img {
		position: static;
		width: 100%;
		height: auto;
		object-fit: contain;
	}
}

/* Styles pour les vidéos YouTube [arve] converties */
.gnp-video-embed {
	position: relative;
	width: 100%;
	margin: 2rem 0;
	border-radius: 8px;
	overflow: hidden;
	background: #000;
}

.gnp-video-embed iframe {
	width: 100%;
	height: auto;
	aspect-ratio: 16 / 9;
	display: block;
}

.single-media-box__rating {
	margin: 6px 0 12px;
	font-weight: 600;
	font-size: 1.1rem;
	color: #f5c518;
	display: flex;
	align-items: center;
	gap: 10px;
}

.single-media-box__rating-value::before {
	content: "★ ";
}

/* Premium hero for single post */
.single-hero {
	position: relative;
	margin: 0 0 1.25rem;
	overflow: visible;
}

.single-hero__bg {
	position: absolute;
	inset: 0;
	background-size: cover;
	background-position: center center;
	/* Retirer le flou : image nette et percutante */
	filter: brightness(0.82) contrast(1.03);
	transform: scale(1.0);
	z-index: 0;
	opacity: 1;
	will-change: transform, opacity;
	animation: gnp-hero-zoom 12s ease-out both;
}

/* Make the hero large and immersive: image is visible and title sits inside it */
.single-hero {
	min-height: 44vh;
	border-radius: 10px;
	overflow: hidden;
}

.single-hero__inner {
	position: relative;
	z-index: 2;
	display: flex;
	align-items: center;
	gap: 1.25rem;
	padding: 3.5rem 0;
}


.single-hero__inner {
	position: relative;
	z-index: 2;
	display: flex;
	align-items: center;
	gap: 1.25rem;
	padding: 2rem 0;
}

.single-hero__content {
	color: var(--geeknplay-theme-text);
	max-width: min(70ch, 60%);
}

/* Entrée en fondu/translation pour le contenu du hero */
.single-hero__inner {
	animation: gnp-hero-content-in 700ms cubic-bezier(.2,.9,.2,1) both;
}

.single-hero__title {
	margin: 0 0 0.4rem;
	font-size: clamp(1.4rem, 2.6vw, 2rem);
	line-height: 1.05;
	font-weight: 900;
	text-shadow: 0 6px 18px rgba(0,0,0,0.35);
}

/* Meta animation: date and reading time appear as an effect under the title */
.single-hero__meta,
.single-hero .entry-meta {
	display: flex;
	gap: 0.55rem;
	align-items: center;
	color: rgba(255,255,255,0.95);
	opacity: 0;
	transform: translateY(8px);
	animation: gnp-hero-meta-in 700ms cubic-bezier(.2,.9,.2,1) 420ms both;
}

.single-hero .entry-meta time {
	color: rgba(255,255,255,0.95);
}

@keyframes gnp-hero-meta-in {
	from { opacity: 0; transform: translateY(8px); }
	to { opacity: 1; transform: translateY(0); }
}

.single-hero__meta {
	opacity: 0.95;
}

.single-hero:hover .single-hero__inner {
	transform: translateY(-2px);
}

/* Gradient overlay via pseudo-element for stronger legibility without blurring */
.single-hero::before {
	content: '';
	position: absolute;
	inset: 0;
	z-index: 1;
	background: linear-gradient(180deg, rgba(0,0,0,0.12) 0%, rgba(0,0,0,0.45) 80%);
	pointer-events: none;
	transition: opacity 240ms ease;
}

/* Keyframes */
@keyframes gnp-hero-zoom {
	0% { transform: scale(1); }
	100% { transform: scale(1.06); }
}

@keyframes gnp-hero-content-in {
	0% { opacity: 0; transform: translateY(8px); }
	100% { opacity: 1; transform: translateY(0); }
}

/* On small screens, stack media above title and reduce blur intensity */
@media (max-width: 699px) {
	.single-hero__inner {
		flex-direction: column;
		align-items: flex-start;
		gap: 0.8rem;
		padding: 1rem 0;
	}

	.single-hero__media {
		width: 100%;
		height: auto;
		aspect-ratio: 16/9;
		box-shadow: 0 6px 20px rgba(0,0,0,0.12);
	}

	.single-hero__bg {
		filter: blur(4px) brightness(0.6);
		transform: scale(1.02);
	}
}

/* Style la cover dans la sidebar/article pour qu'elle ressemble aux cards */
.single-media-box__cover {
	position: relative;
	display: inline-block; /* keep the original image size */
	overflow: hidden;
	border-radius: 8px;
	background: var(--gnp-color-media-bg, #f2f4f8);
	box-shadow: 0 2px 6px rgba(0,0,0,0.06);
}

.single-media-box__cover::after {
	/* subtle gradient overlay to match cards */
	content: '';
	position: absolute;
	inset: 0;
	pointer-events: none;
	background: linear-gradient(180deg, rgba(0,0,0,0.06), rgba(0,0,0,0.06));
	mix-blend-mode: multiply;
	opacity: 0.0;
	transition: opacity 180ms ease;
	border-radius: inherit;
}

.single-media-box__cover img {
	display: block;
	width: 100%;
	height: auto;
	object-fit: cover;
	transition: transform 0.36s cubic-bezier(.2,.9,.2,1), box-shadow 180ms ease, filter 160ms ease;
}

.single-media-box__cover:hover img {
	transform: scale(1.04);
	box-shadow: 0 12px 30px rgba(0,0,0,0.12);
	filter: brightness(0.98) saturate(1.02);
}

.single-media-box__cover:hover::after {
	opacity: 1;
}

/* Ensure rounding is kept when the img itself is used directly */
.single-media-box__cover img[loading],
.single-media-box__cover img[src] {
	border-radius: 8px;
}

.single-media-box__cover img[loading],
.single-media-box__cover img[src] {
	border-radius: 8px;
}

.single-media-box__rating-link {
	font-size: 0.85rem;
	color: #aaa;
	text-decoration: none;
}

.single-media-box__rating-link:hover {
	text-decoration: underline;
}

/* Related articles (premium cards) */
.gnp-related {
	margin-top: 2rem;
	/* keep spacing consistent with other blocks */
}

.gnp-related__heading {
	margin: 0 0 1rem;
	font-size: 1.15rem;
	font-weight: 900;
}

.gnp-related__list {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 1rem;
}

.gnp-related__item {
	background: var(--geeknplay-theme-surface);
	border: 1px solid var(--geeknplay-theme-border);
	border-radius: var(--geeknplay-theme-radius-md);
	overflow: hidden;
	box-shadow: 0 12px 30px rgba(0,0,0,0.06);
	transition: transform 260ms var(--geeknplay-theme-transition), box-shadow 260ms var(--geeknplay-theme-transition);
}

.gnp-related__item:hover,
.gnp-related__item:focus-within {
	transform: translateY(-6px);
	box-shadow: var(--geeknplay-theme-shadow);
}

.gnp-related__link {
	display: block;
	color: inherit;
	text-decoration: none;
	height: 100%;
}

.gnp-related__thumb {
	position: relative;
	width: 100%;
	padding-top: 56.25%; /* 16:9 */
	overflow: hidden;
	background: var(--gnp-color-media-bg, #f2f4f8);
}

.gnp-related__thumb img {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	object-fit: cover;
	display: block;
	transition: transform 360ms cubic-bezier(.2,.9,.2,1), filter 200ms ease;
}

.gnp-related__thumb img:hover {
	transform: scale(1.04);
	filter: brightness(0.985) saturate(1.03);
}

.gnp-related__title {
	margin: 0;
	padding: 0.9rem 1rem 1rem 1rem;
	font-size: 1rem;
	font-weight: 800;
	line-height: 1.25;
	color: var(--geeknplay-theme-text);
}

.gnp-related__item .gnp-related__thumb + .gnp-related__title {
	padding-top: 0.85rem;
}

.gnp-related__more {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	margin-top: 12px;
	padding: 8px 12px;
	border-radius: 10px;
	border: 1px solid var(--geeknplay-theme-border);
	background: var(--geeknplay-theme-surface);
	color: var(--geeknplay-theme-text);
	cursor: pointer;
	transition: transform 160ms ease, box-shadow 160ms ease;
}

.gnp-related__more:hover,
.gnp-related__more:focus-visible {
	transform: translateY(-2px);
}

@media (max-width: 1100px) {
	.gnp-related__list {
		grid-template-columns: repeat(2, 1fr);
	}
}

@media (max-width: 700px) {
	.gnp-related__list {
		grid-template-columns: 1fr;
	}
	.gnp-related__item {
		display: flex;
		gap: 12px;
		align-items: flex-start;
	}
	.gnp-related__thumb {
		flex: 0 0 38%;
		padding-top: 0; /* remove aspect padding in compact layout */
		height: 0; /* reset; we'll set via padding-bottom */
		padding-bottom: 52%; /* approximate 16:9 */
		border-top-right-radius: 8px;
		border-bottom-right-radius: 8px;
	}
	.gnp-related__title {
		padding: 0.5rem 0.25rem 0.5rem 0.25rem;
		font-size: 0.98rem;
	}
}

.gnp-page-hero {
	position: relative;
	width: 100%;
	height: 400px; /* tu peux ajuster la hauteur */
	background-size: cover;
	background-position: center;
	display: flex;
	align-items: center;
	justify-content: center;
	color: #fff;
	text-align: center;
}

.gnp-page-hero p {
	font-size: 1.2rem;
	margin-top: 0.5rem;
}

.gnp-page-content {
	padding: 2rem 0;
	max-width: 900px;
	margin: 0 auto;
}