/**
 * AIROBOOK CAR Theme — assets/css/main.css
 * Styles principaux des composants et sections du thème.
 *
 * @package AirobookCar
 * @version 1.0
 */

/* ============================================================
   RIPPLE EFFECT (boutons)
   ============================================================ */
.btn { position: relative; overflow: hidden; }

.btn-ripple {
	position: absolute;
	width: 10px; height: 10px;
	background: rgba(255,255,255,0.3);
	border-radius: 50%;
	transform: translate(-50%, -50%) scale(0);
	animation: rippleEffect 0.5s ease-out forwards;
	pointer-events: none;
}

@keyframes rippleEffect {
	to { transform: translate(-50%, -50%) scale(20); opacity: 0; }
}


/* ============================================================
   SECTION HERO
   ============================================================ */
.hero {
	position: relative;
	min-height: 100svh;
	display: flex;
	align-items: center;
	background-color: var(--main-dark);
	overflow: hidden;
	padding-block: var(--space-24);
}

.hero-bg {
	position: absolute;
	inset: 0;
	z-index: 0;
}

.hero-bg img {
	width: 100%; height: 100%;
	object-fit: cover;
	object-position: center;
}

.hero-bg-overlay {
	position: absolute;
	inset: 0;
	background: linear-gradient(
		135deg,
		rgba(26, 26, 26, 0.92) 0%,
		rgba(26, 26, 26, 0.75) 50%,
		rgba(211, 47, 47, 0.15) 100%
	);
}

.hero-content {
	position: relative;
	z-index: 1;
	max-width: 760px;
}

.hero-label {
	display: inline-flex;
	align-items: center;
	gap: var(--space-2);
	padding: var(--space-2) var(--space-4);
	background: var(--primary-red-light);
	border: 1px solid rgba(211, 47, 47, 0.3);
	border-radius: var(--radius-full);
	font-size: var(--fs-xs);
	font-weight: var(--fw-bold);
	letter-spacing: 0.12em;
	text-transform: uppercase;
	color: var(--primary-red);
	margin-bottom: var(--space-5);
	animation: fadeInUp 0.6s ease 0.1s both;
}

.hero-title {
	font-size: clamp(2.5rem, 6vw, 5rem);
	font-weight: var(--fw-extrabold);
	color: var(--white);
	line-height: 1.1;
	margin-bottom: var(--space-5);
	animation: fadeInUp 0.7s ease 0.25s both;
}

.hero-title .accent { color: var(--primary-red); }

.hero-subtitle {
	font-size: clamp(var(--fs-base), 2vw, var(--fs-md));
	color: rgba(255,255,255,0.75);
	line-height: 1.7;
	max-width: 560px;
	margin-bottom: var(--space-8);
	animation: fadeInUp 0.7s ease 0.4s both;
}

.hero-actions {
	display: flex;
	align-items: center;
	flex-wrap: wrap;
	gap: var(--space-4);
	animation: fadeInUp 0.7s ease 0.55s both;
}

.hero-stats {
	display: flex;
	align-items: center;
	gap: var(--space-8);
	margin-top: var(--space-10);
	padding-top: var(--space-8);
	border-top: 1px solid rgba(255,255,255,0.1);
	animation: fadeInUp 0.7s ease 0.7s both;
}

.hero-stat-value {
	display: block;
	font-size: var(--fs-2xl);
	font-weight: var(--fw-extrabold);
	color: var(--white);
	line-height: 1;
	font-family: var(--font-heading);
}

.hero-stat-label {
	display: block;
	font-size: var(--fs-xs);
	color: rgba(255,255,255,0.5);
	text-transform: uppercase;
	letter-spacing: 0.08em;
	margin-top: var(--space-1);
}

.hero-scroll-hint {
	position: absolute;
	bottom: var(--space-8);
	left: 50%;
	transform: translateX(-50%);
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: var(--space-2);
	color: rgba(255,255,255,0.4);
	font-size: var(--fs-xs);
	letter-spacing: 0.1em;
	text-transform: uppercase;
	animation: fadeIn 1s ease 1.2s both;
}

.scroll-arrow {
	animation: scrollBounce 1.8s ease-in-out infinite;
}

@keyframes scrollBounce {
	0%, 100% { transform: translateY(0); opacity: 0.4; }
	50%       { transform: translateY(8px); opacity: 1; }
}


/* ============================================================
   CARDS VÉHICULES
   ============================================================ */
.vehicle-card {
	background: var(--white);
	border-radius: var(--radius-xl);
	overflow: hidden;
	box-shadow: var(--shadow-md);
	border: 1px solid var(--border-color-dark);
	transition: all 0.3s ease;
	display: flex;
	flex-direction: column;
}

.vehicle-card:hover {
	transform: translateY(-6px) scale(1.01);
	box-shadow: var(--shadow-xl);
	border-color: rgba(211, 47, 47, 0.2);
}

.vehicle-card-image {
	position: relative;
	aspect-ratio: 16 / 10;
	overflow: hidden;
	background: var(--light-grey);
}

.vehicle-card-image img {
	width: 100%; height: 100%;
	object-fit: cover;
	transition: transform 0.5s ease;
}

.vehicle-card:hover .vehicle-card-image img {
	transform: scale(1.06);
}

.vehicle-card-badge {
	position: absolute;
	top: var(--space-3);
	left: var(--space-3);
}

.vehicle-card-body {
	padding: var(--space-5);
	flex: 1;
	display: flex;
	flex-direction: column;
}

.vehicle-card-title {
	font-size: var(--fs-lg);
	font-weight: var(--fw-bold);
	color: var(--main-dark);
	margin-bottom: var(--space-2);
}

.vehicle-card-category {
	font-size: var(--fs-xs);
	color: var(--primary-red);
	font-weight: var(--fw-semibold);
	text-transform: uppercase;
	letter-spacing: 0.08em;
	margin-bottom: var(--space-4);
}

.vehicle-card-specs {
	display: flex;
	align-items: center;
	gap: var(--space-4);
	flex-wrap: wrap;
	margin-bottom: var(--space-5);
	padding-block: var(--space-4);
	border-block: 1px solid var(--border-color-dark);
}

.vehicle-spec {
	display: flex;
	align-items: center;
	gap: var(--space-2);
	font-size: var(--fs-sm);
	color: #555;
}

.vehicle-spec svg { color: var(--primary-red); flex-shrink: 0; }

.vehicle-card-footer {
	display: flex;
	align-items: center;
	justify-content: space-between;
	margin-top: auto;
}

.vehicle-price {
	display: flex;
	flex-direction: column;
}

.vehicle-price-value {
	font-size: var(--fs-xl);
	font-weight: var(--fw-extrabold);
	color: var(--primary-red);
	font-family: var(--font-heading);
	line-height: 1;
}

.vehicle-price-unit {
	font-size: var(--fs-xs);
	color: #888;
	margin-top: 2px;
}


/* ============================================================
   SECTION SEARCH / BOOKING BAR
   ============================================================ */
.booking-bar {
	background: var(--white);
	border-radius: var(--radius-xl);
	padding: var(--space-6);
	box-shadow: var(--shadow-xl);
	display: grid;
	grid-template-columns: 1fr 1fr 1fr auto;
	gap: var(--space-4);
	align-items: end;
	border: 1px solid var(--border-color-dark);
}

.booking-field { display: flex; flex-direction: column; gap: var(--space-2); }

.booking-field label {
	font-size: var(--fs-xs);
	font-weight: var(--fw-semibold);
	text-transform: uppercase;
	letter-spacing: 0.08em;
	color: #666;
}

.booking-field input,
.booking-field select {
	padding: var(--space-3) var(--space-4);
	border: 1.5px solid #e5e5e5;
	border-radius: var(--radius-md);
	font-size: var(--fs-base);
	color: var(--main-dark);
	background: var(--white);
	transition: all 0.3s ease;
	width: 100%;
}

.booking-field input:focus,
.booking-field select:focus {
	border-color: var(--primary-red);
	outline: none;
	box-shadow: 0 0 0 3px var(--primary-red-light);
}

@media (max-width: 900px) {
	.booking-bar { grid-template-columns: 1fr 1fr; }
}
@media (max-width: 580px) {
	.booking-bar { grid-template-columns: 1fr; }
	.hero-stats  { flex-wrap: wrap; gap: var(--space-5); }
}


/* ============================================================
   SECTION FEATURES / AVANTAGES
   ============================================================ */
.feature-card {
	padding: var(--space-6);
	border-radius: var(--radius-xl);
	background: var(--dark-grey);
	border: 1px solid rgba(255,255,255,0.06);
	transition: transform 0.5s cubic-bezier(0.16, 1, 0.3, 1), background-color 0.4s ease, border-color 0.4s ease, box-shadow 0.4s ease;
	text-align: center;
}

.feature-card:hover {
	background: var(--primary-red);
	border-color: var(--primary-red);
	transform: translateY(-8px) scale(1.03);
	box-shadow: 0 20px 40px rgba(211, 47, 47, 0.3);
}

.feature-icon {
	width: 56px; height: 56px;
	display: flex; align-items: center; justify-content: center;
	background: var(--primary-red-light);
	border-radius: var(--radius-lg);
	margin-inline: auto;
	margin-bottom: var(--space-4);
	color: var(--primary-red);
	transition: all 0.3s ease;
}

.feature-card:hover .feature-icon {
	background: rgba(255,255,255,0.2);
	color: var(--white);
}

.feature-title {
	font-size: var(--fs-md);
	font-weight: var(--fw-bold);
	color: var(--white);
	margin-bottom: var(--space-3);
}

.feature-desc {
	font-size: var(--fs-sm);
	color: rgba(255,255,255,0.6);
	line-height: 1.7;
	transition: color 0.3s ease;
}

.feature-card:hover .feature-desc { color: rgba(255,255,255,0.85); }


/* ============================================================
   TESTIMONIALS
   ============================================================ */
.testimonial-card {
	background: var(--white);
	border-radius: var(--radius-xl);
	padding: var(--space-6);
	box-shadow: var(--shadow-md);
	border: 1px solid var(--border-color-dark);
	transition: all 0.3s ease;
	position: relative;
}

.testimonial-card:hover {
	transform: translateY(-4px);
	box-shadow: var(--shadow-lg);
}

.testimonial-quote {
	font-size: var(--fs-md);
	color: var(--dark-grey);
	line-height: 1.7;
	margin-bottom: var(--space-5);
	font-style: italic;
}

.testimonial-quote::before {
	content: '\201C';
	font-size: 3rem;
	color: var(--primary-red);
	line-height: 0;
	vertical-align: -0.7rem;
	margin-right: var(--space-1);
	font-style: normal;
	font-family: Georgia, serif;
}

.testimonial-author {
	display: flex;
	align-items: center;
	gap: var(--space-3);
}

.testimonial-avatar {
	width: 44px; height: 44px;
	border-radius: 50%;
	object-fit: cover;
	border: 2px solid var(--primary-red);
}

.testimonial-name {
	font-weight: var(--fw-bold);
	font-size: var(--fs-base);
	color: var(--main-dark);
}

.testimonial-city {
	font-size: var(--fs-xs);
	color: #888;
}

.star-rating {
	display: flex;
	gap: 2px;
	margin-bottom: var(--space-4);
	color: #F59E0B;
}


/* ============================================================
   CTA SECTION
   ============================================================ */
.cta-section {
	background: linear-gradient(135deg, var(--primary-red) 0%, var(--primary-red-hover) 100%);
	padding-block: var(--space-20);
	text-align: center;
	position: relative;
	overflow: hidden;
}

.cta-section::before {
	content: '';
	position: absolute;
	inset: 0;
	background: 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='%23ffffff' fill-opacity='0.04'%3E%3Cpath d='M36 34v-4h-2v4h-4v2h4v4h2v-4h4v-2h-4zm0-30V0h-2v4h-4v2h4v4h2V6h4V4h-4zM6 34v-4H4v4H0v2h4v4h2v-4h4v-2H6zM6 4V0H4v4H0v2h4v4h2V6h4V4H6z'/%3E%3C/g%3E%3C/g%3E%3C/svg%3E");
}

.cta-section h2 { color: var(--white); position: relative; }
.cta-section p  { color: rgba(255,255,255,0.85); position: relative; }

.cta-actions {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: var(--space-4);
	flex-wrap: wrap;
	margin-top: var(--space-8);
	position: relative;
}


/* ============================================================
   WORDPRESS — Alignements, galerie, etc.
   ============================================================ */
.alignleft  { float: left;  margin-right: var(--space-6); }
.alignright { float: right; margin-left:  var(--space-6); }
.aligncenter { display: block; margin-inline: auto; }
.alignwide  { max-width: min(100%, 1400px); margin-inline: auto; }
.alignfull  { width: 100%; max-width: none; }

.wp-caption { max-width: 100%; }
.wp-caption-text { font-size: var(--fs-sm); color: #888; text-align: center; margin-top: var(--space-2); }

/* Pagination */
.navigation.pagination {
	display: flex; justify-content: center;
	padding-block: var(--space-10);
}

.nav-links {
	display: flex; align-items: center; gap: var(--space-2);
}

.page-numbers {
	display: inline-flex; align-items: center; justify-content: center;
	min-width: 40px; height: 40px;
	padding-inline: var(--space-3);
	border-radius: var(--radius-md);
	font-weight: var(--fw-medium);
	color: var(--main-dark);
	border: 1.5px solid #e5e5e5;
	transition: all 0.3s ease;
}

.page-numbers:hover       { border-color: var(--primary-red); color: var(--primary-red); transform: scale(1.02); }
.page-numbers.current     { background: var(--primary-red); color: var(--white); border-color: var(--primary-red); }
.page-numbers.dots        { border: none; pointer-events: none; }


/* ============================================================
   KEYFRAMES SUPPLÉMENTAIRES — Templates catalogue
   ============================================================ */
@keyframes waPulse {
  0%   { box-shadow: 0 0 0 0    rgba(37, 211, 102, 0.55); }
  60%  { box-shadow: 0 0 0 18px rgba(37, 211, 102, 0);    }
  100% { box-shadow: 0 0 0 0    rgba(37, 211, 102, 0);     }
}

@keyframes waBgFlash {
  0%, 100% { background: rgba(255,255,255,0);    }
  50%       { background: rgba(255,255,255,0.08); }
}

@keyframes scrollLine {
  0%   { transform: scaleY(0); transform-origin: top;    opacity: 1; }
  50%  { transform: scaleY(1); transform-origin: top;    opacity: 1; }
  100% { transform: scaleY(1); transform-origin: bottom; opacity: 0; }
}


/* ============================================================
   HERO — front-page.php
   ============================================================ */
.hero__bg {
  position: absolute; inset: 0;
  background:
    linear-gradient(135deg, rgba(26,26,26,0.96) 0%, rgba(26,26,26,0.80) 55%, rgba(211,47,47,0.18) 100%),
    radial-gradient(ellipse at 70% 50%, rgba(211,47,47,0.12) 0%, transparent 60%);
  z-index: 0;
}
.hero__overlay { position: absolute; inset: 0; background: rgba(26,26,26,0.45); }
.hero__grid-pattern {
  position: absolute; inset: 0;
  background-image: linear-gradient(rgba(255,255,255,0.03) 1px, transparent 1px), linear-gradient(90deg, rgba(255,255,255,0.03) 1px, transparent 1px);
  background-size: 60px 60px;
}
.hero__container { position: relative; z-index: 1; padding-block: var(--space-32); }
.hero__label {
  display: inline-flex; align-items: center; gap: var(--space-2);
  padding: var(--space-2) var(--space-4);
  background: rgba(211,47,47,0.12); border: 1px solid rgba(211,47,47,0.35);
  border-radius: var(--radius-full); font-size: var(--fs-xs); font-weight: var(--fw-bold);
  letter-spacing: 0.14em; text-transform: uppercase; color: var(--primary-red); margin-bottom: var(--space-5);
}
.hero__label-dot { width:7px; height:7px; border-radius:50%; background:var(--primary-red); animation: pulse 2s ease-in-out infinite; }
.hero__title { font-size: clamp(2.8rem,6vw,5.5rem); font-weight:var(--fw-extrabold); color:var(--white); line-height:1.08; margin-bottom:var(--space-6); font-family:var(--font-heading); }
.hero__title-accent { display:block; color:var(--primary-red); }
.hero__subtitle { font-size:clamp(var(--fs-base),2vw,var(--fs-md)); color:rgba(255,255,255,0.72); line-height:1.75; max-width:580px; margin-bottom:var(--space-8); }
.hero__cta { display:flex; align-items:center; flex-wrap:wrap; gap:var(--space-4); margin-bottom:var(--space-10); }

.btn-outline-white {
  display:inline-flex; align-items:center; justify-content:center;
  gap:var(--space-2); padding:var(--space-3) var(--space-6);
  font-family:var(--font-primary); font-size:var(--fs-base); font-weight:var(--fw-semibold);
  border-radius:var(--radius-md); border:2px solid rgba(255,255,255,0.4);
  color:var(--white); background:transparent; text-decoration:none;
  transition:var(--transition-base); cursor:pointer;
}
.btn-outline-white:hover, .btn-outline-white:focus-visible { border-color:var(--white); background:rgba(255,255,255,0.1); color:var(--white); }

.hero__stats { display:flex; align-items:center; gap:var(--space-8); padding-top:var(--space-8); border-top:1px solid rgba(255,255,255,0.1); }
.hero__stat-value { display:block; font-size:var(--fs-2xl); font-weight:var(--fw-extrabold); color:var(--white); font-family:var(--font-heading); line-height:1; }
.hero__stat-plus  { color:var(--primary-red); }
.hero__stat-label { display:block; font-size:var(--fs-xs); color:rgba(255,255,255,0.5); text-transform:uppercase; letter-spacing:0.08em; margin-top:var(--space-1); }
.hero__stat-sep   { width:1px; height:40px; background:rgba(255,255,255,0.15); }
.hero__scroll     { position:absolute; bottom:var(--space-8); left:50%; transform:translateX(-50%); z-index:1; }
.hero__scroll-line { display:block; width:2px; height:48px; background:linear-gradient(to bottom,var(--primary-red),transparent); border-radius:2px; animation:scrollLine 2s ease-in-out infinite; }
@media (max-width:768px) { .hero__container { padding-block:var(--space-20); } .hero__stats { flex-wrap:wrap; gap:var(--space-5); } }


/* ============================================================
   RÉASSURANCE
   ============================================================ */
.reassurance__grid { display:grid; grid-template-columns:repeat(4,1fr); gap:var(--space-6); list-style:none; padding:0; margin:0; }
.reassurance__item { display:flex; align-items:flex-start; gap:var(--space-4); padding:var(--space-5); border-radius:var(--radius-lg); border:1px solid rgba(255,255,255,0.07); transition:var(--transition-base); }
.reassurance__item:hover { background:rgba(255,255,255,0.04); border-color:rgba(211,47,47,0.25); transform:translateY(-3px); }
.reassurance__icon { flex-shrink:0; width:48px; height:48px; display:flex; align-items:center; justify-content:center; background:rgba(211,47,47,0.1); border-radius:var(--radius-md); }
.reassurance__text { display:flex; flex-direction:column; gap:var(--space-1); }
.reassurance__text strong { font-size:var(--fs-base); font-weight:var(--fw-semibold); color:var(--white); }
.reassurance__text span   { font-size:var(--fs-sm); color:rgba(255,255,255,0.55); line-height:1.5; }
@media (max-width:1024px) { .reassurance__grid { grid-template-columns:repeat(2,1fr); } }
@media (max-width:600px)  { .reassurance__grid { grid-template-columns:1fr; } }


/* ============================================================
   GRILLE VOITURES — car-card (front-page + archive)
   ============================================================ */
.car-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:var(--space-6); margin-bottom:var(--space-12); }

/* Carte */
.car-card { background:var(--white); border-radius:var(--radius-xl); overflow:hidden; box-shadow:var(--shadow-sm); border:1px solid var(--border-color-dark); display:flex; flex-direction:column; transition:transform 0.5s cubic-bezier(0.16, 1, 0.3, 1), box-shadow 0.5s ease; will-change: transform, box-shadow; }
.car-card:hover { transform:translateY(-12px) scale(1.02); box-shadow:0 24px 48px rgba(211,47,47,0.18), 0 0 0 1px var(--primary-red); z-index: 2; position: relative; }

.car-card__image-link { display:block; text-decoration:none; }
.car-card__image-wrap { position:relative; overflow:hidden; border-radius:var(--radius-xl) var(--radius-xl) 0 0; }
.car-card__image { width:100%; height:auto; display:block; object-fit:contain; transition:transform 0.6s cubic-bezier(0.16, 1, 0.3, 1), filter 0.6s ease; will-change: transform, filter; }
.car-card:hover .car-card__image { transform:scale(1.08); filter: brightness(1.05); }
.car-card__image-placeholder { width:100%; height:100%; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:var(--space-3); background:var(--light-grey); color:#aaa; font-size:var(--fs-sm); }

.car-card__badge { position:absolute; top:var(--space-3); left:var(--space-3); z-index:1; pointer-events:none; }
.car-card__badge-clim { position:absolute; top:var(--space-3); right:var(--space-3); z-index:1; display:inline-flex; align-items:center; gap:4px; padding:3px 8px; background:rgba(37,211,102,0.85); color:white; border-radius:var(--radius-full); font-size:11px; font-weight:var(--fw-bold); backdrop-filter:blur(4px); }

.car-card__body { padding:var(--space-5); flex:1; display:flex; flex-direction:column; }
.car-card__title { font-size:var(--fs-lg); font-weight:var(--fw-bold); color:var(--main-dark); margin-bottom:var(--space-3); line-height:1.3; }
.car-card__title a { color:inherit; text-decoration:none; transition:color .2s ease; }
.car-card__title a:hover { color:var(--primary-red); }

.car-card__specs { display:flex; flex-wrap:wrap; gap:var(--space-2) var(--space-4); list-style:none; padding:var(--space-3) 0; border-top:1px solid var(--border-color-dark); border-bottom:1px solid var(--border-color-dark); margin-bottom:var(--space-4); }
.car-card__spec { display:flex; align-items:center; gap:var(--space-1); font-size:var(--fs-sm); color:#666; }
.car-card__spec svg { color:var(--primary-red); flex-shrink:0; }

.car-card__footer  { margin-top:auto; display:flex; align-items:center; justify-content:flex-end; }
.car-card__actions { display:flex; align-items:center; gap:var(--space-2); }

.btn-whatsapp { display:inline-flex; align-items:center; justify-content:center; gap:var(--space-1); padding:var(--space-2) var(--space-4); font-size:var(--fs-sm); font-weight:var(--fw-semibold); border-radius:var(--radius-md); background:#25D366; color:var(--white); border:2px solid #25D366; text-decoration:none; transition:var(--transition-base); cursor:pointer; white-space:nowrap; }
.btn-whatsapp:hover, .btn-whatsapp:focus-visible { background:#1ebe5c; border-color:#1ebe5c; color:var(--white); transform:scale(1.03); box-shadow:0 4px 16px rgba(37,211,102,0.35); }

.fleet-preview__cta   { margin-top:var(--space-4); }
.fleet-preview__empty { padding:var(--space-12); color:#888; font-size:var(--fs-md); text-align:center; }

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


/* ============================================================
   ARCHIVE — En-tête + Breadcrumb + Filtres + Pagination
   ============================================================ */
.archive-hero { position:relative; background:var(--main-dark); padding-block:var(--space-16) var(--space-12); text-align:center; overflow:hidden; }
.archive-hero__bg { position:absolute; inset:0; }
.archive-hero__overlay { position:absolute; inset:0; background:linear-gradient(135deg,rgba(26,26,26,0.95) 0%,rgba(211,47,47,0.12) 100%); }
.archive-hero__container { position:relative; z-index:1; }
.archive-hero__title { font-size:clamp(var(--fs-3xl),5vw,var(--fs-4xl)); font-weight:var(--fw-extrabold); color:var(--white); margin-block:var(--space-3) var(--space-4); font-family:var(--font-heading); }
.archive-hero__subtitle { font-size:var(--fs-base); color:rgba(255,255,255,0.6); }

.breadcrumb { margin-top:var(--space-5); }
.breadcrumb__list { display:flex; align-items:center; justify-content:center; flex-wrap:wrap; gap:var(--space-1); list-style:none; padding:0; font-size:var(--fs-sm); }
.breadcrumb__item a { color:rgba(255,255,255,0.55); text-decoration:none; transition:color .2s ease; }
.breadcrumb__item a:hover { color:var(--primary-red); }
.breadcrumb__item--current { color:rgba(255,255,255,0.85); }
.breadcrumb__sep { color:rgba(255,255,255,0.25); }

.single-breadcrumb { background:var(--light-grey); border-bottom:1px solid var(--border-color-dark); padding-block:var(--space-3); }
.single-breadcrumb .breadcrumb__list         { justify-content:flex-start; }
.single-breadcrumb .breadcrumb__item a       { color:#666; }
.single-breadcrumb .breadcrumb__item a:hover { color:var(--primary-red); }
.single-breadcrumb .breadcrumb__item--current { color:var(--main-dark); }
.single-breadcrumb .breadcrumb__sep           { color:#ccc; }

.archive-filters { background:var(--white); border-bottom:1px solid var(--border-color-dark); padding-block:var(--space-5); position:sticky; top:var(--header-height); z-index:var(--z-dropdown); }
.filter-nav { display:flex; align-items:center; flex-wrap:wrap; gap:var(--space-2); }
.filter-btn { display:inline-flex; align-items:center; gap:var(--space-2); padding:var(--space-2) var(--space-4); border-radius:var(--radius-full); font-size:var(--fs-sm); font-weight:var(--fw-medium); color:var(--main-dark); background:var(--light-grey); border:1.5px solid transparent; text-decoration:none; transition:var(--transition-base); white-space:nowrap; }
.filter-btn:hover     { border-color:var(--primary-red); color:var(--primary-red); background:var(--primary-red-light); }
.filter-btn.is-active { background:var(--primary-red); color:var(--white); border-color:var(--primary-red); }
.filter-btn__count { display:inline-flex; align-items:center; justify-content:center; min-width:20px; height:20px; padding-inline:4px; background:rgba(0,0,0,0.12); border-radius:var(--radius-full); font-size:11px; font-weight:var(--fw-bold); }
.filter-btn.is-active .filter-btn__count { background:rgba(255,255,255,0.25); }

.archive-empty { padding:var(--space-16); display:flex; flex-direction:column; align-items:center; gap:var(--space-5); }
.archive-pagination { display:flex; justify-content:center; padding-top:var(--space-10); margin-bottom:var(--space-6); }
.archive-pagination ul { display:inline-flex; align-items:center; gap:var(--space-1); list-style:none; padding:6px; background:var(--white); border: 1px solid rgba(0,0,0,0.06); box-shadow: 0 8px 24px rgba(0,0,0,0.04); border-radius: 999px; outline: none !important; }
.archive-pagination li { outline: none !important; }
.archive-pagination .page-numbers { display:inline-flex; align-items:center; justify-content:center; min-width:40px; height:40px; padding-inline:12px; border-radius: 999px; font-weight:var(--fw-bold); font-size:var(--fs-sm); color:var(--dark-grey); text-decoration:none; transition:all 0.4s cubic-bezier(0.16, 1, 0.3, 1); outline: none !important; border: none; background: transparent; }
.archive-pagination .page-numbers:hover { background: rgba(211,47,47,0.08); color: var(--primary-red); transform: scale(1.05); }
.archive-pagination .page-numbers.current { background: var(--primary-red); color: var(--white); box-shadow: 0 4px 12px rgba(211,47,47,0.35); }
.archive-pagination .page-numbers.dots { pointer-events: none; color: #999; background: transparent; }


/* ============================================================
   SINGLE VOITURE
   ============================================================ */
.single-voiture__layout { display:grid; grid-template-columns:1fr 420px; gap:var(--space-10); align-items:start; }

.single-voiture__main-image { position:relative; border-radius:var(--radius-xl); overflow:hidden; box-shadow:var(--shadow-lg); background: transparent; }
.single-voiture__img { width:100%; height:auto; display:block; object-fit:contain; transition:transform .5s ease; }
.single-voiture__main-image:hover .single-voiture__img { transform:scale(1.03); }
.single-voiture__img-placeholder { width:100%; height:100%; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:var(--space-4); color:#aaa; font-size:var(--fs-sm); background:var(--light-grey); }
.single-voiture__cat-badge { position:absolute; top:var(--space-4); left:var(--space-4); z-index:1; }

.single-voiture__description { margin-top:var(--space-8); padding:var(--space-6); background:var(--white); border-radius:var(--radius-xl); border:1px solid var(--border-color-dark); box-shadow:var(--shadow-sm); }
.single-voiture__desc-title   { font-size:var(--fs-xl); font-weight:var(--fw-bold); margin-bottom:var(--space-4); }
.single-voiture__desc-content { font-size:var(--fs-base); color:var(--dark-grey); line-height:1.75; }

.single-voiture__info { position:sticky; top:calc(var(--header-height) + var(--space-6)); background:var(--white); border-radius:var(--radius-xl); padding:var(--space-6); box-shadow:var(--shadow-md); border:1px solid var(--border-color-dark); display:flex; flex-direction:column; gap:var(--space-5); }
.single-voiture__title { font-size:clamp(var(--fs-xl),3vw,var(--fs-2xl)); font-weight:var(--fw-extrabold); color:var(--main-dark); line-height:1.2; margin:0; }
.single-voiture__specs-grid { display:grid; grid-template-columns:1fr 1fr; gap:var(--space-3); }

.spec-item { display:flex; align-items:center; gap:var(--space-3); padding:var(--space-3) var(--space-4); background:var(--light-grey); border-radius:var(--radius-lg); border:1px solid transparent; transition:var(--transition-fast); }
.spec-item:hover { border-color:var(--primary-red-light); background:rgba(211,47,47,0.04); }
.spec-item__icon { flex-shrink:0; width:38px; height:38px; display:flex; align-items:center; justify-content:center; background:var(--white); border-radius:var(--radius-md); color:var(--primary-red); box-shadow:var(--shadow-sm); }
.spec-item__content { display:flex; flex-direction:column; gap:2px; }
.spec-item__label { font-size:11px; text-transform:uppercase; letter-spacing:0.08em; color:#999; font-weight:var(--fw-semibold); }
.spec-item__value { font-size:var(--fs-sm); font-weight:var(--fw-bold); color:var(--main-dark); }
.spec-item__value--yes { color:#16a34a; }
.spec-item__value--no  { color:#dc2626; }
.single-voiture__back  { width:100%; justify-content:center; }


/* ============================================================
   BOUTON WHATSAPP PRINCIPAL — Pulsation infinie
   ============================================================ */
.btn-whatsapp-main { position:relative; display:flex; align-items:center; gap:var(--space-3); padding:var(--space-4) var(--space-5); background:linear-gradient(135deg,#25D366 0%,#1ebe5c 100%); color:var(--white); border-radius:var(--radius-lg); text-decoration:none; font-weight:var(--fw-semibold); overflow:hidden; transition:transform .2s ease,box-shadow .2s ease; animation:waPulse 2.4s ease-in-out infinite; }
.btn-whatsapp-main:hover, .btn-whatsapp-main:focus-visible { transform:scale(1.02) translateY(-2px); box-shadow:0 8px 28px rgba(37,211,102,0.45); animation-play-state:paused; color:var(--white); }
.btn-whatsapp-main__pulse { position:absolute; inset:0; border-radius:inherit; animation:waBgFlash 2.4s ease-in-out infinite; pointer-events:none; }
.btn-whatsapp-main__icon  { flex-shrink:0; }
.btn-whatsapp-main__text  { display:flex; flex-direction:column; gap:2px; min-width:0; }
.btn-whatsapp-main__text strong { font-size:var(--fs-base); font-weight:var(--fw-bold); line-height:1.2; }
.btn-whatsapp-main__text small  { font-size:var(--fs-xs); opacity:.8; font-weight:var(--fw-regular); }


/* ============================================================
   RESPONSIVE — Single voiture
   ============================================================ */
@media (max-width:1024px) {
  .single-voiture__layout     { grid-template-columns:1fr; }
  .single-voiture__info       { position:static; }
  .single-voiture__specs-grid { grid-template-columns:repeat(3,1fr); }
}
@media (max-width:640px) {
  .single-voiture__specs-grid { grid-template-columns:repeat(2,1fr); }
  .archive-filters            { position:static; }
}
