/* Postafly — custom styles beyond Tailwind utilities */

/* Smooth scrolling */
html {
  scroll-behavior: smooth;
}

/* Hero dark section gradient mesh */
.hero-gradient {
  background-color: #0b0e14;
  background-image:
    radial-gradient(ellipse 80% 60% at 90% 10%, rgba(99, 102, 241, 0.18) 0%, transparent 60%),
    radial-gradient(ellipse 60% 50% at 10% 90%, rgba(99, 102, 241, 0.1) 0%, transparent 55%);
}

/* Subtle grid pattern overlay on hero */
.hero-grid {
  background-image:
    linear-gradient(rgba(99, 102, 241, 0.04) 1px, transparent 1px),
    linear-gradient(90deg, rgba(99, 102, 241, 0.04) 1px, transparent 1px);
  background-size: 48px 48px;
}

/* Dashboard mockup bar chart bars */
.chart-bar {
  animation: growBar 0.8s ease-out forwards;
  transform-origin: bottom;
  transform: scaleY(0);
}

@keyframes growBar {
  to {
    transform: scaleY(1);
  }
}

.chart-bar:nth-child(1) { animation-delay: 0.1s; }
.chart-bar:nth-child(2) { animation-delay: 0.2s; }
.chart-bar:nth-child(3) { animation-delay: 0.3s; }
.chart-bar:nth-child(4) { animation-delay: 0.4s; }
.chart-bar:nth-child(5) { animation-delay: 0.5s; }
.chart-bar:nth-child(6) { animation-delay: 0.6s; }
.chart-bar:nth-child(7) { animation-delay: 0.7s; }

/* Shield graphic glow */
.shield-glow {
  background: radial-gradient(circle, rgba(99, 102, 241, 0.15) 0%, rgba(99, 102, 241, 0.05) 50%, transparent 70%);
}

/* Pricing featured card glow */
.pricing-featured {
  box-shadow: 0 0 0 2px #6366f1, 0 20px 40px -12px rgba(99, 102, 241, 0.25);
}

/* Form focus ring consistency */
.form-input:focus {
  outline: none;
  border-color: #6366f1;
  box-shadow: 0 0 0 3px rgba(99, 102, 241, 0.15);
}

/* Mobile menu slide animation */
.mobile-menu {
  max-height: 0;
  overflow: hidden;
  transition: max-height 0.3s ease-out;
}

.mobile-menu.open {
  max-height: 320px;
}

/* Nav active pill */
.nav-active {
  background-color: rgba(99, 102, 241, 0.1);
  color: #4f46e5;
}