:root {
  --color-bg-primary: #F5F0E8;
  --color-bg-secondary: #EDE8DE;
  --color-bg-tertiary: #E8E2D8;
  --color-bg-card: #F0EBE3;
  --color-text-primary: #1A1A1A;
  --color-text-secondary: #3D3D3D;
  --color-text-muted: #6B6B6B;
  --color-text-faint: #9A9590;
  --color-accent: #C23B22;
  --color-accent-hover: #A83220;
  --color-accent-secondary: #B8860B;
  --color-border-hard: #D4CFC5;
  --color-border-subtle: #E0DBD2;
}

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

html {
  scroll-behavior: smooth;
}

body {
  font-family: 'Outfit', 'Inter', sans-serif;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  background-color: var(--color-bg-primary);
  color: var(--color-text-secondary);
}

.font-serif {
  font-family: 'Playfair Display', Georgia, serif;
}

.glass {
  background: var(--color-bg-card);
  border: 1px solid var(--color-border-hard);
}

.editorial-photo {
  position: relative;
  overflow: hidden;
  border: 1px solid var(--color-border-hard);
}

.editorial-photo::after {
  content: '';
  position: absolute;
  inset: 0;
  pointer-events: none;
  opacity: 0.06;
  background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 256 256' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='noise'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23noise)'/%3E%3C/svg%3E");
  background-repeat: repeat;
  background-size: 256px 256px;
  mix-blend-mode: multiply;
  z-index: 1;
}

.editorial-photo img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: filter 0.7s ease, transform 0.7s ease;
}

.editorial-photo:hover img {
  transform: scale(1.02);
}

.grain-overlay {
  position: fixed;
  top: -50%;
  left: -50%;
  right: -50%;
  bottom: -50%;
  width: 200%;
  height: 200%;
  pointer-events: none;
  z-index: 9999;
  opacity: 0.04;
  background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 256 256' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='noise'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23noise)'/%3E%3C/svg%3E");
  background-repeat: repeat;
  background-size: 256px 256px;
}

@keyframes float-orb {
  0%, 100% { transform: translate3d(0, 0, 0) scale(1); }
  50% { transform: translate3d(8px, -25px, 0) scale(1.15); }
}

@keyframes bounce-chevron {
  0%, 100% { transform: translateX(-50%) translateY(0); }
  50% { transform: translateX(-50%) translateY(10px); }
}

@keyframes ticker {
  0% { transform: translate3d(0, 0, 0); }
  100% { transform: translate3d(-50%, 0, 0); }
}

@keyframes pulse-glow {
  0%, 100% { opacity: 0.4; }
  50% { opacity: 1; }
}

@-webkit-keyframes float-orb {
  0%, 100% { -webkit-transform: translate3d(0, 0, 0) scale(1); transform: translate3d(0, 0, 0) scale(1); }
  50% { -webkit-transform: translate3d(8px, -25px, 0) scale(1.15); transform: translate3d(8px, -25px, 0) scale(1.15); }
}

@-webkit-keyframes bounce-chevron {
  0%, 100% { -webkit-transform: translateX(-50%) translateY(0); transform: translateX(-50%) translateY(0); }
  50% { -webkit-transform: translateX(-50%) translateY(10px); transform: translateX(-50%) translateY(10px); }
}

@-webkit-keyframes ticker {
  0% { -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); }
  100% { -webkit-transform: translate3d(-50%, 0, 0); transform: translate3d(-50%, 0, 0); }
}

@-webkit-keyframes pulse-glow {
  0%, 100% { opacity: 0.4; }
  50% { opacity: 1; }
}

.floating-orb {
  -webkit-animation: float-orb 10s ease-in-out infinite;
  animation: float-orb 10s ease-in-out infinite;
  will-change: transform;
  -webkit-backface-visibility: hidden;
  backface-visibility: hidden;
}

.scroll-chevron {
  -webkit-animation: bounce-chevron 2s ease-in-out infinite;
  animation: bounce-chevron 2s ease-in-out infinite;
}

.animate-ticker {
  -webkit-animation: ticker 30s linear infinite;
  animation: ticker 30s linear infinite;
  will-change: transform;
}

.animate-pulse-glow {
  -webkit-animation: pulse-glow 3s ease-in-out infinite;
  animation: pulse-glow 3s ease-in-out infinite;
}

.hero-parallax {
  will-change: transform;
  -webkit-backface-visibility: hidden;
  backface-visibility: hidden;
  -webkit-transform: translateZ(0);
  transform: translateZ(0);
}

.navbar-scrolled {
  background: var(--color-bg-card);
  border-bottom: 1px solid var(--color-border-hard);
}

@media (min-width: 768px) {
  #gallery-grid {
    grid-auto-rows: 220px !important;
  }
}

@keyframes nav-slide-down {
  from { transform: translateY(-100%); opacity: 0; }
  to { transform: translateY(0); opacity: 1; }
}

#navbar {
  animation: nav-slide-down 0.6s ease-out;
}