/* =======================================================================
   FRANCK LATEST USEDCARS - Maurin/WebSens
   Carousel derniers véhicules VO + cards inspirées franck-listing-used-cars
   ======================================================================= */

.franck-latest-usedcars-wrapper,
.franck-latest-usedcars-wrapper * {
    box-sizing: border-box;
}

.franck-latest-usedcars-wrapper {
    position: relative;
    clear: both;
    z-index: 1;
    width: 100%;
    margin-top: var(--fk-margin-top, 0px);
    margin-bottom: var(--fk-margin-bottom, 0px);
    font-family: var(--theme-font-primary, var(--maurin-font-primary, 'Jost', -apple-system, BlinkMacSystemFont, "Segoe UI", Arial, sans-serif));
}

.franck-latest-usedcars-wrapper :where(button, input, select, textarea, a, h1, h2, h3, h4, h5, h6, p, span, small, strong, em, div) {
    font-family: inherit;
}

.franck-latest-usedcars-wrapper--full {
    width: 100% !important;
    max-width: 100% !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
    overflow: hidden;
}

.franck-latest-usedcars-wrapper--full .franck-latest-usedcars {
    width: 100% !important;
    border-radius: 0 !important;
}

/* PASSE B — point 11 : retrait du padding fixe du wrapper (double comptait
   avec --fk-content-padding-x deja pose sur __inner, box-sizing:border-box
   -> les deux se cumulaient en mode container). __inner reste seul maitre du
   retrait horizontal desormais, desktop 42 / tablette 22 / mobile 18 (cf.
   media queries plus bas, deja correctes sur __inner). */
.franck-latest-usedcars-wrapper--container .franck-latest-usedcars {
    border-radius: var(--theme-section-container-radius, 18px);
    overflow: hidden;
}

/* PORTAGE MODE CONTAINER — 2026-08-24.
   .franck-latest-usedcars-preview-container simule la vraie <div
   class="container"> Bootstrap DANS LA PREVIEW DU BUILDER UNIQUEMENT : la
   zone de preview n'a aucun layout Bootstrap reel, contrairement au front.
   Cette classe n'est JAMAIS emise par le Twig (qui emet une vraie
   .container Bootstrap, dont les paliers viennent de Bootstrap lui-meme,
   rien a redeclarer ici) — seul le renderer builder l'emet, en mode
   sectionWidth=container.
   VALEURS BRUTES 1320/1140/960/720/540, padding 12px : ce composant est
   rendu 1:1 dans le builder (pas de zoom:75% comme franck-cards-static).
   NE PAS aligner ces valeurs sur celles de franck-cards-static
   (1760/1520/1280/960/720), calibrees pour compenser SON zoom — un zoom
   que ce composant n'a pas. Copier ses valeurs produirait un container
   33% trop large. Voir _context/REFACTOR_PROCEDURE.md, "valeurs de
   cards-static non transposables".
   Le plafond de densite de __inner (1680px, tous paliers confondus) reste
   inchange : reglage independant, dette de passe C documentee dans
   BUGS.md, hors perimetre de ce portage. */
.franck-latest-usedcars-preview-container {
    width: 100%;
    max-width: 1320px;
    margin: 0 auto;
    padding: 0 12px;
    box-sizing: border-box;
}

@media (max-width: 1399.98px) { .franck-latest-usedcars-preview-container { max-width: 1140px; } }
@media (max-width: 1199.98px) { .franck-latest-usedcars-preview-container { max-width: 960px;  } }
@media (max-width: 991.98px)  { .franck-latest-usedcars-preview-container { max-width: 720px;  } }
@media (max-width: 767.98px)  { .franck-latest-usedcars-preview-container { max-width: 540px;  } }
@media (max-width: 575.98px)  { .franck-latest-usedcars-preview-container { max-width: 100%;   } }

.franck-latest-usedcars {
    position: relative;
    width: 100%;
    overflow: hidden;
    padding-top: var(--fk-padding-top, 50px);
    padding-bottom: var(--fk-padding-bottom, 50px);
    background: var(--fk-section-bg, var(--theme-section-background, var(--maurin-white, #ffffff)));
    color: var(--fk-section-text, var(--theme-text-color, var(--maurin-text, #212221)));
    font-family: var(--theme-font-primary, var(--maurin-font-primary, 'Jost', -apple-system, BlinkMacSystemFont, "Segoe UI", Arial, sans-serif));
}

.franck-latest-usedcars__inner {
    position: relative;
    z-index: 2;
    width: var(--fk-density-width, 86%);
    max-width: 1680px;
    margin-left: auto;
    margin-right: auto;
    padding-left: var(--fk-content-padding-x, 0px);
    padding-right: var(--fk-content-padding-x, 0px);
}

.franck-latest-usedcars-wrapper--density-compact .franck-latest-usedcars__inner,
.franck-latest-usedcars-wrapper--density-small .franck-latest-usedcars__inner {
    width: 72%;
    max-width: 1140px;
}

.franck-latest-usedcars-wrapper--density-normal .franck-latest-usedcars__inner {
    width: 86%;
    max-width: 1320px;
}

.franck-latest-usedcars-wrapper--density-large .franck-latest-usedcars__inner {
    width: calc(100% - 48px);
    max-width: none;
}

.franck-latest-usedcars-wrapper--density-full .franck-latest-usedcars__inner {
    width: 100%;
    max-width: none;
}

.franck-latest-usedcars__header-row {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 14px;
    margin-bottom: var(--fk-section-header-margin-bottom, 34px);
}

.franck-latest-usedcars__header {
    max-width: var(--fk-section-header-max-width, 920px);
    text-align: var(--fk-section-title-align, left);
}

.franck-latest-usedcars__section-title {
    margin: 0;
    color: var(--fk-section-title-color, var(--theme-section-title-color, var(--maurin-primary, #1cb359)));
    font-family: var(--theme-title-font, var(--theme-font-primary, var(--maurin-font-primary, inherit)));
    font-size: var(--fk-section-title-size, var(--theme-title-size, 42px));
    line-height: 1.15;
    font-weight: var(--theme-title-weight, 600);
    letter-spacing: -.035em;
}

.franck-latest-usedcars__section-subtitle {
    margin: 0;
    text-align: var(--fk-section-title-align, left);
    color: var(--fk-section-subtitle-color, var(--theme-section-subtitle-color, var(--maurin-text, #212221)));
    font-family: var(--theme-text-font, var(--theme-font-primary, inherit));
    font-size: var(--fk-section-subtitle-size, var(--theme-subtitle-size, 18px));
    line-height: 1.45;
    font-weight: var(--theme-subtitle-weight, 500);
}

.franck-latest-usedcars__section-text {
    margin: 14px 0 0;
    color: var(--fk-section-text-content-color, var(--theme-section-text-color, var(--maurin-text, #212221)));
    font-family: var(--theme-text-font, var(--theme-font-primary, var(--maurin-font-primary, inherit)));
    font-size: var(--fk-section-text-size, 16px);
    line-height: 1.65;
}

.franck-latest-usedcars__actions {
    flex: 0 0 auto;
    display: flex;
    justify-content: flex-start;
}

.franck-latest-usedcars__all-button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    min-height: 48px;
    padding: 0 23px;
    border-radius: var(--theme-button-radius, 999px);
    background: var(--fk-all-button-bg, var(--theme-button-bg, var(--maurin-primary, #1cb359)));
    color: var(--fk-all-button-text, var(--theme-button-text-color, #ffffff)) !important;
    font-family: var(--theme-button-font, var(--theme-font-primary, var(--maurin-font-primary, inherit)));
    font-size: 14px;
    font-weight: 900;
    text-decoration: none !important;
    box-shadow: 0 14px 30px rgba(42, 109, 71, .16);
    transition: transform .22s ease, background-color .22s ease, color .22s ease, box-shadow .22s ease;
}

.franck-latest-usedcars__all-button:hover {
    transform: translateY(-2px);
    background: var(--fk-all-button-hover-bg, var(--theme-button-bg-hover, var(--maurin-secondary, #3c9a65)));
    color: var(--fk-all-button-hover-text, var(--theme-button-hover-text-color, #ffffff)) !important;
    box-shadow: 0 18px 38px rgba(42, 109, 71, .22);
}

.franck-latest-usedcars__viewport {
    overflow: hidden;
    width: 100%;
    background: transparent !important;
}

.franck-latest-usedcars__track {
    display: flex;
    align-items: stretch;
    gap: var(--fk-card-gap, 28px);
    margin: 0 !important;
    padding: 0 !important;
    list-style: none;
    background: transparent !important;
    transition: transform .58s cubic-bezier(.22, .61, .36, 1);
    will-change: transform;
    isolation: isolate;
    backface-visibility: hidden;
}

.franck-latest-usedcars__item {
    flex: 0 0 var(--fk-card-width, 25%);
    width: var(--fk-card-width, 25%);
    min-width: 0;
    display: flex;
    margin: 0 !important;
    padding: 0 !important;
}

.franck-latest-usedcars__card {
    position: relative;
    display: flex;
    flex-direction: column;
    width: 100%;
    min-height: 100%;
    overflow: hidden;
    border: 1px solid #d8dee8;
    border-radius: var(--fk-card-radius, 16px);
    background: #ffffff;
    box-shadow: 0 4px 16px -2px rgba(15, 23, 42, 0.07), 0 1px 3px rgba(15, 23, 42, 0.05);
    transform: translateY(0);
    transition: transform .25s cubic-bezier(0.16, 1, 0.3, 1), box-shadow .25s cubic-bezier(0.16, 1, 0.3, 1), border-color .25s cubic-bezier(0.16, 1, 0.3, 1);
    will-change: transform;
}

.franck-latest-usedcars__card:hover {
    transform: translateY(-5px);
    box-shadow: 0 16px 36px -6px rgba(15, 23, 42, 0.14), 0 4px 12px -2px rgba(15, 23, 42, 0.08);
    border-color: #94a3b8;
}

.franck-latest-usedcars__image-wrap {
    position: relative;
    width: 100%;
    padding-bottom: var(--fk-image-ratio, 75%);
    overflow: hidden;
    background: #f1f5f9;
    border-bottom: 1px solid #e2e8f0;
}

.fluv-gallery,
.fluc-gallery {
    user-select: none;
    -webkit-user-select: none;
}

.fluv-gallery-link,
.fluc-gallery-link {
    position: absolute;
    inset: 0;
    display: block;
    width: 100%;
    height: 100%;
    z-index: 1;
}

.fluv-gallery__track-wrap,
.fluc-gallery__track-wrap {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    overflow: hidden;
    z-index: 1;
}

.fluv-gallery__track,
.fluc-gallery__track {
    display: flex;
    width: 100%;
    height: 100%;
    transition: transform 0.35s cubic-bezier(0.22, 1, 0.36, 1);
    will-change: transform;
}

.fluv-gallery__slide,
.fluc-gallery__slide {
    position: relative;
    flex: 0 0 100%;
    width: 100%;
    height: 100%;
    display: block;
    overflow: hidden;
}

.fluv-gallery__slide img,
.fluc-gallery__slide img,
.franck-latest-usedcars__image-wrap img,
.fluv-gallery-link img,
.fluc-gallery-link img {
    position: absolute;
    inset: 0;
    display: block;
    width: 100%;
    height: 100%;
    object-fit: contain;
    object-position: center center;
    transform: scale(1);
    transition: transform .3s ease, opacity .18s ease;
}

.franck-latest-usedcars__card:hover .fluv-gallery__slide img,
.franck-latest-usedcars__card:hover .fluc-gallery__slide img,
.franck-latest-usedcars__card:hover .franck-latest-usedcars__image-wrap img,
.franck-latest-usedcars__card:hover .fluv-gallery-link img,
.franck-latest-usedcars__card:hover .fluc-gallery-link img {
    transform: scale(1.02);
}

.fluv-gallery-nav,
.fluc-gallery-nav {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    width: 36px !important;
    height: 36px !important;
    min-width: 36px !important;
    min-height: 36px !important;
    max-width: 36px !important;
    max-height: 36px !important;
    aspect-ratio: 1 / 1 !important;
    border-radius: 50% !important;
    background: rgba(255, 255, 255, 0.94);
    border: 1px solid rgba(0, 0, 0, 0.08);
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.20);
    color: #212221;
    font-size: 13px;
    font-weight: 700;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    cursor: pointer;
    z-index: 6;
    opacity: 0;
    pointer-events: none;
    transition: opacity 0.22s ease, transform 0.18s ease, background-color 0.18s ease, color 0.18s ease, box-shadow 0.18s ease;
    padding: 0 !important;
    margin: 0 !important;
    line-height: 1 !important;
    box-sizing: border-box !important;
    flex-shrink: 0 !important;
    overflow: hidden !important;
}

.fluv-gallery-nav svg,
.fluc-gallery-nav svg {
    width: 15px !important;
    height: 15px !important;
    min-width: 15px !important;
    min-height: 15px !important;
    max-width: 15px !important;
    max-height: 15px !important;
    display: block !important;
    flex-shrink: 0 !important;
    margin: auto !important;
}

.fluv-gallery-nav--prev,
.fluc-gallery-nav--prev {
    left: 10px;
}

.fluv-gallery-nav--next,
.fluc-gallery-nav--next {
    right: 10px;
}

.fluv-gallery-nav:hover,
.fluc-gallery-nav:hover {
    background: #ffffff;
    color: var(--fluc-button-bg, var(--theme-button-bg, #2a6d47));
    transform: translateY(-50%) scale(1.12);
    box-shadow: 0 6px 16px rgba(0, 0, 0, 0.28);
}

.fluv-gallery-nav:active,
.fluc-gallery-nav:active {
    transform: translateY(-50%) scale(0.95);
}

.fluv-gallery-lines,
.fluc-gallery-lines {
    position: absolute;
    bottom: 10px;
    left: 14px;
    right: 14px;
    display: flex;
    align-items: center;
    gap: 5px;
    z-index: 6;
    opacity: 0;
    pointer-events: none;
    transition: opacity 0.22s ease;
}

.fluv-gallery-line,
.fluc-gallery-line {
    flex: 1;
    height: 3px;
    background: rgba(255, 255, 255, 0.45);
    border-radius: 2px;
    cursor: pointer;
    transition: background 0.2s ease, transform 0.15s ease;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.5);
}

.fluv-gallery-line:hover,
.fluc-gallery-line:hover {
    background: rgba(255, 255, 255, 0.85);
    transform: scaleY(1.4);
}

.fluv-gallery-line.is-active,
.fluc-gallery-line.is-active {
    background: #ffffff;
    box-shadow: 0 1px 5px rgba(0, 0, 0, 0.7);
}

.franck-latest-usedcars__card:hover .fluv-gallery-nav,
.franck-latest-usedcars__card:hover .fluc-gallery-nav,
.franck-latest-usedcars__image-wrap:hover .fluv-gallery-nav,
.franck-latest-usedcars__image-wrap:hover .fluc-gallery-nav,
.franck-latest-usedcars__card:hover .fluv-gallery-lines,
.franck-latest-usedcars__card:hover .fluc-gallery-lines,
.franck-latest-usedcars__image-wrap:hover .fluv-gallery-lines,
.franck-latest-usedcars__image-wrap:hover .fluc-gallery-lines {
    opacity: 1;
    pointer-events: auto;
}

@media (hover: none), (max-width: 991px) {
    .fluv-gallery-nav,
    .fluc-gallery-nav {
        opacity: 0.92;
        pointer-events: auto;
    }
    .fluv-gallery-lines,
    .fluc-gallery-lines {
        opacity: 0.9;
        pointer-events: auto;
    }
}

.franck-latest-usedcars__title-band {
    padding: 16px 18px 8px;
    background: transparent;
}

.franck-latest-usedcars__title-band h3 {
    margin: 0;
    color: #0f172a;
    font-family: inherit;
    font-size: 17.5px;
    font-weight: 700;
    line-height: 1.25;
    letter-spacing: -0.01em;
}

.franck-latest-usedcars__brand {
    font-weight: 800;
    text-transform: uppercase;
    color: #0f172a;
    margin-right: 5px;
}

.franck-latest-usedcars__model {
    font-weight: 600;
    color: #334155;
}

.franck-latest-usedcars__title-band p {
    margin: 6px 0 0;
    color: #64748b;
    font-family: var(--theme-text-font, var(--theme-font-primary, var(--maurin-font-primary, inherit)));
    font-size: 12.5px;
    font-weight: 400;
    line-height: 1.35;
    min-height: calc(2 * 1.35em);
    max-height: calc(2 * 1.35em);
    overflow: hidden;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
}

.franck-latest-usedcars__specs {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 7px;
    padding: 10px 18px 14px;
    color: #334155;
    font-family: var(--theme-text-font, var(--theme-font-primary, var(--maurin-font-primary, inherit)));
    font-size: 12px;
    font-weight: 500;
    box-sizing: border-box;
}

.franck-latest-usedcars__specs .fluv-spec-pill,
.franck-latest-usedcars__specs .fluc-spec-pill {
    display: flex;
    align-items: center;
    gap: 8px;
    background: #f8fafc;
    border: 1px solid #e2e8f0;
    border-radius: 8px;
    padding: 7px 10px;
    min-width: 0;
    box-sizing: border-box;
    transition: background-color .15s, border-color .15s;
}

.franck-latest-usedcars__card:hover .fluv-spec-pill,
.franck-latest-usedcars__card:hover .fluc-spec-pill {
    background: #f1f5f9;
    border-color: #cbd5e1;
}

.franck-latest-usedcars__specs i {
    width: 14px;
    flex: 0 0 14px;
    color: var(--theme-button-bg, var(--maurin-primary, #2a6d47));
    font-size: 12px;
    text-align: center;
}

.franck-latest-usedcars__specs span {
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    color: #1e293b;
    font-weight: 600;
}

.franck-latest-usedcars__price-box {
    position: relative;
    margin: 0 18px 16px;
    padding: 14px 16px;
    border-radius: 12px;
    background: #f8fafc;
    border: 1px solid #e2e8f0;
    box-shadow: inset 0 1px 2px rgba(15, 23, 42, 0.02);
    font-family: var(--theme-text-font, var(--theme-font-primary, var(--maurin-font-primary, inherit)));
}

.franck-latest-usedcars__info {
    position: absolute;
    top: 10px;
    right: 10px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 24px;
    height: 24px;
    border: 0;
    border-radius: 999px;
    background: rgba(255,255,255,.9);
    color: var(--theme-button-bg, #2a6d47);
    cursor: help;
    font-size: 13px;
    transition: background .15s;
}

.franck-latest-usedcars__info:hover {
    background: #ffffff;
}

.franck-latest-usedcars__monthly small {
    display: block;
    color: #64748b;
    font-size: 11px;
    font-weight: 600;
    line-height: 1;
    text-transform: uppercase;
    letter-spacing: .04em;
}

.franck-latest-usedcars__monthly strong {
    display: flex;
    align-items: baseline;
    gap: 3px;
    margin-top: 5px;
    color: var(--fk-price-text, var(--theme-button-bg, #2a6d47));
    font-size: 25px;
    font-weight: 800;
    line-height: 1;
    letter-spacing: -.02em;
}

.franck-latest-usedcars__monthly-line {
    display: flex;
    align-items: baseline;
    gap: 3px;
    margin-top: 4px;
}

.franck-latest-usedcars__monthly em {
    color: var(--fk-price-text, var(--theme-button-bg, #2a6d47));
    font-style: normal;
    font-size: 13.5px;
    font-weight: 600;
    letter-spacing: 0;
}

.franck-latest-usedcars__cash {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    margin-top: 10px;
    padding-top: 10px;
    border-top: 1px solid #e2e8f0;
    color: #64748b;
    font-size: 12.5px;
    font-weight: 500;
}

.franck-latest-usedcars__cash strong {
    color: #0f172a;
    font-size: 15px;
    font-weight: 700;
    white-space: nowrap;
}

.franck-latest-usedcars__button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    min-height: 44px;
    margin: auto 16px 16px;
    padding: 10px 18px;
    border-radius: 10px;
    background: var(--fk-button-bg, var(--theme-button-bg, #2a6d47));
    color: var(--fk-button-text, #ffffff) !important;
    font-family: inherit;
    font-size: 13.5px;
    font-weight: 600;
    line-height: 1;
    text-decoration: none !important;
    box-shadow: 0 2px 6px rgba(42, 109, 71, 0.2);
    transition: background-color .2s ease, transform .15s ease, box-shadow .2s ease;
}

.franck-latest-usedcars__button:hover {
    background: var(--fk-button-hover-bg, var(--theme-button-bg-hover, #1e5234));
    color: var(--fk-button-hover-text, #ffffff) !important;
    transform: translateY(-1px);
    box-shadow: 0 4px 12px rgba(42, 109, 71, 0.35);
}

.franck-latest-usedcars__button:focus-visible {
    outline: 2.5px solid #111827;
    outline-offset: 2px;
}

.franck-latest-usedcars__controls {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 12px;
    margin-top: 28px;
}

.franck-latest-usedcars__control {
    appearance: none;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 44px;
    height: 44px;
    border: 1px solid color-mix(in srgb, var(--theme-text-color, #212221) 12%, transparent);
    border-radius: 999px;
    background: var(--theme-bg-white, #ffffff);
    color: var(--theme-text-color, #212221);
    cursor: pointer;
    transition: transform .2s ease, background-color .2s ease, color .2s ease, box-shadow .2s ease, opacity .2s ease;
}

.franck-latest-usedcars__control:hover:not(:disabled) {
    transform: translateY(-1px);
    background: var(--theme-button-bg, var(--maurin-primary, #2a6d47));
    color: var(--theme-button-text-color, #ffffff);
    box-shadow: 0 10px 24px rgba(42, 109, 71, .18);
}

.franck-latest-usedcars__control:disabled {
    opacity: .36;
    cursor: not-allowed;
}

.franck-latest-usedcars__empty {
    width: 100%;
    margin: 0;
    padding: 32px;
    border-radius: var(--theme-card-radius, 18px);
    background: var(--theme-card-background, #f3f3f3);
    color: var(--theme-text-color, #212221);
    text-align: center;
}

@media (max-width: 991.98px) {
    .franck-latest-usedcars-wrapper--full {
        width: 100% !important;
        max-width: 100% !important;
        margin-left: 0 !important;
        margin-right: 0 !important;
    }

    .franck-latest-usedcars__inner {
        width: 100% !important;
        padding-left: 20px;
        padding-right: 20px;
    }

    .franck-latest-usedcars__header-row {
        align-items: flex-start;
        flex-direction: column;
    }

    .franck-latest-usedcars__actions {
        justify-content: flex-start;
    }

    .franck-latest-usedcars__item {
        flex-basis: calc((100% - var(--fk-card-gap, 28px)) / 2);
        width: calc((100% - var(--fk-card-gap, 28px)) / 2);
    }
}

@media (max-width: 767.98px) {
    .franck-latest-usedcars {
        padding-top: 36px;
        padding-bottom: 36px;
    }

    .franck-latest-usedcars__inner {
        padding-left: 16px;
        padding-right: 16px;
    }

    .franck-latest-usedcars__section-title {
        font-size: clamp(24px, 6.5vw, 32px);
    }

    .franck-latest-usedcars__section-subtitle {
        font-size: clamp(14px, 3.8vw, 17px);
    }

    .franck-latest-usedcars__item {
        flex-basis: 100% !important;
        width: 100% !important;
    }

    .franck-latest-usedcars__title-band h3 {
        font-size: 19px;
    }

    .franck-latest-usedcars__button {
        min-height: 48px;
        touch-action: manipulation;
    }

    .franck-latest-usedcars__all-button {
        min-height: 48px;
        width: 100%;
        justify-content: center;
        touch-action: manipulation;
    }

    .franck-latest-usedcars__actions {
        width: 100%;
    }

    .franck-latest-usedcars__controls {
        margin-top: 20px;
    }

    .franck-latest-usedcars__control {
        width: 46px;
        height: 46px;
        touch-action: manipulation;
    }
}

/* Card cliquable sur le front live */
.franck-latest-usedcars__item[data-fluv-card-link] {
    cursor: pointer;
}

.franck-latest-usedcars__item[data-fluv-card-link]:focus-visible .franck-latest-usedcars__card {
    outline: 3px solid color-mix(in srgb, var(--fk-hover-border-color, var(--theme-button-bg, #2a6d47)) 55%, transparent);
    outline-offset: 4px;
}

/* PASSE B — point 7 : badge pilule de l'entête de section (ajout assumé).
   .franck-latest-usedcars__header n'est pas un flex avec gap (comme
   franck-cards-static) : il pilote l'alignement du bloc entête entier via
   text-align (--fk-section-title-align, partagé titre/sous-titre/texte).
   Le badge suit donc ce même text-align — display:inline-block (pas
   display:table + eyebrow-margin dédiée), sinon il ignorerait l'alignement
   partagé. Espacement vertical façon bannière (margin-bottom), pas de gap. */
.franck-latest-usedcars__eyebrow-section {
    display: inline-block;
    margin: 0 0 12px 0;
    padding: 6px 16px;
    border: var(--fk-eyebrow-border-width, 1px) solid var(--fk-eyebrow-border-color, var(--theme-button-bg, var(--maurin-primary, #2a6d47)));
    border-radius: var(--fk-eyebrow-radius, 999px);
    background: var(--fk-eyebrow-bg, transparent);
    color: var(--fk-eyebrow-color, var(--theme-eyebrow-color, #7c7c7c));
    font-family: var(--theme-text-font, var(--theme-font-primary, var(--maurin-font-primary, inherit)));
    font-size: var(--fk-eyebrow-size, var(--theme-eyebrow-size, 13px));
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: .04em;
    line-height: 1.4;
}

/* PASSE B — point 8 : animation d'entrée des cards (ajout assumé), portée par
   .franck-latest-usedcars__item (jamais par .track, qui porte le
   translate3d du carrousel — les deux transforms se composent sans conflit
   sur deux éléments DOM différents). Défaut "none" -> opacity:1 direct. */
.fluv-anim {
    transition: opacity var(--fk-animation-duration, 600ms) ease,
                transform var(--fk-animation-duration, 600ms) ease;
    transition-delay: calc(var(--fk-animation-delay, 0ms) + var(--fk-anim-index, 0) * 80ms);
}
.fluv-anim--none      { opacity: 1; }
.fluv-anim--fade      { opacity: 0; }
.fluv-anim--fade-up   { opacity: 0; transform: translateY(30px); }
.fluv-anim--fade-down { opacity: 0; transform: translateY(-30px); }
.fluv-anim--fade-left { opacity: 0; transform: translateX(-30px); }
.fluv-anim--fade-right{ opacity: 0; transform: translateX(30px); }
.fluv-anim--zoom       { opacity: 0; transform: scale(0.9); }
.fluv-anim--visible    { opacity: 1; transform: translate(0,0) scale(1); }