:root {
  --crema: #FBF7F3;
  --crema-carta: #FEFCFA;
  --crema-alt: #F4EEE6;
  --oliva: #23302B;
  --oliva-suave: #57655F;
  --dorado: #A98F63;
  --dorado-linea: rgba(169, 143, 99, 0.35);
  --dorado-suave: rgba(169, 143, 99, 0.12);
}

html {
  scroll-behavior: smooth;
}

body {
  background-color: var(--crema);
  color: var(--oliva);
  font-family: 'Inter', sans-serif;
}

h1, h2, h3, .font-serif {
  font-family: 'Fraunces', serif;
}

/* Animaciones de Reveal */
.reveal {
  opacity: 1;
  transform: translateY(0);
  transition: opacity 0.8s cubic-bezier(0.16, 1, 0.3, 1),
              transform 0.8s cubic-bezier(0.16, 1, 0.3, 1);
}

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

/* Transición para ocultar/mostrar paneles */
.hidden-panel {
  display: none;
  opacity: 0;
  transition: opacity 0.4s ease;
}