/* Bespoke Editorial Palette & Cinematic Motion System */
@import url('https://fonts.googleapis.com/css2?family=Space+Grotesk:wght@600;700&family=Manrope:wght@400;500;600;700&family=IBM+Plex+Mono:wght@400;500;600&display=swap');

*, ::before, ::after {
  box-sizing: border-box;
  margin: 0;
  padding: 0;
  border-width: 0;
  border-style: solid;
  border-color: rgba(240, 240, 235, 0.12);
}

:root {
  --color-night: #090909;
  --color-graphite: #141414;
  --color-bone: #f0f0eb;
  --color-mist: #8c8c86;
  --color-lime: #c6f36a;
}

html {
  line-height: 1.5;
  -webkit-text-size-adjust: 100%;
  tab-size: 4;
  scroll-behavior: smooth;
  font-family: 'Manrope', system-ui, -apple-system, sans-serif;
  background-color: var(--color-night);
  color: var(--color-bone);
}

body {
  margin: 0;
  background-color: #090909;
  color: #f0f0eb;
  overflow-x: hidden;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  text-rendering: optimizeLegibility;
}

::selection {
  background-color: #c6f36a;
  color: #090909;
}

a {
  color: inherit;
  text-decoration: inherit;
}

button {
  font: inherit;
  cursor: pointer;
  background: transparent;
  color: inherit;
}

ul, ol {
  list-style: none;
}

/* Typography Tokens */
.font-display {
  font-family: 'Space Grotesk', system-ui, sans-serif;
  letter-spacing: -0.035em;
}

.font-body {
  font-family: 'Manrope', system-ui, sans-serif;
}

.font-mono {
  font-family: 'IBM Plex Mono', ui-monospace, monospace;
}

/* Cinematic Slow-Motion Transitions */
.reveal {
  opacity: 0;
  transform: translateY(28px);
  transition: opacity 0.9s cubic-bezier(0, 0, 0.2, 1), transform 0.9s cubic-bezier(0, 0, 0.2, 1);
  will-change: opacity, transform;
}

.reveal.is-visible {
  opacity: 1;
  transform: translateY(0);
}

.delay-1 {
  transition-delay: 0.15s;
}

.delay-2 {
  transition-delay: 0.3s;
}

.delay-3 {
  transition-delay: 0.45s;
}

/* Cinematic Hero Rise */
@keyframes heroRise {
  0% {
    opacity: 0;
    transform: translateY(44px);
  }
  100% {
    opacity: 1;
    transform: translateY(0);
  }
}

.animate-hero-rise {
  animation: heroRise 1.2s cubic-bezier(0.16, 1, 0.3, 1) both;
}

/* Modal Smooth Zoom */
@keyframes modalEntry {
  from {
    opacity: 0;
    transform: scale(0.95) translateY(12px);
  }
  to {
    opacity: 1;
    transform: scale(1) translateY(0);
  }
}

.animate-modal-entry {
  animation: modalEntry 0.35s cubic-bezier(0.16, 1, 0.3, 1) forwards;
}

/* Custom Scrollbar */
::-webkit-scrollbar {
  width: 6px;
}
::-webkit-scrollbar-track {
  background: #090909;
}
::-webkit-scrollbar-thumb {
  background: rgba(240, 240, 235, 0.18);
  border-radius: 3px;
}
::-webkit-scrollbar-thumb:hover {
  background: rgba(240, 240, 235, 0.35);
}
