html {
  scroll-behavior: smooth;
}

::-webkit-scrollbar {
  width: 8px;
}

::-webkit-scrollbar-track {
  background: #0a0a16;
}

::-webkit-scrollbar-thumb {
  background: #0927eb;
  border-radius: 4px;
}

::-webkit-scrollbar-thumb:hover {
  background: #0ea5e9;
}

.glass {
  background: rgba(255, 255, 255, 0.03);
  backdrop-filter: blur(12px);
  border: 1px solid rgba(255, 255, 255, 0.1);
}

.glow-primary {
  box-shadow: 0 0 20px rgba(9, 39, 235, 0.4);
}

.text-gradient {
  background: linear-gradient(to right, #0927eb, #0ea5e9);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
}

.bg-mesh {
  background-image:
    radial-gradient(circle at 50% -20%, #0927eb33, transparent 50%),
    radial-gradient(circle at 0% 100%, #0ea5e922, transparent 40%);
}

select option {
  background-color: #1a1a2e;
  color: #ffffff;
}

select option:hover {
  background-color: #0927eb;
}

/* Page Loader */
#page-loader {
  transition: opacity 0.5s ease-out, visibility 0.5s ease-out;
}

#page-loader.hidden {
  opacity: 0;
  visibility: hidden;
}

/* Prevent scrolling while loading */
body.loading {
  overflow: hidden;
}

/* Tablet-specific optimizations */
@media (min-width: 768px) and (max-width: 1024px) {
  /* Better touch targets for tablets */
  button,
  a {
    min-height: 44px;
    min-width: 44px;
  }

  /* Optimize header for tablets */
  header {
    backdrop-filter: blur(20px);
  }

  header .max-w-7xl {
    padding-left: 1.5rem;
    padding-right: 1.5rem;
  }

  /* Optimize navigation for tablets */
  header nav {
    gap: 1.5rem;
  }

  header nav button,
  header nav a {
    padding: 0.75rem 1rem;
    font-size: 0.9375rem;
  }

  /* Better spacing for service cards on tablets */
  .glass {
    backdrop-filter: blur(16px);
  }

  /* Optimize carousel controls for touch */
  [x-data="portfolioCarousel"] button,
  [x-data="testimonialsCarousel"] button {
    min-height: 48px;
    min-width: 48px;
  }

  /* Better form inputs for tablets */
  input,
  select,
  textarea {
    font-size: 16px; /* Prevents zoom on iOS */
  }

  /* Optimize modal for tablets */
  .fixed.inset-0 .glass {
    max-width: 90vw;
  }

  /* Adjust main padding for taller header */
  main {
    padding-top: 6rem; /* 96px para header de 24 */
  }
}

/* iPad Pro specific (1024x1366) */
@media (min-width: 1024px) and (max-width: 1366px) and (orientation: portrait) {
  .max-w-7xl {
    max-width: 90%;
  }
}

/* iPad landscape mode */
@media (min-width: 768px) and (max-width: 1024px) and (orientation: landscape) {
  section {
    padding-top: 4rem;
    padding-bottom: 4rem;
  }

  /* Reduce hero section height in landscape */
  .bg-mesh {
    min-height: auto;
  }
}