/* Progressive enhancement: content remains visible without JavaScript. */
.video-play { width:100%; height:100%; border:0; background:#050508; color:var(--lime); display:flex; flex-direction:column; align-items:center; justify-content:center; gap:12px; padding:20px; cursor:pointer; }
.video-play:hover { background:#171021; }
.video-play > span:first-child { font-size:30px; }
.video-play small { color:var(--muted); }
.video iframe { display:block; }
.hero-inner > * { animation: enter .8s ease-out both; }
.hero-inner h1 { animation-delay: .1s; }
.hero-inner p { animation-delay: .2s; }
.hero-inner .actions { animation-delay: .3s; }
.hero:after { animation: turn 32s linear infinite; pointer-events: none; }
.reveal { opacity: 0; transform: translateY(24px); transition: opacity .65s ease, transform .65s ease; }
.reveal.is-visible { opacity: 1; transform: translateY(0); }
.btn { transition: transform .2s ease, box-shadow .2s ease; }
.btn:hover { transform: translateY(-2px); box-shadow: 0 6px 24px #7950ff33; }
.modal.open .modalbox { animation: enter .25s ease-out; }
:focus-visible { outline: 3px solid #7950ff; outline-offset: 4px; }
.cookie-notice { position: fixed; bottom: 18px; left: 18px; z-index: 60; width: min(440px, calc(100% - 36px)); max-height: 60vh; overflow: auto; padding: 20px; border: 1px solid #675c79; border-radius: 14px; background: #201b2c; box-shadow: 0 8px 40px #0006; font-size: 13px; }
.cookie-notice[hidden] { display: none; }
.cookie-notice p { margin-top: 0; }
.cookie-notice a { text-decoration: underline; margin-right: 16px; }
.cookie-notice .btn { margin-top: 10px; }
.text-button { padding: 0; border: 0; background: none; color: inherit; font: inherit; text-decoration: underline; cursor: pointer; }
.legal-document { max-width: 800px; padding-top: 48px; padding-bottom: 64px; }
.legal-document h1 { font-size: clamp(28px, 5vw, 44px); line-height: 1.15; }
.legal-document h2 { margin-top: 32px; }
.legal-document li { margin-bottom: 16px; }
@keyframes enter { from { opacity: 0; transform: translateY(20px); } to { opacity: 1; transform: translateY(0); } }
@keyframes turn { to { transform: rotate(360deg); } }
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after { animation: none !important; transition: none !important; }
  .reveal { opacity: 1; transform: none; }
}