/* Le jeu « Un hiver de renard » sous le titre des pages d'accueil : une affiche cliquable, puis le jeu dans un cadre.
   Sur téléphone (ou écran étroit), l'affiche ouvre la page du jeu, plus confortable qu'un cadre de 200 px de haut. */
.fox-embed { max-width: 960px; margin: 6px auto 4px; text-align: center; }
.fox-embed-frame {
  position: relative; display: block; width: 100%; aspect-ratio: 16 / 9; overflow: hidden;
  border-radius: 14px; border: 1px solid rgba(255, 255, 255, 0.14); background: #cfd6dc;
  box-shadow: 0 10px 34px rgba(0, 0, 0, 0.45);
}
.fox-embed-frame:fullscreen { border-radius: 0; border: 0; }
.fox-embed-frame img, .fox-embed-frame iframe { position: absolute; inset: 0; width: 100%; height: 100%; border: 0; display: block; }
.fox-embed-frame img { object-fit: cover; transition: transform .5s ease, filter .5s ease; }
.fox-embed-play { position: absolute; inset: 0; display: flex; flex-direction: column; align-items: center; justify-content: flex-start; gap: 10px;
  padding-top: 7%; color: #fff; text-decoration: none; background: linear-gradient(180deg, rgba(8, 18, 40, 0.6), rgba(8, 18, 40, 0) 55%); }
.fox-embed-play:hover { color: #fff; text-decoration: none; }
.fox-embed-frame:hover img { transform: scale(1.03); filter: brightness(1.05); }
.fox-embed-btn { width: 76px; height: 76px; border-radius: 50%; display: flex; align-items: center; justify-content: center;
  background: rgba(10, 24, 52, 0.72); border: 2px solid rgba(255, 255, 255, 0.85); font-size: 30px; padding-left: 6px;
  box-shadow: 0 0 0 8px rgba(255, 255, 255, 0.12); transition: transform .2s ease, background .2s ease; }
.fox-embed-frame:hover .fox-embed-btn { transform: scale(1.08); background: rgba(0, 150, 200, 0.8); }
.fox-embed-name { font-size: clamp(1.15rem, 2.6vw, 1.6rem); font-weight: 700; letter-spacing: .02em; text-shadow: 0 2px 10px rgba(0, 0, 0, 0.6); }
.fox-embed-cta { font-size: .95rem; padding: 4px 14px; border-radius: 999px; background: rgba(10, 24, 52, 0.6); }
.fox-embed-bar { display: flex; align-items: center; justify-content: center; gap: 14px; flex-wrap: wrap; margin-top: 10px; }
.fox-embed-sub { margin: 0; font-size: 1.05rem; font-style: italic; color: rgba(255, 255, 255, 0.85); letter-spacing: .02em; }
.fox-embed-full { font-size: .9rem; color: #7fdcff; text-decoration: none; white-space: nowrap; }
.fox-embed-full:hover { text-decoration: underline; color: #b5ecff; }
@media (max-width: 600px) {
  .fox-embed-btn { width: 58px; height: 58px; font-size: 23px; }
  .fox-embed-cta { font-size: .85rem; }
  .fox-embed-sub { font-size: .95rem; }
}
