/**
 * Giturn — premium engineering layer (loads after main bundle CSS).
 * JetBrains Mono is linked from index.html alongside Cairo.
 */

:root {
  --giturn-hero-mesh: rgba(14, 165, 233, 0.08);
  --giturn-line: rgba(56, 189, 248, 0.35);
}

html {
  scroll-behavior: smooth;
}

::selection {
  background: rgba(14, 165, 233, 0.28);
  color: inherit;
}

/* —— Hero: depth, grid, subtle motion —— */
[data-testid="hero-section"] {
  position: relative;
  isolation: isolate;
}

[data-testid="hero-section"]::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 0;
  pointer-events: none;
  background-image:
    linear-gradient(rgba(15, 23, 42, 0.04) 1px, transparent 1px),
    linear-gradient(90deg, rgba(15, 23, 42, 0.04) 1px, transparent 1px);
  background-size: 48px 48px;
  mask-image: radial-gradient(ellipse 85% 70% at 50% 0%, black 20%, transparent 75%);
  opacity: 0.85;
}

[data-testid="hero-section"]::after {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 0;
  pointer-events: none;
  background: radial-gradient(ellipse 100% 60% at 50% -10%, var(--giturn-hero-mesh), transparent 55%);
  animation: giturn-hero-pulse 10s ease-in-out infinite alternate;
}

@keyframes giturn-hero-pulse {
  0% {
    opacity: 0.65;
    transform: scale(1);
  }
  100% {
    opacity: 1;
    transform: scale(1.02);
  }
}

/* Top engineering line */
[data-testid="hero-section"] {
  box-shadow: inset 0 1px 0 0 var(--giturn-line);
}

/* Badge: premium glass */
[data-testid="hero-section"] .inline-flex.items-center.gap-2.px-4.py-2.rounded-full {
  backdrop-filter: blur(12px);
  -webkit-backdrop-filter: blur(12px);
  box-shadow:
    0 0 0 1px rgba(56, 189, 248, 0.2),
    0 12px 40px -16px rgba(14, 165, 233, 0.35);
}

/* Primary CTA: stronger presence */
[data-testid="hero-section"] [data-testid="hero-cta-primary"] {
  box-shadow:
    0 0 0 1px rgba(255, 255, 255, 0.12),
    0 18px 50px -12px rgba(14, 165, 233, 0.45);
  transition: transform 0.25s ease, box-shadow 0.25s ease;
}

[data-testid="hero-section"] [data-testid="hero-cta-primary"]:hover {
  transform: translateY(-2px);
  box-shadow:
    0 0 0 1px rgba(255, 255, 255, 0.18),
    0 22px 60px -10px rgba(14, 165, 233, 0.55);
}

/* Secondary CTA */
[data-testid="hero-section"] [data-testid="hero-cta-secondary"] {
  box-shadow: 0 0 0 1px rgba(15, 23, 42, 0.12);
  transition: transform 0.2s ease, box-shadow 0.2s ease, background-color 0.2s ease;
}

[data-testid="hero-section"] [data-testid="hero-cta-secondary"]:hover {
  transform: translateY(-1px);
  box-shadow: 0 0 0 1px rgba(14, 165, 233, 0.35);
}

/* Partner strip under hero */
[data-testid="hero-section"] .pt-8.border-t {
  border-color: rgba(15, 23, 42, 0.1) !important;
}

/* —— Global: sections feel more “product / engineering” —— */
[data-testid="services-section"],
[data-testid="partners-section"],
[data-testid="why-us-section"] {
  position: relative;
}

[data-testid="services-section"]::before,
[data-testid="partners-section"]::before {
  content: "";
  position: absolute;
  left: 50%;
  top: 0;
  transform: translateX(-50%);
  width: min(720px, 90%);
  height: 1px;
  background: linear-gradient(90deg, transparent, rgba(14, 165, 233, 0.35), transparent);
  pointer-events: none;
}

/* Cards: subtle lift on hover (works with existing hover-elevate) */
[data-testid="services-section"] [data-testid^="service-card-"],
[data-testid="partners-section"] [data-testid^="partner-card-"] {
  transition: box-shadow 0.35s ease, transform 0.35s ease;
}

[data-testid="services-section"] [data-testid^="service-card-"]:hover,
[data-testid="partners-section"] [data-testid^="partner-card-"]:hover {
  box-shadow:
    0 0 0 1px rgba(14, 165, 233, 0.12),
    0 20px 50px -24px rgba(15, 23, 42, 0.2);
}

/* Monospace code decorations in hero — sharper tech read */
[data-testid="hero-section"] .font-mono {
  font-family: "JetBrains Mono", ui-monospace, monospace;
  letter-spacing: 0.02em;
}

/* Reduce motion */
@media (prefers-reduced-motion: reduce) {
  [data-testid="hero-section"]::after {
    animation: none;
  }
  [data-testid="hero-section"] [data-testid="hero-cta-primary"]:hover,
  [data-testid="hero-section"] [data-testid="hero-cta-secondary"]:hover {
    transform: none;
  }
}