:root { color-scheme: dark; font-family: "Exo 2", sans-serif; background: #161616; }
* { box-sizing: border-box; }
html, body { min-height: 100%; margin: 0; }
body { background: #161616; }
.landing { min-height: 100svh; display: flex; flex-direction: column; position: relative; overflow: hidden; background: #161616; isolation: isolate; }
.hero-fallback, .hero-video, .hero-shade { position: absolute; inset: 0; width: 100%; height: 100%; }
.hero-fallback, .hero-video { object-fit: cover; z-index: -3; }
.hero-video { opacity: 0; }
.hero-video.is-ready { opacity: 1; }
.hero-shade { z-index: -2; pointer-events: none; background: radial-gradient(ellipse 70% 55% at 50% 10%, transparent 0%, rgba(22,22,22,.15) 35%, rgba(22,22,22,.9) 100%); }
.video-controls { position: absolute; top: 48px; right: 48px; display: flex; gap: 8px; z-index: 2; }
.round-button { width: 40px; height: 40px; padding: 0; display: grid; place-items: center; color: rgba(255,255,255,.8); background: rgba(0,0,0,.5); border: 1px solid rgba(255,255,255,.1); border-radius: 50%; cursor: pointer; transition: background .2s; }
.round-button:hover { background: rgba(0,0,0,.72); }
.round-button svg { width: 18px; height: 14px; fill: currentColor; }
.round-button #play-icon { width: 14px; }
.icon-stroke { fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }
.hero-content { flex: 1; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 69px; padding: 104px 32px 72px; text-align: center; }
.product-logo { width: min(910px, 90vw); height: auto; }
h1 { max-width: 1040px; margin: 0 0 32px; color: #f2f2f2; font-family: Montserrat, sans-serif; font-size: clamp(28px, 2.5vw, 48px); font-weight: 900; line-height: 1.46; text-transform: uppercase; text-shadow: 0 4px 10px #000; }
.cta { width: 510px; display: flex; flex-direction: column; align-items: center; gap: 16px; }
.download-button { position: relative; width: 100%; height: 106px; display: inline-flex; align-items: center; justify-content: center; gap: 10px; overflow: hidden; border: 0; border-radius: 5px; color: #232323; background: linear-gradient(#d7a34d, #bc8e41); font: 700 40px/65px "Exo 2", sans-serif; letter-spacing: .08px; text-decoration: none; cursor: pointer; }
.download-button::after { content: ""; position: absolute; inset: 0; pointer-events: none; background: linear-gradient(105deg, transparent 30%, rgba(255,255,255,.55) 50%, transparent 70%); animation: sweep 2.8s ease-in-out infinite; }
.download-button svg { width: 24px; height: 24px; fill: currentColor; }
.share-button svg { width: 22px; height: 22px; }
.share-button { display: none; }
.calltext-button { text-decoration: none; }
.cta p { margin: 0; color: #f2f2f2; font-size: 14px; letter-spacing: .7px; text-transform: uppercase; }
@keyframes sweep { from { transform: translateX(-200%) skewX(-20deg); } to { transform: translateX(400%) skewX(-20deg); } }
footer { display: flex; align-items: center; justify-content: space-between; gap: 24px; padding: 8px 24px; z-index: 1; background: rgba(0,0,0,.3); border-top: 1px solid rgba(242,242,242,.05); backdrop-filter: blur(5px); }
.legal { display: flex; align-items: center; gap: 32px; min-width: 0; }
.foxhound { width: 176px; height: 59px; flex: 0 0 auto; color: #c2c2c2; text-decoration: none; }
.foxhound svg { display: block; width: 100%; height: 100%; }
.legal p { margin: 0; color: #c2c2c2; font-size: 14px; line-height: normal; }
.legal p a { margin-left: 24px; color: #d7a34d; text-decoration: none; white-space: nowrap; }
.legal p a:hover { text-decoration: underline; }
.socials { display: flex; gap: 8px; flex: 0 0 auto; }
.socials a { width: 48px; height: 48px; display: grid; place-items: center; border-radius: 6px; color: #c2c2c2; background: #212121; text-decoration: none; }
.socials a:hover { color: #fff; }
.socials svg { width: 21.33px; fill: currentColor; }
.socials b { font: 700 11px Arial, sans-serif; }
@media (max-width: 639px) { .video-controls { top: 24px; right: 24px; } .hero-content { gap: 40px; padding: 96px 16px 48px; } h1 { line-height: 1.2; padding: 0 4px; } #download-button { display: none; } #logo-button { pointer-events: none; cursor: default; } #calltext-button { pointer-events: none; cursor: default; } .share-button { display: inline-flex; font: 700 32px/40px "Exo 2";  min-width: 320px;} .cta { width: 90%;} .cta > p { display: none; } footer { flex-direction: column; padding: 16px 16px 8px; gap: 8px; } .legal { flex-direction: column; gap: 4px; } .foxhound { width: 119px; height: 40px; } .legal p { text-align: center; } .legal p a { display: inline-block; margin: 4px 8px 0; white-space: normal; } }
@media (prefers-reduced-motion: reduce) { .download-button::after { animation: none; } }