﻿
/* Global extras (mobile-first). Keep Tailwind as base. */

:root {
  --safe-top: env(safe-area-inset-top);
  --safe-bottom: env(safe-area-inset-bottom);
}

html { scroll-behavior: smooth; }

/* Better tap targets on mobile */
a, button { -webkit-tap-highlight-color: transparent; }

/* Blob animation (used across pages) */
@keyframes blob {
  0% { transform: translate(0px, 0px) scale(1); }
  33% { transform: translate(26px, -40px) scale(1.08); }
  66% { transform: translate(-18px, 18px) scale(0.94); }
  100% { transform: translate(0px, 0px) scale(1); }
}
.animate-blob { animation: blob 9s ease-in-out infinite; }
.animation-delay-2000 { animation-delay: 2s; }
.animation-delay-4000 { animation-delay: 4s; }

/* Gentle floating for attention */
@keyframes floaty {
  0%, 100% { transform: translateY(0); }
  50% { transform: translateY(-8px); }
}
.animate-floaty { animation: floaty 3.6s ease-in-out infinite; }

/* Subtle glow pulse for CTAs */
@keyframes glowPulse {
  0%, 100% { box-shadow: 0 18px 44px rgba(6, 182, 212, 0.18); }
  50% { box-shadow: 0 22px 60px rgba(59, 130, 246, 0.22); }
}
.cta-glow { animation: glowPulse 2.6s ease-in-out infinite; }

/* Pattern helper (used in conocenos.php) */
.pattern-grid-lg {
  background-image: radial-gradient(circle at 2px 2px, rgba(255,255,255,0.16) 1px, transparent 0);
  background-size: 26px 26px;
}

/* Mobile: avoid huge nav spacing + safe areas */
@media (max-width: 768px) {
  body { padding-bottom: calc(8px + var(--safe-bottom)); }
}
