/* Overrides puntuales sobre Tailwind. La paleta y tipografias se definen
   en la config de Tailwind dentro de index.html. */

/* Suaviza el scroll de los anchors del nav */
html {
  scroll-behavior: smooth;
}

/* Display font (titulos) */
.font-display {
  font-family: 'Fraunces', Georgia, serif;
  font-feature-settings: 'ss01', 'ss02';
}

/* Limita el texto de descripcion a N lineas con elipsis */
.line-clamp-3 {
  display: -webkit-box;
  -webkit-line-clamp: 3;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

/* Hero: gradient overlay sobre la foto */
.hero-overlay {
  background: linear-gradient(180deg,
    rgba(43, 24, 16, 0.0) 0%,
    rgba(43, 24, 16, 0.4) 60%,
    rgba(43, 24, 16, 0.85) 100%);
}

/* Animacion sutil de entrada para elementos al cargar */
@media (prefers-reduced-motion: no-preference) {
  .fade-in {
    animation: fadeIn 0.6s ease-out both;
  }
  @keyframes fadeIn {
    from { opacity: 0; transform: translateY(12px); }
    to   { opacity: 1; transform: translateY(0); }
  }
}

/* Foco accesible */
a:focus-visible, button:focus-visible {
  outline: 2px solid #E85D2F;
  outline-offset: 3px;
  border-radius: 4px;
}