/**
 * Tools Adapter — Galerie Projets Mosaïque (Bento Grid Fade Slider)
 */

.ta-project-gallery {
	position: relative;
	width: 100%;
	box-sizing: border-box;
}

/* Grille Mosaïque */
.ta-project-gallery__grid {
	display: grid;
	grid-template-columns: repeat(12, 1fr);
	grid-template-rows: repeat(3, minmax(180px, 1fr));
	gap: var(--ta-pg-gap, 16px);
	min-height: var(--ta-pg-height, 680px);
	box-sizing: border-box;
}

/* Placement des 6 cadres sur Desktop */
.ta-project-gallery__grid .ta-project-card:nth-child(1) {
	grid-column: 1 / 8;
	grid-row: 1 / 3;
}

.ta-project-gallery__grid .ta-project-card:nth-child(2) {
	grid-column: 8 / 13;
	grid-row: 1 / 2;
}

.ta-project-gallery__grid .ta-project-card:nth-child(3) {
	grid-column: 8 / 13;
	grid-row: 2 / 3;
}

.ta-project-gallery__grid .ta-project-card:nth-child(4) {
	grid-column: 1 / 5;
	grid-row: 3 / 4;
}

.ta-project-gallery__grid .ta-project-card:nth-child(5) {
	grid-column: 5 / 9;
	grid-row: 3 / 4;
}

.ta-project-gallery__grid .ta-project-card:nth-child(6) {
	grid-column: 9 / 13;
	grid-row: 3 / 4;
}

/* Si plus de 6 cadres : s'adaptent sur 4 colonnes (1/3) */
.ta-project-gallery__grid .ta-project-card:nth-child(n+7) {
	grid-column: span 4;
	min-height: 220px;
}

/* Carte de projet individuelle */
.ta-project-card {
	position: relative;
	overflow: hidden;
	box-sizing: border-box;
	border-radius: var(--ta-pg-radius, 16px);
	background-color: #121212;
	box-shadow: var(--ta-pg-shadow, 0 6px 20px rgba(0, 0, 0, 0.08));
	isolation: isolate;
	width: 100%;
	height: 100%;
}

/* Conteneur des diapositives */
.ta-project-card__slides {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	overflow: hidden;
}

/* Image individuelle en fondu */
.ta-project-card__slide {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	object-fit: cover;
	opacity: 0;
	z-index: 0;
	transition: opacity var(--ta-pg-fade-speed, 1000ms) ease-in-out,
				transform 0.6s cubic-bezier(0.22, 1, 0.36, 1);
	will-change: opacity, transform;
}

.ta-project-card__slide.is-active {
	opacity: 1;
	z-index: 1;
}

/* Zoom léger au survol */
.ta-project-gallery--hover-zoom .ta-project-card:hover .ta-project-card__slide.is-active {
	transform: scale(var(--ta-pg-zoom-scale, 1.05));
}

/* Dégradé sombre pour garantir la lisibilité du texte */
.ta-project-card__overlay {
	position: absolute;
	inset: 0;
	z-index: 2;
	pointer-events: none;
	background: linear-gradient(
		to top,
		rgba(0, 0, 0, var(--ta-pg-scrim-opacity, 0.75)) 0%,
		rgba(0, 0, 0, calc(var(--ta-pg-scrim-opacity, 0.75) * 0.4)) 35%,
		rgba(0, 0, 0, 0) 70%
	);
	transition: opacity 0.3s ease;
}

/* Contenu textuel */
.ta-project-card__content {
	position: absolute;
	bottom: 0;
	left: 0;
	right: 0;
	z-index: 3;
	padding: var(--ta-pg-content-padding, 20px 24px);
	pointer-events: none;
	box-sizing: border-box;
}

.ta-project-card__subtitle {
	display: block;
	margin-bottom: 4px;
	font-size: 0.8125rem;
	font-weight: 600;
	color: var(--ta-pg-subtitle-color, rgba(255, 255, 255, 0.85));
	text-shadow: 0 1px 4px rgba(0, 0, 0, 0.5);
	letter-spacing: 0.04em;
	text-transform: uppercase;
}

.ta-project-card__title {
	margin: 0;
	font-size: 1.125rem;
	font-weight: 700;
	line-height: 1.35;
	color: var(--ta-pg-title-color, #ffffff);
	text-shadow: 0 2px 8px rgba(0, 0, 0, 0.6);
	transition: color 0.25s ease;
}

/* Indicateur de photos (optionnel) */
.ta-project-card__count {
	position: absolute;
	top: 14px;
	right: 14px;
	z-index: 3;
	background-color: rgba(0, 0, 0, 0.45);
	backdrop-filter: blur(6px);
	-webkit-backdrop-filter: blur(6px);
	color: #ffffff;
	font-size: 0.75rem;
	font-weight: 600;
	padding: 4px 8px;
	border-radius: 8px;
	pointer-events: none;
	display: inline-flex;
	align-items: center;
	gap: 5px;
	line-height: 1;
}

/* Lien sur toute la carte */
.ta-project-card__link {
	position: absolute;
	inset: 0;
	z-index: 4;
	text-indent: -9999px;
	overflow: hidden;
}

/* Responsive Tablette (<= 1024px) */
@media (max-width: 1024px) {
	.ta-project-gallery__grid {
		grid-template-columns: repeat(2, 1fr);
		grid-template-rows: auto;
		min-height: auto;
	}

	.ta-project-gallery__grid .ta-project-card:nth-child(1) {
		grid-column: span 2;
		grid-row: auto;
		min-height: 320px;
	}

	.ta-project-gallery__grid .ta-project-card:nth-child(2),
	.ta-project-gallery__grid .ta-project-card:nth-child(3),
	.ta-project-gallery__grid .ta-project-card:nth-child(4),
	.ta-project-gallery__grid .ta-project-card:nth-child(5) {
		grid-column: span 1;
		grid-row: auto;
		min-height: 240px;
	}

	.ta-project-gallery__grid .ta-project-card:nth-child(6) {
		grid-column: span 2;
		grid-row: auto;
		min-height: 240px;
	}
}

/* Responsive Mobile (<= 767px) */
@media (max-width: 767px) {
	.ta-project-gallery__grid {
		grid-template-columns: 1fr;
		grid-template-rows: auto;
		gap: 12px;
	}

	.ta-project-gallery__grid .ta-project-card:nth-child(n) {
		grid-column: span 1 !important;
		grid-row: auto !important;
		min-height: 220px;
		aspect-ratio: 16 / 10;
	}

	.ta-project-card__content {
		padding: 16px 18px;
	}

	.ta-project-card__title {
		font-size: 1rem;
	}
}
