/* GPDix Design System - Professional Finance & Investment Theme */

/* Premium Gradients */
.bg-gradient-primary {
  background: linear-gradient(135deg, hsl(215 85% 15%), hsl(215 75% 25%));
}

.bg-gradient-accent {
  background: linear-gradient(135deg, hsl(215 8% 70%), hsl(215 6% 80%));
}

.bg-gradient-surface {
  background: linear-gradient(180deg, hsl(0 0% 100%), hsl(215 5% 98%));
}

.bg-gradient-hero {
  background: linear-gradient(135deg, hsl(215 85% 15%) 0%, hsl(215 75% 25%) 50%, hsl(215 65% 35%) 100%);
}

/* Elegant Shadows */
.shadow-soft {
  box-shadow: 0 2px 8px -2px hsl(215 25% 15% / 0.08);
}

.shadow-medium {
  box-shadow: 0 4px 16px -4px hsl(215 25% 15% / 0.12);
}

.shadow-large {
  box-shadow: 0 8px 32px -8px hsl(215 25% 15% / 0.16);
}

.shadow-premium {
  box-shadow: 0 16px 64px -16px hsl(215 25% 15% / 0.24);
}

/* Professional Transitions */
.transition-smooth {
  transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}

.transition-elegant {
  transition: all 0.4s cubic-bezier(0.25, 0.46, 0.45, 0.94);
}

/* Premium Typography */
.text-gradient-accent {
  background: linear-gradient(135deg, hsl(215 8% 70%), hsl(215 6% 80%));
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
}

/* Button Styles */
.btn-link-primary {
  @apply text-primary-foreground font-semibold text-lg px-6 py-3 transition-all duration-300 relative;
  color: hsl(215 8% 85%);
  text-decoration: none;
  border-bottom: 2px solid transparent;
}

.btn-link-primary::after {
  content: '';
  position: absolute;
  bottom: -2px;
  left: 0;
  width: 0;
  height: 2px;
  background: linear-gradient(90deg, hsl(215 8% 85%), hsl(215 6% 90%));
  transition: width 0.3s ease;
}

.btn-link-primary:hover {
  color: hsl(215 8% 95%);
  transform: translateY(-1px);
}

.btn-link-primary:hover::after {
  width: 100%;
}

.btn-link-secondary {
  @apply text-primary-foreground/80 font-semibold text-lg px-6 py-3 transition-all duration-300 relative;
  color: hsl(215 8% 70%);
  text-decoration: none;
  border-bottom: 2px solid transparent;
}

.btn-link-secondary::after {
  content: '';
  position: absolute;
  bottom: -2px;
  left: 0;
  width: 0;
  height: 2px;
  background: linear-gradient(90deg, hsl(215 8% 70%), hsl(215 6% 75%));
  transition: width 0.3s ease;
}

.btn-link-secondary:hover {
  color: hsl(215 8% 90%);
  transform: translateY(-1px);
}

.btn-link-secondary:hover::after {
  width: 100%;
}

.btn-consultation {
  @apply text-primary-foreground font-semibold px-8 py-4 rounded-xl transition-all duration-300;
  background: linear-gradient(135deg, hsl(215 85% 15%) 0%, hsl(215 75% 25%) 50%, hsl(215 65% 35%) 100%);
  box-shadow: 0 8px 32px -8px hsl(215 25% 15% / 0.25);
  border: 1px solid hsl(215 85% 20%);
  font-size: 1.125rem;
  letter-spacing: 0.025em;
  position: relative;
  overflow: hidden;
}

.btn-accent {
  @apply bg-gradient-to-r from-accent to-accent/80 text-accent-foreground font-semibold px-6 py-3 rounded-lg hover:shadow-medium transition-elegant hover:scale-105;
}

.btn-outline-premium {
  @apply border border-primary-foreground/30 text-primary-foreground font-semibold px-6 py-3 rounded-lg hover:bg-primary-foreground hover:text-primary transition-elegant;
}

.btn-premium {
  @apply bg-gradient-primary text-primary-foreground font-semibold px-6 py-3 rounded-lg hover:shadow-large transition-elegant hover:scale-105;
}

.btn-ghost {
  @apply text-foreground/80 hover:text-foreground hover:bg-muted px-3 py-2 rounded-lg transition-smooth;
}

.btn-lg {
  @apply text-lg px-8 py-4 h-auto;
}

/* Card Styles */
.card-service {
  @apply p-8 bg-card hover:shadow-large transition-elegant group animate-scale-in border border-border/50 rounded-lg;
}

.card-value {
  @apply p-6 bg-card shadow-medium border border-border/50 rounded-lg;
}

.card-value-primary {
  @apply p-6 bg-gradient-primary text-primary-foreground shadow-large rounded-lg;
}

.card-team {
  @apply p-8 text-center bg-card hover:shadow-large transition-elegant group animate-scale-in border border-border/50 rounded-lg;
}

.card-contact {
  @apply p-8 bg-card shadow-large border border-border/50 rounded-lg;
}

.card-contact-primary {
  @apply p-6 bg-gradient-primary text-primary-foreground shadow-large rounded-lg;
}

.card-contact-info {
  @apply p-6 bg-card shadow-medium border border-border/50 rounded-lg;
}

/* Input Styles */
.input-field {
  @apply w-full px-4 py-3 bg-background border border-border/50 rounded-lg text-foreground placeholder:text-muted-foreground focus:outline-none focus:ring-2 focus:ring-ring focus:border-transparent transition-smooth;
}

.textarea-field {
  @apply w-full px-4 py-3 bg-background border border-border/50 rounded-lg text-foreground placeholder:text-muted-foreground focus:outline-none focus:ring-2 focus:ring-ring focus:border-transparent transition-smooth resize-none;
}

/* Navigation Styles */
.nav-scrolled {
  @apply bg-background/95 backdrop-blur-md border-b border-border shadow-soft;
}

.nav-default {
  @apply bg-primary/20 backdrop-blur-sm shadow-soft;
}

/* Mobile Menu Styles */
.mobile-menu {
  @apply fixed top-0 left-0 right-0 bottom-0 bg-background/95 backdrop-blur-md z-40 transform translate-x-full transition-transform duration-300;
}

.mobile-menu.open {
  @apply translate-x-0;
}

/* Toast Notification Styles */
.toast {
  @apply fixed top-4 right-4 bg-card border border-border rounded-lg shadow-large p-4 z-50 transform translate-x-full transition-transform duration-300;
}

.toast.show {
  @apply translate-x-0;
}

.toast.success {
  @apply border-green-500 bg-green-50;
}

.toast.error {
  @apply border-red-500 bg-red-50;
}

/* Responsive Utilities */
@media (max-width: 768px) {
  .mobile-hidden {
    display: none;
  }
  
  .mobile-visible {
    display: block;
  }
}

/* Custom Scrollbar */
::-webkit-scrollbar {
  width: 8px;
}

::-webkit-scrollbar-track {
  background: hsl(215 10% 95%);
}

::-webkit-scrollbar-thumb {
  background: hsl(215 15% 55%);
  border-radius: 4px;
}

::-webkit-scrollbar-thumb:hover {
  background: hsl(215 15% 45%);
}

/* Focus Styles */
.focus-visible {
  @apply focus:outline-none focus:ring-2 focus:ring-ring focus:ring-offset-2;
}

/* Loading States */
.loading {
  @apply opacity-50 pointer-events-none;
}

/* Animation Delays */
.animate-delay-100 {
  animation-delay: 0.1s;
}

.animate-delay-200 {
  animation-delay: 0.2s;
}

.animate-delay-300 {
  animation-delay: 0.3s;
}

.animate-delay-400 {
  animation-delay: 0.4s;
}

.animate-delay-500 {
  animation-delay: 0.5s;
}

/* Print Styles */
@media print {
  .no-print {
    display: none !important;
  }
  
  body {
    background: white !important;
    color: black !important;
  }
}
