* { border-color: var(--color-border); }
html { -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; }
body {
  background-color: var(--color-background);
  color: var(--color-foreground);
  font-family: "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", system-ui, sans-serif;
  font-weight: 400;
}
::selection { background-color: var(--color-foreground); color: var(--color-background); }

.dark {
  --color-background: oklch(0.10 0 0);
  --color-foreground: oklch(0.97 0 0);
  --color-surface: oklch(0.14 0 0);
  --color-surface-2: oklch(0.18 0 0);
  --color-card: oklch(0.13 0 0);
  --color-card-foreground: oklch(0.97 0 0);
  --color-popover: oklch(0.13 0 0);
  --color-popover-foreground: oklch(0.97 0 0);
  --color-muted: oklch(0.20 0 0);
  --color-muted-foreground: oklch(0.7 0 0);
  --color-accent: oklch(0.20 0 0);
  --color-accent-foreground: oklch(0.97 0 0);
  --color-border: oklch(1 0 0 / 0.12);
  --color-input: oklch(1 0 0 / 0.18);
  --color-ring: oklch(0.97 0 0 / 0.5);
  --color-ink: oklch(0.97 0 0);
  --color-sale: oklch(0.58 0.22 27);
  --color-sale-foreground: oklch(1 0 0);
  --color-brand: oklch(0.58 0.22 27);
  --color-brand-foreground: oklch(1 0 0);
  --color-success: oklch(0.62 0.15 152);
  --color-destructive: oklch(0.58 0.22 27);
}

.serif { font-family: "Playfair Display", Georgia, "Times New Roman", serif; font-weight: 500; letter-spacing: -0.01em; }
.serif-italic { font-family: "Playfair Display", Georgia, "Times New Roman", serif; font-style: italic; font-weight: 400; }
.display { font-family: "Playfair Display", Georgia, "Times New Roman", serif; font-weight: 500; letter-spacing: -0.01em; line-height: 1; }

.eyebrow {
  font-size: 0.6875rem;
  letter-spacing: 0.22em;
  text-transform: uppercase;
  font-weight: 500;
  color: var(--color-muted-foreground);
}

.hairline { height: 1px; background-color: var(--color-border); }

.img-zoom { transition: transform 900ms cubic-bezier(0.22,1,0.36,1); }
.group:hover .img-zoom { transform: scale(1.04); }

.reveal { animation: reveal 600ms cubic-bezier(0.22,1,0.36,1) both; }

.stagger > * { animation: reveal 600ms cubic-bezier(0.22,1,0.36,1) both; }
.stagger > *:nth-child(1) { animation-delay: 50ms; }
.stagger > *:nth-child(2) { animation-delay: 120ms; }
.stagger > *:nth-child(3) { animation-delay: 190ms; }
.stagger > *:nth-child(4) { animation-delay: 260ms; }
.stagger > *:nth-child(5) { animation-delay: 330ms; }
.stagger > *:nth-child(6) { animation-delay: 400ms; }
.stagger > *:nth-child(7) { animation-delay: 470ms; }
.stagger > *:nth-child(8) { animation-delay: 540ms; }

.link-underline { position: relative; }
.link-underline::after {
  content: ""; position: absolute; left: 0; right: 0; bottom: -2px; height: 1px;
  background: currentColor; transform: scaleX(0); transform-origin: right;
  transition: transform 320ms cubic-bezier(0.22,1,0.36,1);
}
.link-underline:hover::after { transform: scaleX(1); transform-origin: left; }

.marquee { display: flex; width: max-content; animation: marquee 38s linear infinite; }
.marquee-fast { animation-duration: 22s; }

.no-scrollbar::-webkit-scrollbar { display: none; }
.no-scrollbar { -ms-overflow-style: none; scrollbar-width: none; }

@keyframes reveal {
  from { opacity: 0; transform: translateY(14px); }
  to { opacity: 1; transform: translateY(0); }
}
@keyframes marquee {
  from { transform: translateX(0); }
  to { transform: translateX(-50%); }
}
@keyframes fadeIn {
  from { opacity: 0; } to { opacity: 1; }
}
.animate-fade { animation: fadeIn 800ms ease both; }

@media (max-width: 768px) {
  .lg\:hidden { display: block; }
  .lg\:block { display: none; }
}
