/* ╔═══════════════════════════════════════════════════════════╗
   ║ LTC STATS COUNTER — 6 layouts modernes                    ║
   ║ cards / panel_dark / circles / minimal / gradient / big-numbers ║
   ╚═══════════════════════════════════════════════════════════╝ */

.ltc-stat{
    --ltc-primary:#1679BE;
    --ltc-secondary:#000000;
    --ltc-dark:#0f0f10;
    --ltc-light:#fafafa;
    --ltc-text:#0f0f10;
    --ltc-text-soft:#5a5a60;
    --ltc-icon-wrap-size:72px;
    box-sizing:border-box;
    max-width:100%;
    position:relative;
}

/* ──────────────── EN-TÊTE ──────────────── */
.ltc-stat__header{
    margin-bottom:48px;
    text-align:center;
}
.ltc-stat--align-left .ltc-stat__header{text-align:left;}
.ltc-stat--align-right .ltc-stat__header{text-align:right;}

.ltc-stat__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-stat__heading{
    font-size:clamp(1.8rem, 3.4vw, 2.6rem);
    font-weight:700;
    color:var(--ltc-text);
    margin:0 0 16px;
    letter-spacing:-0.02em;
    line-height:1.2;
}
.ltc-stat__sub{
    font-size:16px;
    color:var(--ltc-text-soft);
    max-width:600px;
    margin:0 auto;
    line-height:1.7;
}
.ltc-stat--align-left .ltc-stat__sub{margin:0;}
.ltc-stat--align-right .ltc-stat__sub{margin:0 0 0 auto;}

/* ──────────────── GRILLE ──────────────── */
.ltc-stat__grid{
    display:grid;
    grid-template-columns:repeat(4, minmax(0, 1fr));
    gap:20px;
    position:relative;
    z-index:1;
}

/* ──────────────── ITEM COMMUN ──────────────── */
.ltc-stat__item{
    text-align:center;
    padding:32px 20px;
    border-radius:14px;
    transition:all .55s cubic-bezier(.25,.8,.25,1);
    position:relative;
    overflow:hidden;
    box-sizing:border-box;
    min-width:0;
}

/* Animation à l'apparition */
.ltc-stat--animate .ltc-stat__item{
    opacity:0;
    transform:translateY(24px);
    animation:ltcStatFadeUp .8s cubic-bezier(.25,.8,.25,1) forwards;
    animation-delay:var(--ltc-d, 0ms);
}
@keyframes ltcStatFadeUp{
    to{opacity:1; transform:translateY(0);}
}

/* ──────────────── ICÔNE (formes) ──────────────── */
.ltc-stat__icon-wrap{
    width:var(--ltc-icon-wrap-size);
    height:var(--ltc-icon-wrap-size);
    display:flex;
    align-items:center;
    justify-content:center;
    margin:0 auto 24px;
    transition:all .55s cubic-bezier(.25,.8,.25,1);
    flex-shrink:0;
}

.ltc-stat--icon-circle .ltc-stat__icon-wrap{border-radius:50%;}
.ltc-stat--icon-rounded .ltc-stat__icon-wrap{border-radius:16px;}
.ltc-stat--icon-square .ltc-stat__icon-wrap{border-radius:4px;}
.ltc-stat--icon-hexagon .ltc-stat__icon-wrap{
    clip-path:polygon(25% 0%, 75% 0%, 100% 50%, 75% 100%, 25% 100%, 0% 50%);
}

/* Icône bare (sans wrap) */
.ltc-stat__icon--bare{
    display:block;
    margin:0 auto 20px;
    color:var(--ltc-primary);
    font-size:42px;
}

/* Remplissages */
.ltc-stat--icon-fill-gradient .ltc-stat__icon-wrap{
    background:linear-gradient(135deg, var(--ltc-primary) 0%, var(--ltc-secondary) 100%);
    background-size:200% 200%;
    animation:ltcStatGradientShift 6s ease infinite;
    box-shadow:0 8px 24px rgba(22,121,190,0.32);
}
@keyframes ltcStatGradientShift{
    0%,100%{background-position:0% 50%;}
    50%{background-position:100% 50%;}
}
.ltc-stat--icon-fill-solid .ltc-stat__icon-wrap{
    background:var(--ltc-primary);
    box-shadow:0 8px 24px rgba(22,121,190,0.30);
}
.ltc-stat--icon-fill-dark .ltc-stat__icon-wrap{
    background:var(--ltc-dark);
    box-shadow:0 8px 24px rgba(0,0,0,0.18);
}
.ltc-stat--icon-fill-light .ltc-stat__icon-wrap{
    background:#fff;
    border:2px solid var(--ltc-primary);
    box-shadow:0 6px 16px rgba(22,121,190,0.10);
}
.ltc-stat--icon-fill-light .ltc-stat__icon{color:var(--ltc-primary) !important;}

.ltc-stat--icon-fill-soft .ltc-stat__icon-wrap{
    background:rgba(22,121,190,0.10);
}
.ltc-stat--icon-fill-soft .ltc-stat__icon{color:var(--ltc-primary) !important;}

/* Effets hover icône */
.ltc-stat--icon-hover-rotate .ltc-stat__item:hover .ltc-stat__icon-wrap{transform:rotate(-8deg) scale(1.06);}
.ltc-stat--icon-hover-scale .ltc-stat__item:hover .ltc-stat__icon-wrap{transform:scale(1.12);}
.ltc-stat--icon-hover-pulse .ltc-stat__item:hover .ltc-stat__icon-wrap{
    animation:ltcStatPulse 1s ease-in-out infinite;
}
@keyframes ltcStatPulse{
    0%,100%{transform:scale(1);}
    50%{transform:scale(1.10);}
}
.ltc-stat--icon-hover-shake .ltc-stat__item:hover .ltc-stat__icon-wrap{
    animation:ltcStatShake .6s ease-in-out;
}
@keyframes ltcStatShake{
    0%,100%{transform:translateX(0);}
    20%{transform:translateX(-4px) rotate(-3deg);}
    40%{transform:translateX(4px) rotate(3deg);}
    60%{transform:translateX(-3px) rotate(-2deg);}
    80%{transform:translateX(3px) rotate(2deg);}
}

.ltc-stat__icon{
    color:#fff;
    transition:transform .4s;
}

/* ──────────────── NOMBRE ──────────────── */
.ltc-stat__number{
    font-size:54px;
    font-weight:800;
    line-height:1;
    margin:0 0 12px;
    color:var(--ltc-text);
    letter-spacing:-0.03em;
    word-break:break-word;
}

/* Nombre en dégradé (texte clipped) */
.ltc-stat--num-gradient .ltc-stat__number{
    background:linear-gradient(135deg, var(--ltc-primary) 0%, var(--ltc-secondary) 100%);
    background-size:200% 200%;
    -webkit-background-clip:text;
    background-clip:text;
    -webkit-text-fill-color:transparent;
    color:transparent;
    animation:ltcStatGradientShift 6s ease infinite;
}

/* ──────────────── LABEL ──────────────── */
.ltc-stat__label{
    font-size:13px;
    color:var(--ltc-text-soft);
    line-height:1.5;
    font-weight:600;
    letter-spacing:1.2px;
    text-transform:uppercase;
    word-wrap:break-word;
    overflow-wrap:break-word;
}

/* ──────────────── DESCRIPTION ──────────────── */
.ltc-stat__desc{
    font-size:13px;
    color:var(--ltc-text-soft);
    line-height:1.6;
    margin-top:8px;
    font-weight:400;
    opacity:0.85;
}
.ltc-stat--no-desc .ltc-stat__desc{display:none;}


/* ╔══════════════════════════════════════════════════════════╗
   ║ LAYOUT 1 — CARDS (cartes blanches modernes)              ║
   ╚══════════════════════════════════════════════════════════╝ */
.ltc-stat--cards .ltc-stat__item{
    background:#fff;
    border:1px solid rgba(15,15,16,0.08);
    box-shadow:0 1px 3px rgba(0,0,0,0.03), 0 8px 24px rgba(0,0,0,0.04);
    overflow:hidden;
}

/* Trait d'accent en haut, révélé au hover */
.ltc-stat--cards .ltc-stat__item::before{
    content:'';
    position:absolute;
    top:0; left:0; right:0;
    height:3px;
    background:linear-gradient(90deg, var(--ltc-primary), var(--ltc-secondary));
    transform:scaleX(0);
    transform-origin:left;
    transition:transform .55s cubic-bezier(.25,.8,.25,1);
}

.ltc-stat--cards .ltc-stat__item:hover{
    transform:translateY(-6px);
    border-color:rgba(22,121,190,0.10);
    box-shadow:0 12px 32px rgba(0,0,0,0.06), 0 24px 56px rgba(22,121,190,0.10);
}
.ltc-stat--cards .ltc-stat__item:hover::before{transform:scaleX(1);}

.ltc-stat--cards .ltc-stat__item--highlight{
    background:linear-gradient(135deg, var(--ltc-dark) 0%, #2a2a2e 100%);
    border-color:transparent;
    box-shadow:0 12px 32px rgba(0,0,0,0.16), 0 24px 56px rgba(22,121,190,0.20);
}
.ltc-stat--cards .ltc-stat__item--highlight::before{transform:scaleX(1);}
.ltc-stat--cards .ltc-stat__item--highlight .ltc-stat__number,
.ltc-stat--cards .ltc-stat__item--highlight .ltc-stat__label,
.ltc-stat--cards .ltc-stat__item--highlight .ltc-stat__desc{color:#fff !important;}


/* ╔══════════════════════════════════════════════════════════╗
   ║ LAYOUT 2 — PANEL DARK (panneau global sombre)            ║
   ╚══════════════════════════════════════════════════════════╝ */
.ltc-stat--panel-dark{
    background:linear-gradient(135deg, var(--ltc-dark) 0%, #2a2a2e 60%, #3a3a3e 100%);
    border-radius:16px;
    padding:56px;
    box-shadow:0 4px 24px rgba(0,0,0,0.08), 0 16px 48px rgba(0,0,0,0.04);
    overflow:hidden;
}

/* Halos animés */
.ltc-stat--panel-dark.ltc-stat--with-halos::before{
    content:'';
    position:absolute;
    top:-160px; right:-160px;
    width:420px; height:420px;
    border-radius:50%;
    background:radial-gradient(circle, rgba(22,121,190,0.20) 0%, transparent 65%);
    z-index:0;
    animation:ltcStatHaloFloat 14s ease-in-out infinite;
}
.ltc-stat--panel-dark.ltc-stat--with-halos::after{
    content:'';
    position:absolute;
    bottom:-140px; left:-140px;
    width:340px; height:340px;
    border-radius:50%;
    background:radial-gradient(circle, rgba(0,0,0,0.30) 0%, transparent 70%);
    z-index:0;
    animation:ltcStatHaloFloat 16s ease-in-out infinite reverse;
}
@keyframes ltcStatHaloFloat{
    0%,100%{transform:translate(0,0) scale(1);}
    50%{transform:translate(-20px,20px) scale(1.05);}
}

.ltc-stat--panel-dark .ltc-stat__item{
    background:rgba(255,255,255,0.04);
    border:1px solid rgba(255,255,255,0.10);
    backdrop-filter:blur(12px);
    -webkit-backdrop-filter:blur(12px);
}

.ltc-stat--panel-dark .ltc-stat__item::before{
    content:'';
    position:absolute;
    top:0;left:-100%;
    width:100%;height:100%;
    background:linear-gradient(90deg, transparent 0%, rgba(255,255,255,0.06) 50%, transparent 100%);
    transition:left .8s cubic-bezier(.25,.8,.25,1);
    pointer-events:none;
}
.ltc-stat--panel-dark .ltc-stat__item:hover{
    transform:translateY(-6px);
    background:rgba(255,255,255,0.07);
    border-color:rgba(22,121,190,0.45);
    box-shadow:0 12px 32px rgba(0,0,0,0.18), 0 20px 48px rgba(22,121,190,0.18);
}
.ltc-stat--panel-dark .ltc-stat__item:hover::before{left:100%;}

.ltc-stat--panel-dark .ltc-stat__number{
    background:linear-gradient(135deg, #fff 0%, rgba(255,255,255,0.85) 100%);
    -webkit-background-clip:text;
    background-clip:text;
    -webkit-text-fill-color:transparent;
    color:transparent;
}
.ltc-stat--panel-dark .ltc-stat__label{color:rgba(255,255,255,0.88);}
.ltc-stat--panel-dark .ltc-stat__desc{color:rgba(255,255,255,0.65);}


/* ╔══════════════════════════════════════════════════════════╗
   ║ LAYOUT 3 — CIRCLES (stat dans un grand cercle)           ║
   ╚══════════════════════════════════════════════════════════╝ */
.ltc-stat--circles .ltc-stat__item{
    aspect-ratio:1 / 1;
    border-radius:50%;
    background:linear-gradient(135deg, var(--ltc-primary) 0%, var(--ltc-secondary) 100%);
    background-size:200% 200%;
    color:#fff;
    display:flex;
    flex-direction:column;
    align-items:center;
    justify-content:center;
    padding:24px 18px;
    box-shadow:0 12px 32px rgba(22,121,190,0.30);
    animation:ltcStatGradientShift 8s ease infinite;
    overflow:hidden;
}

.ltc-stat--circles .ltc-stat__item::before{
    content:'';
    position:absolute;
    top:-30%; right:-30%;
    width:80%; height:80%;
    border-radius:50%;
    background:radial-gradient(circle, rgba(255,255,255,0.18) 0%, transparent 70%);
    pointer-events:none;
}

.ltc-stat--circles .ltc-stat__item:hover{
    transform:scale(1.05);
    box-shadow:0 16px 40px rgba(22,121,190,0.45);
}

.ltc-stat--circles .ltc-stat__icon-wrap{
    background:rgba(255,255,255,0.20) !important;
    backdrop-filter:blur(10px);
    border:1px solid rgba(255,255,255,0.25);
    box-shadow:none !important;
    margin-bottom:14px;
}
.ltc-stat--circles .ltc-stat__number{color:#fff !important; -webkit-text-fill-color:#fff !important; background:none !important;}
.ltc-stat--circles .ltc-stat__label{color:rgba(255,255,255,0.92);}
.ltc-stat--circles .ltc-stat__desc{color:rgba(255,255,255,0.78); font-size:11.5px;}


/* ╔══════════════════════════════════════════════════════════╗
   ║ LAYOUT 4 — MINIMAL (épuré, juste typo)                   ║
   ╚══════════════════════════════════════════════════════════╝ */
.ltc-stat--minimal .ltc-stat__item{
    padding:24px 16px;
    background:none;
    border:none;
    box-shadow:none;
}

.ltc-stat--minimal .ltc-stat__icon-wrap{
    background:none !important;
    box-shadow:none !important;
    border:none !important;
    margin-bottom:14px;
    width:auto;
    height:auto;
}
.ltc-stat--minimal .ltc-stat__icon{color:var(--ltc-primary) !important; font-size:36px;}

.ltc-stat--minimal .ltc-stat__number{
    font-size:64px;
    background:linear-gradient(135deg, var(--ltc-primary), var(--ltc-secondary));
    -webkit-background-clip:text;
    background-clip:text;
    -webkit-text-fill-color:transparent;
    color:transparent;
}

/* Séparateurs verticaux entre items (option) */
.ltc-stat--minimal.ltc-stat--with-separator .ltc-stat__item:not(:last-child)::after{
    content:'';
    position:absolute;
    top:25%; right:0; bottom:25%;
    width:1px;
    background:linear-gradient(180deg, transparent 0%, rgba(15,15,16,0.15) 50%, transparent 100%);
}
@media(max-width:768px){
    .ltc-stat--minimal.ltc-stat--with-separator .ltc-stat__item::after{display:none;}
}

.ltc-stat--minimal .ltc-stat__item:hover .ltc-stat__number{
    transform:scale(1.05);
    transition:transform .4s;
}


/* ╔══════════════════════════════════════════════════════════╗
   ║ LAYOUT 5 — GRADIENT (cartes colorées rouge → gris)       ║
   ╚══════════════════════════════════════════════════════════╝ */
.ltc-stat--gradient .ltc-stat__item{
    background:linear-gradient(135deg, var(--ltc-primary) 0%, var(--ltc-secondary) 100%);
    background-size:200% 200%;
    color:#fff;
    box-shadow:0 10px 28px rgba(22,121,190,0.22);
    animation:ltcStatGradientShift 8s ease infinite;
}

/* Variations entre items */
.ltc-stat--gradient .ltc-stat__item:nth-child(2n){animation-delay:-2s;}
.ltc-stat--gradient .ltc-stat__item:nth-child(3n){animation-delay:-4s;}
.ltc-stat--gradient .ltc-stat__item:nth-child(4n){animation-delay:-6s;}

.ltc-stat--gradient .ltc-stat__item::before{
    content:'';
    position:absolute;
    top:-60px; right:-60px;
    width:160px; height:160px;
    border-radius:50%;
    background:radial-gradient(circle, rgba(255,255,255,0.18) 0%, transparent 70%);
    pointer-events:none;
}

.ltc-stat--gradient .ltc-stat__item:hover{
    transform:translateY(-6px);
    box-shadow:0 16px 40px rgba(22,121,190,0.32);
}

.ltc-stat--gradient .ltc-stat__icon-wrap{
    background:rgba(255,255,255,0.20) !important;
    backdrop-filter:blur(10px);
    border:1px solid rgba(255,255,255,0.25);
    box-shadow:none !important;
}

.ltc-stat--gradient .ltc-stat__number{color:#fff !important; -webkit-text-fill-color:#fff !important; background:none !important;}
.ltc-stat--gradient .ltc-stat__label{color:rgba(255,255,255,0.92);}
.ltc-stat--gradient .ltc-stat__desc{color:rgba(255,255,255,0.78);}


/* ╔══════════════════════════════════════════════════════════╗
   ║ LAYOUT 6 — BIG NUMBERS (numéros XXL audacieux)           ║
   ╚══════════════════════════════════════════════════════════╝ */
.ltc-stat--big-numbers .ltc-stat__item{
    background:none;
    border:none;
    box-shadow:none;
    text-align:left;
    padding:24px 0;
    border-bottom:1px solid rgba(15,15,16,0.08);
}
.ltc-stat--big-numbers .ltc-stat__icon-wrap{
    background:none !important;
    box-shadow:none !important;
    border:none !important;
    width:auto; height:auto;
    margin:0 0 12px;
    justify-content:flex-start;
}
.ltc-stat--big-numbers .ltc-stat__icon{color:var(--ltc-primary) !important; font-size:24px;}

.ltc-stat--big-numbers .ltc-stat__number{
    font-size:clamp(64px, 7vw, 110px);
    font-weight:900;
    line-height:0.9;
    letter-spacing:-0.05em;
    color:transparent;
    -webkit-text-stroke:2px var(--ltc-primary);
    margin-bottom:18px;
    transition:all .55s cubic-bezier(.25,.8,.25,1);
}

.ltc-stat--big-numbers .ltc-stat__item:hover .ltc-stat__number{
    color:var(--ltc-primary);
    -webkit-text-stroke:0;
}

.ltc-stat--big-numbers .ltc-stat__label{
    font-size:14px;
    text-align:left;
}
.ltc-stat--big-numbers .ltc-stat__desc{
    text-align:left;
}


/* ╔══════════════════════════════════════════════════════════╗
   ║ RESPONSIVE                                                ║
   ╚══════════════════════════════════════════════════════════╝ */
@media(max-width:1024px){
    .ltc-stat__grid{
        grid-template-columns:repeat(2, minmax(0, 1fr)) !important;
    }
    .ltc-stat--panel-dark{padding:36px 24px;}
}

@media(max-width:640px){
    .ltc-stat__grid{
        grid-template-columns:repeat(2, minmax(0, 1fr)) !important;
        gap:12px;
    }
    .ltc-stat__item{padding:20px 12px;}
    .ltc-stat--panel-dark{padding:24px 16px;}
    .ltc-stat__icon-wrap{margin-bottom:14px;}
    .ltc-stat__number{font-size:34px;}
    .ltc-stat__label{font-size:11px; letter-spacing:0.8px;}
    .ltc-stat__desc{font-size:12px;}

    /* Layout big-numbers : 1 col en mobile (pleine largeur pour gros chiffres) */
    .ltc-stat--big-numbers .ltc-stat__grid{grid-template-columns:1fr !important;}
    .ltc-stat--big-numbers .ltc-stat__number{font-size:64px; margin-bottom:12px;}

    /* Layout circles : conserver le ratio mais réduire */
    .ltc-stat--circles .ltc-stat__item{padding:18px 12px;}
    .ltc-stat--circles .ltc-stat__number{font-size:28px;}
    .ltc-stat--circles .ltc-stat__label{font-size:10px; letter-spacing:0.5px;}
    .ltc-stat--circles .ltc-stat__desc{display:none;}
}

@media(max-width:380px){
    .ltc-stat__grid{grid-template-columns:1fr !important;}
}