/* ===== Bandeau défilant + bannière animée Grande Agence ===== */
.ga-defile { --navy: #042761; --or: #F2A33A; background: var(--navy); color: #fff; overflow: hidden; white-space: nowrap;
  font-family: 'Manrope', system-ui, sans-serif; font-weight: 700; font-size: 14px; line-height: 1; border-radius: 14px 14px 0 0; }
.ga-defile .piste { display: inline-flex; animation: ga-defile 22s linear infinite; padding: 10px 0; }
.ga-defile .seg { display: inline-flex; align-items: center; gap: 8px; padding-right: 44px; }
.ga-defile .seg b { font-weight: 800; letter-spacing: .3px; }
.ga-defile .cert { width: 18px; height: 18px; flex: none; }
.ga-defile .point { width: 6px; height: 6px; border-radius: 50%; background: var(--or); margin: 0 4px; }
.ga-defile .code { color: #1B1300; background: linear-gradient(90deg, #FFC24B, #F2A33A, #FFC24B); background-size: 200% 100%;
  animation: ga-brille 3s linear infinite; padding: 5px 10px; border-radius: 8px; font-weight: 900; letter-spacing: 1.5px; }
@keyframes ga-defile { to { transform: translateX(-50%); } }
@keyframes ga-brille { to { background-position: -200% 0; } }

.ga-bann { --navy: #042761; --or: #F2A33A; --or-2: #E5762A; --p: calc(100cqw / 1280);
  container-type: inline-size; position: relative; width: 100%; aspect-ratio: 1280 / 533; overflow: hidden;
  background: linear-gradient(180deg, #F7F9FD, #EEF2FA);
  border-radius: 0 0 20px 20px; box-shadow: 0 10px 30px rgba(14,36,112,.12); isolation: isolate; }
.ga-bann * { box-sizing: border-box; }

/* Photo à droite, fondue progressivement dans le fond clair */
.ga-bann .photo { position: absolute; top: 0; bottom: 0; right: 0; left: calc(520 * var(--p)); overflow: hidden;
  -webkit-mask-image: linear-gradient(90deg, transparent 0, transparent 6%, rgba(0,0,0,.4) 24%, rgba(0,0,0,.85) 40%, #000 52%);
  mask-image: linear-gradient(90deg, transparent 0, transparent 6%, rgba(0,0,0,.4) 24%, rgba(0,0,0,.85) 40%, #000 52%); }
.ga-bann .photo img { position: absolute; height: 100%; width: auto; max-width: none; left: 0; top: 0;
  transform-origin: 100% 55%; animation: ga-zoom 16s ease-in-out infinite alternate; }
@keyframes ga-zoom { from { transform: scale(1); } to { transform: scale(1.07); } }

/* Partie blanche : logo sur les 2/3 du haut, 1XBET + DÉPÔT & RETRAIT sur le 1/3 du bas */
.ga-bann .contenu { position: absolute; left: 0; top: 0; bottom: 0; width: calc(600 * var(--p)); display: flex; flex-direction: column; }
.ga-bann .haut { flex: 2; display: flex; align-items: flex-end; justify-content: center; padding-bottom: calc(10 * var(--p)); }
.ga-bann .bas { flex: 1; display: flex; flex-direction: column; align-items: center; justify-content: flex-start; padding-top: calc(12 * var(--p)); }
.ga-bann .logo { position: relative; width: calc(470 * var(--p)); animation: ga-flotte 6s ease-in-out infinite; }
.ga-bann .logo img { width: 100%; height: auto; display: block; }
.ga-bann .logo::after { content: ""; position: absolute; inset: 0; pointer-events: none;
  background: linear-gradient(105deg, transparent 40%, rgba(255,255,255,.75) 50%, transparent 60%) no-repeat; background-size: 250% 100%;
  -webkit-mask: var(--ga-logo) center / contain no-repeat; mask: var(--ga-logo) center / contain no-repeat;
  animation: ga-reflet 5s ease-in-out infinite; }
@keyframes ga-flotte { 0%,100% { transform: translateY(0); } 50% { transform: translateY(calc(-6 * var(--p))); } }
@keyframes ga-reflet { 0%, 55% { background-position: 150% 0; } 100% { background-position: -60% 0; } }
.ga-bann .xbet { width: calc(300 * var(--p)); height: auto; display: block; }
.ga-bann .depot { margin-top: calc(10 * var(--p)); font-family: 'Archivo', 'Inter', sans-serif; font-stretch: 85%; font-weight: 900;
  font-size: calc(46 * var(--p)); line-height: 1; letter-spacing: calc(1 * var(--p)); color: var(--navy); white-space: nowrap; }
.ga-bann .depot em { font-style: normal; color: var(--or-2); }

@media (prefers-reduced-motion: reduce) {
  .ga-defile .piste, .ga-defile .code, .ga-bann *, .ga-bann *::after { animation: none !important; }
}