/* ADDED BY TRAE */

/* Suaves animaciones y transiciones básicas */
.fade-in-up { opacity: 0; transform: translateY(8px); animation: fadeInUp .6s ease-out forwards; }
@keyframes fadeInUp { to { opacity: 1; transform: translateY(0); } }

.smooth { transition: all .2s ease-in-out; }

/* Contenedor principal con scroll-snap vertical */
.snap-container { scroll-snap-type: y proximity; }
.snap-section { scroll-snap-align: start; }

/* Tarjetas reutilizables */
.card { background: rgba(255,255,255,.95); backdrop-filter: blur(2px); border-radius: 1rem; box-shadow: 0 8px 24px rgba(0,0,0,.08); border: 1px solid rgba(255,255,255,.8); }
.card:hover { box-shadow: 0 10px 28px rgba(0,0,0,.12); }

/* Decoración floral en esquinas - grande con bleed */
/* ADDED BY TRAE: ajuste de tamaño y posición para efecto que se sale */
.floral { position: absolute; width: clamp(14rem, 32vw, 36rem); height: auto; opacity: .28; pointer-events: none; z-index: 0; max-width: none; }
.floral.top-left { top: -1.5rem; left: -1.5rem; }
.floral.bottom-right { bottom: -1.5rem; right: -1.5rem; transform: rotate(180deg); }

@media (min-width: 768px) {
  .floral { width: clamp(24rem, 36vw, 44rem); }
  .floral.top-left { top: -3rem; left: -3rem; }
  .floral.bottom-right { bottom: -3rem; right: -3rem; }
}

@media print {
  .floral { opacity: .15; }
}

/* Timeline vertical */
.timeline { position: relative; padding-left: 3rem; margin-inline: auto; }
.timeline::before { content: ""; position: absolute; left: 1.25rem; top: 0; bottom: 0; width: 1px; background: #d1d5db; }
.timeline ul { list-style: none; margin: 0; padding: 0; }
.timeline li { position: relative; display: flex; gap: 1rem; align-items: flex-start; }
.timeline .icon { width: 64px; height: 64px; display: flex; align-items: center; justify-content: center; }
.timeline .icon svg { width: 64px; height: 64px; color: #3C3C3C; }
.timeline .icon img { width: 64px; height: 64px; object-fit: contain; }
.timeline .marker { position: absolute; left: 1.1rem; top: .75rem; color: #3C3C3C; }
.timeline .marker svg { width: 16px; height: 16px; }
.timeline .time { font-weight: 600; }
.timeline .desc { color: #374151; font-size: .95rem; margin-top: .25rem; font-weight: 600; }

/* Botón imprimir */
.print-button { display: inline-flex; align-items: center; gap: .5rem; padding: .5rem .9rem; border-radius: 9999px; background: #5a7247; color: #fff; text-decoration: none; }
.print-button:hover { background: #4b6239; }

/* Modo reducción de movimiento */
@media (prefers-reduced-motion: reduce) {
  .fade-in-up { animation: none; opacity: 1; transform: none; }
  .smooth { transition: none; }
}

/* Estilos de impresión mínimos */
@media print {
  body { background: #fff !important; }
  header, footer, nav { display: none !important; }
  .print-hidden { display: none !important; }
  .card { box-shadow: none; border: 1px solid #e5e7eb; }
}
/* ADDED BY TRAE: evitar scroll horizontal en toda la página */
html, body { overflow-x: hidden; }
/* Tamaño uniforme para iconos de listas (Feather) */
.icon-md { width: 24px; height: 24px; }
