/* ------------------------------------------------------------
   Orbital – Product Design Portfolio System
   ------------------------------------------------------------ */

/* ==== Design Tokens ==== */
:root {
  --font-heading: 'PP Neue Montreal', sans-serif;
  --font-body: 'PP Neue Montreal', sans-serif;
  --color-text-secondary: #9FA4AD;
}

/* Base resets handled by Tailwind, but keeping these for legacy support if needed */
* {
  box-sizing: border-box;
  margin: 0;
  padding: 0;
}

html {
  scroll-behavior: smooth;
}

body {
  font-family: var(--font-body);
  -webkit-font-smoothing: antialiased;
}

h1,
h2,
h3,
h4 {
  font-family: var(--font-heading);
}

/* Custom Utilities not easily done in Tailwind or needing specific precision */
.glass {
  background: rgba(255, 255, 255, 0.05);
  backdrop-filter: blur(10px);
  border: 1px solid rgba(255, 255, 255, 0.1);
}

.dark .glass {
  background: rgba(16, 24, 40, 0.8);
}

/* Animation Utilities */
.reveal {
  opacity: 0;
  transform: translateY(20px);
  transition: all 0.8s cubic-bezier(0.2, 1, 0.3, 1);
}

.reveal.active {
  opacity: 1;
  transform: translateY(0);
}

.zoom-top-left {
  object-position: left top;
  transform: scale(1.35);
  transform-origin: left top;
}