/* ================================================================
   IBIG MARKET — FX LIBRARY v2.0
   Orbes flottants · Grille animée · Particules · Glows · Compteurs
   ================================================================ */

/* ─── ORBES FLOTTANTS ─── */
.ib-orb {
  position: absolute;
  border-radius: 50%;
  pointer-events: none;
  will-change: transform;
  filter: blur(1px);
}
.ib-orb-1 { animation: ibOrb1 12s ease-in-out infinite; }
.ib-orb-2 { animation: ibOrb2 16s ease-in-out infinite 2s; }
.ib-orb-3 { animation: ibOrb3 20s ease-in-out infinite 5s; }
.ib-orb-4 { animation: ibOrb1 9s ease-in-out infinite 1s; }

@keyframes ibOrb1 {
  0%,100% { transform: translate(0,0) scale(1); }
  33%     { transform: translate(40px,-35px) scale(1.08); }
  66%     { transform: translate(-25px,45px) scale(0.93); }
}
@keyframes ibOrb2 {
  0%,100% { transform: translate(0,0) scale(1); }
  40%     { transform: translate(-50px,30px) scale(1.12); }
  70%     { transform: translate(35px,-40px) scale(0.9); }
}
@keyframes ibOrb3 {
  0%,100% { transform: translate(0,0) scale(1); }
  25%     { transform: translate(30px,50px) scale(1.06); }
  75%     { transform: translate(-40px,-20px) scale(0.95); }
}

/* ─── GRILLE ANIMÉE ─── */
.ib-grid-overlay {
  position: absolute; inset: 0; pointer-events: none;
  background-image:
    linear-gradient(rgba(255,255,255,.035) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255,255,255,.035) 1px, transparent 1px);
  background-size: 48px 48px;
  animation: ibGridPulse 8s ease-in-out infinite;
}
@keyframes ibGridPulse {
  0%,100% { opacity: 1; }
  50%     { opacity: 0.5; }
}

/* ─── LIGNE DE SCAN ─── */
.ib-scanline {
  position: absolute; inset: 0; pointer-events: none; overflow: hidden;
}
.ib-scanline::after {
  content: '';
  position: absolute; left: 0; right: 0; height: 2px;
  background: linear-gradient(90deg, transparent 0%, rgba(240,68,14,.4) 20%, rgba(240,68,14,.8) 50%, rgba(240,68,14,.4) 80%, transparent 100%);
  animation: ibScan 6s linear infinite;
  box-shadow: 0 0 20px rgba(240,68,14,.5);
}
@keyframes ibScan {
  0%   { top: -2px; opacity: 0; }
  5%   { opacity: 1; }
  95%  { opacity: 1; }
  100% { top: 100%; opacity: 0; }
}

/* ─── POINTS / PARTICULES CSS ─── */
.ib-dots {
  position: absolute; inset: 0; pointer-events: none;
  background-image: radial-gradient(rgba(255,255,255,.12) 1px, transparent 1px);
  background-size: 24px 24px;
  animation: ibDotsFade 5s ease-in-out infinite;
}
@keyframes ibDotsFade {
  0%,100% { opacity: .6; }
  50%     { opacity: 1; }
}

/* ─── GRADIENT MESH DYNAMIQUE ─── */
.ib-mesh-bg {
  background:
    radial-gradient(ellipse 80% 60% at 20% 40%, rgba(240,68,14,.18) 0%, transparent 55%),
    radial-gradient(ellipse 60% 50% at 80% 65%, rgba(37,99,235,.10) 0%, transparent 50%),
    radial-gradient(ellipse 50% 40% at 50% 100%, rgba(255,170,0,.08) 0%, transparent 50%),
    #09090B;
  animation: ibMeshShift 15s ease-in-out infinite;
}
@keyframes ibMeshShift {
  0%,100% { background-position: 0 0, 100% 100%, 50% 100%; }
  50%     { background-position: 10% 10%, 90% 90%, 55% 95%; }
}

/* ─── FLOAT (éléments décoratifs) ─── */
.ib-float   { animation: ibFloat 4s ease-in-out infinite; }
.ib-float-2 { animation: ibFloat 5.5s ease-in-out infinite 1.2s; }
.ib-float-3 { animation: ibFloat 7s ease-in-out infinite 2.4s; }
@keyframes ibFloat {
  0%,100% { transform: translateY(0); }
  50%     { transform: translateY(-14px); }
}

/* ─── CHIPS FLOTTANTS ─── */
.ib-hero-chip {
  display: inline-flex; align-items: center; gap: 6px;
  background: rgba(255,255,255,.06);
  border: 1px solid rgba(255,255,255,.12);
  border-radius: 30px;
  padding: 6px 14px; font-size: 12px; font-weight: 700; color: #E4E4E7;
  backdrop-filter: blur(8px);
}
.ib-hero-chip.orange {
  background: rgba(240,68,14,.12);
  border-color: rgba(240,68,14,.3);
  color: #FF7A50;
}
.ib-hero-chip.gold {
  background: rgba(255,170,0,.12);
  border-color: rgba(255,170,0,.3);
  color: #FFAA00;
}
.ib-chips-row { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 20px; }

/* ─── BADGE ANIMÉ ─── */
.ib-live-badge {
  display: inline-flex; align-items: center; gap: 6px;
  font-size: 11px; font-weight: 700; letter-spacing: .08em; color: #6EE7B7;
}
.ib-live-dot {
  width: 7px; height: 7px; border-radius: 50%;
  background: #10B981;
  animation: ibLivePulse 1.5s ease-in-out infinite;
  box-shadow: 0 0 0 0 rgba(16,185,129,.5);
}
@keyframes ibLivePulse {
  0%,100% { box-shadow: 0 0 0 0 rgba(16,185,129,.5); }
  50%     { box-shadow: 0 0 0 6px rgba(16,185,129,0); }
}

/* ─── GLOW SUR CARTES ─── */
.ib-glow-card {
  position: relative;
  transition: transform .25s, box-shadow .25s;
}
.ib-glow-card::before {
  content: '';
  position: absolute; inset: -1px;
  border-radius: inherit;
  background: linear-gradient(135deg, rgba(240,68,14,.5), rgba(255,107,53,.3), transparent, rgba(255,170,0,.3));
  opacity: 0; transition: opacity .3s;
  z-index: -1;
}
.ib-glow-card:hover::before { opacity: 1; }
.ib-glow-card:hover { transform: translateY(-4px); box-shadow: 0 20px 50px rgba(240,68,14,.2); }

/* ─── BORDURE ANIMÉE ─── */
.ib-border-anim {
  position: relative;
}
.ib-border-anim::after {
  content: '';
  position: absolute; inset: 0;
  border-radius: inherit;
  background: conic-gradient(from 0deg, transparent 0%, rgba(240,68,14,.6) 20%, transparent 40%);
  animation: ibBorderSpin 4s linear infinite;
  -webkit-mask:
    linear-gradient(#fff 0 0) content-box,
    linear-gradient(#fff 0 0);
  -webkit-mask-composite: xor;
  mask-composite: exclude;
  padding: 1px;
  pointer-events: none;
}
@keyframes ibBorderSpin { to { transform: rotate(360deg); } }

/* ─── COMPTEUR ANIMÉ (JS-powered) ─── */
.ib-counter-wrap { overflow: hidden; }
.ib-counter-num {
  display: inline-block;
  animation: ibCountIn .8s cubic-bezier(.22,.68,0,1.2) both;
}
@keyframes ibCountIn {
  from { opacity: 0; transform: translateY(20px) scale(.9); }
  to   { opacity: 1; transform: none; }
}

/* ─── SHIMMER (carte skeleton) ─── */
.ib-shimmer {
  background: linear-gradient(90deg, transparent 0%, rgba(255,255,255,.05) 50%, transparent 100%);
  background-size: 200% 100%;
  animation: ibShimmer 2.5s linear infinite;
}
@keyframes ibShimmer {
  0%   { background-position: -200% 0; }
  100% { background-position:  200% 0; }
}

/* ─── TEXTE GLOW ─── */
.ib-text-glow {
  text-shadow: 0 0 30px rgba(240,68,14,.5), 0 0 70px rgba(240,68,14,.25);
}
.ib-text-glow-gold {
  text-shadow: 0 0 30px rgba(255,170,0,.5), 0 0 70px rgba(255,170,0,.25);
}

/* ─── LIGNE DE SÉPARATION GRADIENT ─── */
.ib-divider {
  height: 1px;
  background: linear-gradient(90deg, transparent, rgba(240,68,14,.4) 30%, rgba(240,68,14,.4) 70%, transparent);
  border: none; margin: 0;
}

/* ─── STATS DARK BAND ─── */
.ib-stats-dark {
  background: #18181B;
  border-top: 1px solid rgba(255,255,255,.06);
  border-bottom: 1px solid rgba(255,255,255,.06);
}
.ib-stats-dark .ibStatValue { color: #fff; }
.ib-stats-dark .ibStatItem {
  background: transparent;
  border-right: 1px solid rgba(255,255,255,.06);
}
.ib-stats-dark .ibStatItem:last-child { border-right: none; }
.ib-stats-dark .ibStatLabel { color: #71717A; }

/* ─── HERO DARK GLASS ─── */
.ib-hero-glass {
  background: rgba(9,9,11,.7);
  backdrop-filter: blur(20px);
  border: 1px solid rgba(255,255,255,.08);
}

/* ─── SECTION LABEL ─── */
.ib-section-label {
  display: inline-flex; align-items: center; gap: 8px;
  font-size: 11px; font-weight: 700; letter-spacing: .12em;
  text-transform: uppercase; color: #F0440E;
  margin-bottom: 12px;
}
.ib-section-label::before {
  content: ''; display: block;
  width: 20px; height: 2px;
  background: #F0440E;
}

/* ─── MASQUER WIDGET CHAT TIERS (WE ARE HERE / Crisp / Tawk) ─── */
#crisp-chatbox,
.crisp-client,
[id^="crisp-"],
[class*="crisp-"],
#tawk-bubble-container,
.tawk-min-container,
.tawk-button,
[id^="tawk-"],
[class*="tawk-"],
.fc-widget-small,
.fc-widget-open,
[id^="freshchat-"],
[class*="freshchat-"],
#hubspot-messages-iframe-container,
.leadbot-frame,
.intercom-lightweight-app,
[id^="intercom-"],
iframe[src*="tawk.to"],
iframe[src*="crisp.chat"],
iframe[src*="freshdesk"],
iframe[src*="hubspot"],
.we-are-here,
[class*="we-are-here"],
#chat-bubble,
[id^="chat-bubble"] {
  display: none !important;
  visibility: hidden !important;
  opacity: 0 !important;
  pointer-events: none !important;
}

/* ─── AFRICA SILHOUETTE DÉCO ─── */
.ib-africa-deco {
  position: absolute; pointer-events: none;
  opacity: .04;
  right: -40px; bottom: -20px;
  width: 280px; height: 320px;
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 200 240'%3E%3Cpath fill='white' d='M100 5 C80 5 60 15 50 30 C35 50 30 70 25 90 C20 110 15 130 20 150 C25 170 35 185 45 200 C55 215 70 225 85 230 C95 235 105 235 115 230 C130 225 145 215 155 200 C165 185 175 170 180 150 C185 130 180 110 175 90 C170 70 165 50 150 30 C140 15 120 5 100 5 Z'/%3E%3C/svg%3E") no-repeat center/contain;
}