/* Bandeau publicitaire DumaisFinance. S'adapte à la largeur de son emplacement (requêtes de
   conteneur) : une ligne à partir de 860 px, une ligne resserrée de 640 à 859 px (elle tient
   dans un emplacement de 728 × 90), deux lignes de 420 à 639 px, une carte en dessous (elle
   tient dans un pavé de 300 × 250).
   Toutes les classes commencent par « df-bandeau » pour ne rien toucher du site qui l'accueille.
   Sans les polices du dossier fonts/, le bandeau retombe sur la police système. */
@font-face { font-family: 'DF Montserrat'; font-weight: 700; font-display: swap; src: url('../fonts/montserrat-700.woff2') format('woff2'); }
@font-face { font-family: 'DF Montserrat'; font-weight: 800; font-display: swap; src: url('../fonts/montserrat-800.woff2') format('woff2'); }

.df-bandeau { container-type: inline-size; width: 100%; height: 100%; }
.df-bandeau, .df-bandeau * { box-sizing: border-box; margin: 0; padding: 0; }
.df-bandeau__lien {
  position: relative; display: flex; align-items: center; gap: 28px; overflow: hidden;
  width: 100%; height: 100%; min-height: 90px; padding: 14px 28px; border-radius: 14px;
  color: #fff; text-decoration: none; font: 500 15px/1.35 system-ui, -apple-system, 'Segoe UI', Roboto, sans-serif;
  background:
    radial-gradient(circle at 8% 0%, rgba(26, 212, 254, .22), transparent 45%),
    radial-gradient(circle at 96% 110%, rgba(2, 91, 249, .55), transparent 50%),
    linear-gradient(120deg, #031228 0%, #031a39 50%, #02295c 100%);
}
.df-bandeau__lien:focus-visible { outline: 3px solid #1ad4fe; outline-offset: 2px; }
.df-bandeau__pub {
  position: absolute; top: 5px; right: 10px; font-size: 10px; line-height: 1; letter-spacing: .08em;
  text-transform: uppercase; color: rgba(255, 255, 255, .55);
}
.df-bandeau__marque { display: flex; align-items: center; gap: 12px; flex: none; }
.df-bandeau__marque svg { height: 44px; width: auto; display: block; }
.df-bandeau__marque b { display: block; font: 800 24px/1 'DF Montserrat', system-ui, sans-serif; }
.df-bandeau__marque i { display: block; margin-top: 5px; font: 700 8.5px/1 'DF Montserrat', system-ui, sans-serif; font-style: normal; letter-spacing: .56em; color: #1ad4fe; }
.df-bandeau__texte { flex: 1; min-width: 0; }
.df-bandeau__texte strong { display: block; font: 800 22px/1.15 'DF Montserrat', system-ui, sans-serif; letter-spacing: -.01em; }
.df-bandeau__texte em { font-style: normal; color: #2fd6ff; }
.df-bandeau__texte > span { display: block; margin-top: 5px; color: #c9d8ee; }
.df-bandeau__texte > span::first-letter { text-transform: uppercase; }
.df-bandeau__bouton {
  flex: none; padding: 12px 22px; border-radius: 99px; white-space: nowrap;
  font: 800 15px/1 'DF Montserrat', system-ui, sans-serif; color: #fff;
  background: linear-gradient(135deg, #1ad4fe, #025bf9); box-shadow: 0 10px 28px rgba(2, 91, 249, .45);
  transition: transform .2s ease, box-shadow .2s ease;
}
.df-bandeau__lien:hover .df-bandeau__bouton { transform: translateY(-1px); box-shadow: 0 14px 34px rgba(2, 91, 249, .6); }

@container (max-width: 859px) {
  .df-bandeau__lien { gap: 18px; padding: 10px 20px; }
  .df-bandeau__marque { gap: 10px; }
  .df-bandeau__marque svg { height: 38px; }
  .df-bandeau__marque b { font-size: 21px; }
  .df-bandeau__marque i { font-size: 7.5px; }
  .df-bandeau__texte strong { font-size: 18px; }
  .df-bandeau__texte > span { margin-top: 3px; font-size: 14px; }
  .df-bandeau__detail { display: none; }
  .df-bandeau__bouton { padding: 11px 18px; font-size: 14px; }
}
@container (max-width: 639px) {
  .df-bandeau__lien { flex-wrap: wrap; gap: 12px 20px; padding: 22px 22px 18px; }
  .df-bandeau__marque { margin-right: auto; }
  .df-bandeau__texte { order: 3; flex: 0 0 100%; }
  .df-bandeau__texte strong { font-size: 20px; }
  .df-bandeau__detail { display: inline; }
}
@container (max-width: 419px) {
  .df-bandeau__lien { flex-direction: column; flex-wrap: nowrap; justify-content: center; gap: 12px; padding: 22px 16px 16px; text-align: center; }
  .df-bandeau__marque { margin-right: 0; }
  .df-bandeau__texte { order: 0; flex: none; }
  .df-bandeau__texte strong { font-size: 18px; }
  .df-bandeau__detail { display: none; }
  .df-bandeau__bouton { align-self: stretch; padding: 13px 20px; text-align: center; }
}
@media (prefers-reduced-motion: reduce) { .df-bandeau__bouton { transition: none; } }

/* Emplacement dans GameSolus : sous le contenu de la page, avant le pied de page. */
.df-bandeau-emplacement { margin: 3rem 0; }