/* ╔═══════════════════════════════════════════════════════════╗
   ║ LTC LOGOS CAROUSEL — 5 layouts                            ║
   ║ marquee / grid / cards / separated / badge                ║
   ╚═══════════════════════════════════════════════════════════╝ */

.ltc-lc{
    --ltc-primary:#1679BE;
    --ltc-secondary:#000000;
    --ltc-bg:#ffffff;
    padding:64px 24px;
    overflow:hidden;
    position:relative;
}

/* ──────────────── EN-TÊTE ──────────────── */
.ltc-lc__header{
    text-align:center;
    margin-bottom:40px;
}
.ltc-lc--align-left .ltc-lc__header{text-align:left;}
.ltc-lc--align-right .ltc-lc__header{text-align:right;}

.ltc-lc__eyebrow{
    display:inline-block;
    font-size:12px;
    font-weight:700;
    letter-spacing:2px;
    text-transform:uppercase;
    color:var(--ltc-primary);
    margin-bottom:14px;
    padding:6px 14px;
    border:1px solid currentColor;
    border-radius:999px;
    background:rgba(22,121,190,0.04);
}

.ltc-lc__heading{
    font-size:clamp(22px, 2.6vw, 30px);
    font-weight:700;
    letter-spacing:-0.02em;
    margin:0 0 12px;
    color:#0f0f10;
    line-height:1.2;
}

.ltc-lc__sub{
    font-size:15.5px;
    color:#5a5a60;
    line-height:1.7;
    margin:0;
    max-width:600px;
}
.ltc-lc--align-center .ltc-lc__sub{margin:0 auto;}
.ltc-lc--align-right .ltc-lc__sub{margin:0 0 0 auto;}

/* ──────────────── LOGO COMMUN ──────────────── */
.ltc-lc__logo{
    display:flex;
    align-items:center;
    justify-content:center;
    flex-shrink:0;
    transition:all .5s cubic-bezier(.25,.8,.25,1);
    text-decoration:none;
}
.ltc-lc__logo img{
    height:60px;
    max-width:200px;
    width:auto;
    display:block;
    transition:all .5s cubic-bezier(.25,.8,.25,1);
}

/* Mode gris au repos */
.ltc-lc--gray .ltc-lc__logo img{
    filter:grayscale(100%);
}
.ltc-lc--gray .ltc-lc__logo:hover img{
    filter:grayscale(0%);
    opacity:1 !important;
}

/* Mode hover : opacité à 1 même si pas en gris */
.ltc-lc:not(.ltc-lc--gray) .ltc-lc__logo:hover img{
    opacity:1 !important;
}

/* Effets hover */
.ltc-lc--hover-lift .ltc-lc__logo:hover{transform:translateY(-4px);}
.ltc-lc--hover-scale .ltc-lc__logo:hover{transform:scale(1.10);}
.ltc-lc--hover-tilt .ltc-lc__logo:hover{transform:rotate(-3deg) scale(1.05);}
.ltc-lc--hover-glow .ltc-lc__logo:hover{
    filter:drop-shadow(0 6px 16px rgba(22,121,190,0.30));
}


/* ╔══════════════════════════════════════════════════════════╗
   ║ LAYOUT 1 — MARQUEE (défilement infini)                   ║
   ╚══════════════════════════════════════════════════════════╝ */
.ltc-lc--marquee .ltc-lc__row{
    position:relative;
    overflow:hidden;
    margin-bottom:24px;
}
.ltc-lc--marquee .ltc-lc__row:last-child{margin-bottom:0;}

/* Masque de fondu sur les bords */
.ltc-lc:not(.ltc-lc--no-fade) .ltc-lc__row::before,
.ltc-lc:not(.ltc-lc--no-fade) .ltc-lc__row::after{
    content:'';
    position:absolute;
    top:0; bottom:0;
    width:120px;
    z-index:2;
    pointer-events:none;
}
.ltc-lc:not(.ltc-lc--no-fade) .ltc-lc__row::before{
    left:0;
    background:linear-gradient(90deg, var(--ltc-bg) 0%, transparent 100%);
}
.ltc-lc:not(.ltc-lc--no-fade) .ltc-lc__row::after{
    right:0;
    background:linear-gradient(-90deg, var(--ltc-bg) 0%, transparent 100%);
}

.ltc-lc__mask{overflow:hidden;}
.ltc-lc__track{
    display:flex;
    align-items:center;
    animation:ltcLcScroll 30s linear infinite;
    width:max-content;
}
.ltc-lc--pause .ltc-lc__track:hover{animation-play-state:paused;}

@keyframes ltcLcScroll{
    from{transform:translateX(0);}
    to{transform:translateX(-50%);}
}

.ltc-lc--marquee .ltc-lc__logo{padding:0 56px;}


/* ╔══════════════════════════════════════════════════════════╗
   ║ LAYOUT 2 — GRID (grille statique sans animation)         ║
   ╚══════════════════════════════════════════════════════════╝ */
.ltc-lc--grid .ltc-lc__grid{
    display:grid;
    grid-template-columns:repeat(5, 1fr);
    gap:32px 24px;
    align-items:center;
    max-width:1200px;
    margin:0 auto;
}
.ltc-lc--grid .ltc-lc__logo{
    padding:16px;
    justify-content:center;
}


/* ╔══════════════════════════════════════════════════════════╗
   ║ LAYOUT 3 — CARDS (grille en cartes avec ombre)           ║
   ╚══════════════════════════════════════════════════════════╝ */
.ltc-lc--cards .ltc-lc__grid{
    display:grid;
    grid-template-columns:repeat(5, 1fr);
    gap:18px;
    max-width:1200px;
    margin:0 auto;
}
.ltc-lc--cards .ltc-lc__logo{
    background:#ffffff;
    border:1px solid rgba(15,15,16,0.08);
    border-radius:14px;
    padding:24px 16px;
    min-height:120px;
    box-shadow:0 1px 3px rgba(0,0,0,0.03), 0 4px 12px rgba(0,0,0,0.03);
}
.ltc-lc--cards .ltc-lc__logo:hover{
    border-color:rgba(22,121,190,0.20);
    box-shadow:0 8px 20px rgba(22,121,190,0.10), 0 16px 32px rgba(0,0,0,0.04);
}


/* ╔══════════════════════════════════════════════════════════╗
   ║ LAYOUT 4 — SEPARATED (défilement avec séparateurs)       ║
   ╚══════════════════════════════════════════════════════════╝ */
.ltc-lc--separated .ltc-lc__row{
    position:relative;
    overflow:hidden;
    margin-bottom:24px;
}
.ltc-lc--separated .ltc-lc__row:last-child{margin-bottom:0;}

.ltc-lc--separated .ltc-lc__logo{
    padding:0 40px;
    position:relative;
}
.ltc-lc--separated .ltc-lc__logo::after{
    content:'';
    position:absolute;
    right:0; top:25%; bottom:25%;
    width:1px;
    background:linear-gradient(180deg, transparent 0%, rgba(15,15,16,0.20) 50%, transparent 100%);
}

/* Fade aux bords (idem marquee) */
.ltc-lc--separated:not(.ltc-lc--no-fade) .ltc-lc__row::before,
.ltc-lc--separated:not(.ltc-lc--no-fade) .ltc-lc__row::after{
    content:'';
    position:absolute;
    top:0; bottom:0;
    width:120px;
    z-index:2;
    pointer-events:none;
}
.ltc-lc--separated:not(.ltc-lc--no-fade) .ltc-lc__row::before{
    left:0;
    background:linear-gradient(90deg, var(--ltc-bg) 0%, transparent 100%);
}
.ltc-lc--separated:not(.ltc-lc--no-fade) .ltc-lc__row::after{
    right:0;
    background:linear-gradient(-90deg, var(--ltc-bg) 0%, transparent 100%);
}


/* ╔══════════════════════════════════════════════════════════╗
   ║ LAYOUT 5 — BADGE (logos en pilules compactes)            ║
   ╚══════════════════════════════════════════════════════════╝ */
.ltc-lc--badge .ltc-lc__row{
    position:relative;
    overflow:hidden;
}

.ltc-lc--badge .ltc-lc__logo{
    background:#ffffff;
    border:1px solid rgba(15,15,16,0.10);
    border-radius:999px;
    padding:14px 28px !important;
    margin:0 8px;
    box-shadow:0 2px 8px rgba(0,0,0,0.04);
}
.ltc-lc--badge .ltc-lc__logo img{
    height:32px !important;
    max-width:120px !important;
}
.ltc-lc--badge .ltc-lc__logo:hover{
    border-color:var(--ltc-primary);
    box-shadow:0 8px 20px rgba(22,121,190,0.18);
}

/* Fade pour badge */
.ltc-lc--badge:not(.ltc-lc--no-fade) .ltc-lc__row::before,
.ltc-lc--badge:not(.ltc-lc--no-fade) .ltc-lc__row::after{
    content:'';
    position:absolute;
    top:0; bottom:0;
    width:80px;
    z-index:2;
    pointer-events:none;
}
.ltc-lc--badge:not(.ltc-lc--no-fade) .ltc-lc__row::before{
    left:0;
    background:linear-gradient(90deg, var(--ltc-bg) 0%, transparent 100%);
}
.ltc-lc--badge:not(.ltc-lc--no-fade) .ltc-lc__row::after{
    right:0;
    background:linear-gradient(-90deg, var(--ltc-bg) 0%, transparent 100%);
}


/* ╔══════════════════════════════════════════════════════════╗
   ║ RESPONSIVE                                                ║
   ╚══════════════════════════════════════════════════════════╝ */
@media(max-width:1024px){
    .ltc-lc--grid .ltc-lc__grid,
    .ltc-lc--cards .ltc-lc__grid{
        grid-template-columns:repeat(3, 1fr) !important;
    }
}
@media(max-width:768px){
    .ltc-lc{padding:48px 16px;}
    .ltc-lc__header{margin-bottom:28px;}
    .ltc-lc--marquee .ltc-lc__logo,
    .ltc-lc--separated .ltc-lc__logo{padding:0 32px !important;}
    .ltc-lc--separated .ltc-lc__logo::after{right:0;}
    .ltc-lc__logo img{height:44px;}
    .ltc-lc:not(.ltc-lc--no-fade) .ltc-lc__row::before,
    .ltc-lc:not(.ltc-lc--no-fade) .ltc-lc__row::after{width:60px;}
    .ltc-lc--cards .ltc-lc__logo{padding:18px 12px; min-height:100px;}
}
@media(max-width:480px){
    .ltc-lc--grid .ltc-lc__grid,
    .ltc-lc--cards .ltc-lc__grid{
        grid-template-columns:repeat(2, 1fr) !important;
        gap:14px;
    }
    .ltc-lc__logo img{height:36px;}
    .ltc-lc--badge .ltc-lc__logo{padding:10px 18px !important;}
    .ltc-lc--badge .ltc-lc__logo img{height:24px !important;}
}
