/** Shopify CDN: Minification failed

Line 18:0 All "@import" rules must come first

**/
/* GENR8 Base Styles */
:root {
  --color-primary: #0A0A0A;
  --color-secondary: #0066FF;
  --color-white: #FFFFFF;
  --color-gray: #1A1A1A;
  --color-gray-light: #888888;
  --font-heading: 'Space Grotesk', sans-serif;
  --font-body: 'Inter', sans-serif;
  --font-mono: 'JetBrains Mono', monospace;
}

@import url('https://fonts.googleapis.com/css2?family=Space+Grotesk:wght@400;500;600;700&family=Inter:wght@300;400;500;600;700&family=JetBrains+Mono:wght@400;500;600&display=swap');

* { margin: 0; padding: 0; box-sizing: border-box; }

body {
  background-color: var(--color-primary);
  color: var(--color-white);
  font-family: var(--font-body);
  line-height: 1.6;
}

.reveal { opacity: 0; transform: translateY(30px); transition: opacity 0.8s ease, transform 0.8s ease; }
.reveal.active { opacity: 1; transform: translateY(0); }

.btn {
  display: inline-flex; align-items: center; justify-content: center;
  padding: 1rem 2.5rem; font-family: var(--font-heading);
  font-size: 0.875rem; font-weight: 600; letter-spacing: 0.1em;
  text-transform: uppercase; border: 2px solid var(--color-secondary);
  background: transparent; color: var(--color-secondary);
  cursor: pointer; transition: all 0.3s ease;
}
.btn:hover { background: var(--color-secondary); color: var(--color-primary); }
.btn-primary { background: var(--color-secondary); color: var(--color-primary); }
.btn-primary:hover { background: var(--color-primary); color: var(--color-secondary); }

.section { padding: 8rem 2rem; position: relative; }
@media screen and (max-width: 768px) { .section { padding: 4rem 1.5rem; } }

.product-card { transition: transform 0.3s ease; }
.product-card:hover { transform: translateY(-5px); }

::-webkit-scrollbar { width: 8px; }
::-webkit-scrollbar-track { background: var(--color-primary); }
::-webkit-scrollbar-thumb { background: var(--color-secondary); border-radius: 4px; }