/* Traffic drivers του Gazzetta Games: κοινά στοιχεία (γραμματοσειρές, χρώματα του Stadium) */
@font-face { font-family: 'GzCond'; font-style: italic; font-weight: 800; font-display: block;
  src: url('../../fonts/sofia-sans-extra-condensed-800-italic-greek.woff2') format('woff2'); unicode-range: U+0370-03FF; }
@font-face { font-family: 'GzCond'; font-style: italic; font-weight: 800; font-display: block;
  src: url('../../fonts/sofia-sans-extra-condensed-800-italic-latin.woff2') format('woff2'); unicode-range: U+0000-00FF, U+2000-206F; }
@font-face { font-family: 'GzBody'; font-weight: 400 600; font-display: swap;
  src: url('../../fonts/commissioner-400-greek.woff2') format('woff2'); unicode-range: U+0370-03FF; }
@font-face { font-family: 'GzBody'; font-weight: 400 600; font-display: swap;
  src: url('../../fonts/commissioner-400-latin.woff2') format('woff2'); unicode-range: U+0000-00FF, U+2000-206F; }

:root {
  --volt: #ad00ff; --ice: #6df6ff; --hot: #ff3d7f; --gold: #ffd36e; --night: #101222;
  --bar: linear-gradient(90deg, #063e72 0%, #3a1f9a 55%, #ad00ff 100%);
}
* { box-sizing: border-box; margin: 0; }
html, body { overflow: hidden; background: var(--night); color: #f3f4f8; font-family: 'GzBody', system-ui, sans-serif; -webkit-font-smoothing: antialiased; }
a { color: inherit; text-decoration: none; }
.cond { font-family: 'GzCond', 'Arial Narrow', sans-serif; font-style: italic; font-weight: 800; }
.logo { display: flex; align-items: center; gap: 8px; }
.logo img { display: block; height: auto; }
.tag { font-family: 'GzCond', sans-serif; font-style: italic; font-weight: 800; line-height: 1; padding: 3px 9px 1px; background: var(--ice); color: var(--night);
  transform: skew(-8deg); box-shadow: 0 0 16px rgba(109, 246, 255, .7); }
.live { display: inline-flex; align-items: center; gap: 6px; font-weight: 700; color: var(--ice); }
.live::before { content: ''; width: 8px; height: 8px; border-radius: 50%; background: var(--hot); box-shadow: 0 0 10px var(--hot); animation: pulse 1.2s infinite; }
@keyframes pulse { 50% { opacity: .25; } }
.cta { display: inline-block; font-family: 'GzCond', sans-serif; font-style: italic; font-weight: 800; line-height: 1; color: var(--night); background: var(--ice);
  border-radius: 10px; box-shadow: 0 0 18px rgba(109, 246, 255, .75), 0 0 40px rgba(109, 246, 255, .3); animation: glow 1.6s ease-in-out 6 alternate; }
@keyframes glow { to { box-shadow: 0 0 26px rgba(109, 246, 255, .95), 0 0 60px rgba(109, 246, 255, .45); transform: scale(1.04); } }
/* νέον γήπεδο σε προοπτική */
.grid { position: absolute; left: -40%; right: -40%; bottom: -30%; height: 75%; pointer-events: none;
  transform-origin: 50% 0; transform: perspective(360px) rotateX(64deg); opacity: .7;
  background:
    linear-gradient(transparent 0 calc(100% - 2px), rgba(109, 246, 255, .55) 0) 0 0 / 100% 40px,
    linear-gradient(90deg, transparent 0 calc(100% - 2px), rgba(173, 0, 255, .65) 0) 0 0 / 40px 100%;
  -webkit-mask: linear-gradient(to bottom, transparent, #000 40%); mask: linear-gradient(to bottom, transparent, #000 40%);
  animation: run 1.8s linear infinite; }
@keyframes run { to { background-position: 0 40px, 0 0; } }
/* εναλλαγή παιχνιδιού: ο τίτλος «σκάει» και το εξώφυλλο γυρίζει */
.swap [data-g-title] { animation: slam .6s cubic-bezier(.2, 1.4, .3, 1) both; }
.swap .card { animation: flip .6s cubic-bezier(.2, 1.2, .3, 1) both; }
@keyframes slam { from { opacity: 0; transform: translateX(-30px) skewX(-14deg) scale(1.1); } to { opacity: 1; transform: none; } }
@keyframes flip { from { opacity: 0; transform: rotateY(70deg) rotate(4deg); } to { opacity: 1; } }
.card { display: block; border-radius: 14px; overflow: hidden; aspect-ratio: 4 / 3;
  box-shadow: 0 0 0 2px var(--ice), 0 0 30px -2px var(--ice), 0 20px 40px -16px #000; }
.card img { display: block; width: 100%; height: 100%; object-fit: cover; }
@media (prefers-reduced-motion: reduce) { *, *::before, *::after { animation: none !important; } }
