/* Inversiones El Pino — Propuesta UI 2026 */

:root {
  --pino-green: #1B8A4A;
  --pino-green-dark: #0F5C2E;
  --pino-green-light: #E8F5ED;
  --pino-orange: #F7941D;
  --pino-orange-dark: #E07B00;
  --pino-yellow: #FFC107;
  --ease-out: cubic-bezier(0.16, 1, 0.3, 1);
}

html { scroll-behavior: smooth; }
body { -webkit-font-smoothing: antialiased; }

::selection {
  background: rgba(27, 138, 74, 0.2);
  color: var(--pino-green-dark);
}

/* Navbar */
.navbar-scrolled {
  background: rgba(255, 255, 255, 0.96) !important;
  backdrop-filter: blur(16px);
  -webkit-backdrop-filter: blur(16px);
  box-shadow: 0 4px 24px rgba(15, 92, 46, 0.08);
  border-bottom: 1px solid rgba(27, 138, 74, 0.1);
}

.navbar-scrolled .nav-link { color: #374151 !important; }
.navbar-scrolled .nav-link:hover { color: var(--pino-green) !important; }
.navbar-scrolled .logo-text { color: var(--pino-green-dark) !important; }
.navbar-scrolled .hamburger-line { background-color: var(--pino-green-dark); }

/* Scroll reveal */
.reveal {
  opacity: 0;
  transform: translateY(24px);
  transition: opacity 0.7s var(--ease-out), transform 0.7s var(--ease-out);
}
.reveal.revealed { opacity: 1; transform: translateY(0); }
.reveal-left {
  opacity: 0;
  transform: translateX(-32px);
  transition: opacity 0.7s var(--ease-out), transform 0.7s var(--ease-out);
}
.reveal-left.revealed { opacity: 1; transform: translateX(0); }
.reveal-right {
  opacity: 0;
  transform: translateX(32px);
  transition: opacity 0.7s var(--ease-out), transform 0.7s var(--ease-out);
}
.reveal-right.revealed { opacity: 1; transform: translateX(0); }
.delay-100 { transition-delay: 100ms; }
.delay-200 { transition-delay: 200ms; }
.delay-300 { transition-delay: 300ms; }

/* Region pills */
.region-pill {
  transition: all 0.3s var(--ease-out);
  white-space: nowrap;
}
.region-pill.active {
  background: var(--pino-green);
  color: white;
  box-shadow: 0 4px 16px rgba(27, 138, 74, 0.35);
}
.region-pill:not(.active):hover {
  background: var(--pino-green-light);
  color: var(--pino-green-dark);
}

/* Project cards */
.project-card {
  transition: transform 0.4s var(--ease-out), box-shadow 0.4s var(--ease-out);
}
.project-card:hover {
  transform: translateY(-6px);
  box-shadow: 0 20px 40px -12px rgba(15, 92, 46, 0.18);
}
.project-card .project-img {
  transition: transform 0.6s var(--ease-out);
}
.project-card:hover .project-img { transform: scale(1.05); }
.project-card.hidden-by-region { display: none; }

/* Price badge */
.cuota-badge {
  background: linear-gradient(135deg, var(--pino-orange), var(--pino-orange-dark));
}

/* Lead form hero */
.lead-form {
  box-shadow: 0 24px 64px -12px rgba(15, 92, 46, 0.25);
}

/* Feature cards */
.feature-card {
  transition: transform 0.35s var(--ease-out), box-shadow 0.35s;
}
.feature-card:hover {
  transform: translateY(-4px);
  box-shadow: 0 12px 32px -8px rgba(27, 138, 74, 0.12);
}

/* Property card (shared JS compat) */
.property-card { transition: transform 0.4s var(--ease-out), box-shadow 0.4s; }
.property-card:hover {
  transform: translateY(-6px);
  box-shadow: 0 20px 40px -12px rgba(15, 92, 46, 0.15);
}

/* Carousel */
.carousel-track { display: flex; transition: transform 0.6s var(--ease-out); }
.carousel-slide { flex: 0 0 100%; }
@media (min-width: 768px) { .carousel-slide { flex: 0 0 50%; } }
@media (min-width: 1024px) { .carousel-slide { flex: 0 0 33.333%; } }

.testimonial-track { display: flex; transition: transform 0.7s var(--ease-out); }
.testimonial-slide { flex: 0 0 100%; }
@media (min-width: 768px) { .testimonial-slide { flex: 0 0 50%; } }
@media (min-width: 1024px) { .testimonial-slide { flex: 0 0 33.333%; } }

/* Timeline */
.timeline-step.active .timeline-icon {
  background: var(--pino-green);
  color: white;
  box-shadow: 0 0 0 4px rgba(27, 138, 74, 0.2);
}

/* Ripple */
.ripple-btn { position: relative; overflow: hidden; }
.ripple-btn .ripple {
  position: absolute;
  border-radius: 50%;
  background: rgba(255, 255, 255, 0.4);
  transform: scale(0);
  animation: ripple-anim 0.6s linear;
  pointer-events: none;
}
@keyframes ripple-anim { to { transform: scale(4); opacity: 0; } }

/* WhatsApp float */
.whatsapp-float {
  animation: pulse-wa 2.5s ease-in-out infinite;
}
@keyframes pulse-wa {
  0%, 100% { box-shadow: 0 4px 20px rgba(37, 211, 102, 0.4); }
  50% { box-shadow: 0 4px 32px rgba(37, 211, 102, 0.65); }
}

/* Mobile menu */
.mobile-menu {
  transform: translateX(100%);
  transition: transform 0.4s var(--ease-out);
}
.mobile-menu.open { transform: translateX(0); }
.hamburger-line { transition: transform 0.3s, opacity 0.3s; }
.hamburger.active .hamburger-line:nth-child(1) { transform: translateY(7px) rotate(45deg); }
.hamburger.active .hamburger-line:nth-child(2) { opacity: 0; }
.hamburger.active .hamburger-line:nth-child(3) { transform: translateY(-7px) rotate(-45deg); }

/* Loader */
.page-loader { transition: opacity 0.5s, visibility 0.5s; }
.page-loader.hidden { opacity: 0; visibility: hidden; }

/* Counter */
.counter-value { font-variant-numeric: tabular-nums; }

/* Form */
.form-input:focus {
  outline: none;
  border-color: var(--pino-green);
  box-shadow: 0 0 0 3px rgba(27, 138, 74, 0.15);
}

/* Map */
.map-container {
  background: linear-gradient(135deg, #d4ecd9 0%, #b8dfc4 100%);
}

/* News card */
.news-card:hover .news-img { transform: scale(1.04); }
.news-img { transition: transform 0.5s var(--ease-out); }

/* Visit CTA band */
.visit-band {
  background: linear-gradient(135deg, var(--pino-green-dark) 0%, var(--pino-green) 50%, #2DA55E 100%);
}

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    animation-duration: 0.01ms !important;
    transition-duration: 0.01ms !important;
  }
  .reveal, .reveal-left, .reveal-right { opacity: 1; transform: none; }
}