/* ─── AJAIA Enterprise — Page-level styles ───────────────────────── */

*, *::before, *::after { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body {
  background: #07103a;
  color: var(--ink-ink);
  overflow-x: hidden;
}

/* Helper to expose a CSS-var color from inline mouse handlers */
[style] { /* no-op */ }

/* Smooth reveal default state */
.reveal {
  opacity: 0;
  transform: translateY(24px);
  transition: opacity 700ms var(--ease), transform 700ms var(--ease);
  will-change: opacity, transform;
}
.reveal.in {
  opacity: 1;
  transform: none;
}
.reveal[data-delay="1"]{ transition-delay: 80ms; }
.reveal[data-delay="2"]{ transition-delay: 160ms; }
.reveal[data-delay="3"]{ transition-delay: 240ms; }
.reveal[data-delay="4"]{ transition-delay: 320ms; }
.reveal[data-delay="5"]{ transition-delay: 400ms; }

/* Noise overlay used on dark surfaces */
.noise {
  position: absolute; inset: 0; pointer-events: none;
  background-image: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0naHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmcnIHdpZHRoPScxNjAnIGhlaWdodD0nMTYwJz48ZmlsdGVyIGlkPSduJz48ZmVUdXJidWxlbmNlIHR5cGU9J2ZyYWN0YWxOb2lzZScgYmFzZUZyZXF1ZW5jeT0nMC45JyBudW1PY3RhdmVzPScyJyBzdGl0Y2hUaWxlcz0nc3RpdGNoJy8+PGZlQ29sb3JNYXRyaXggdmFsdWVzPScwIDAgMCAwIDEgICAwIDAgMCAwIDEgICAwIDAgMCAwIDEgIDAgMCAwIDAuNTUgMCcvPjwvZmlsdGVyPjxyZWN0IHdpZHRoPScxMDAlJyBoZWlnaHQ9JzEwMCUnIGZpbHRlcj0ndXJsKCNuKScgb3BhY2l0eT0nMC41Jy8+PC9zdmc+");
  opacity: 0.08;
  mix-blend-mode: overlay;
}

/* Grid background for dark sections */
.grid-bg {
  position: absolute; inset: 0; pointer-events: none;
  background-image:
    linear-gradient(to right, rgba(151,194,247,0.06) 1px, transparent 1px),
    linear-gradient(to bottom, rgba(151,194,247,0.06) 1px, transparent 1px);
  background-size: 64px 64px;
  mask-image: radial-gradient(ellipse at 50% 0%, #000 0%, transparent 70%);
}

/* Hero ambient glow */
.hero-glow {
  position: absolute; inset: 0; pointer-events: none; overflow: hidden;
}
.hero-glow::before, .hero-glow::after {
  content: ""; position: absolute; border-radius: 50%;
  filter: blur(120px); opacity: 0.45;
}
.hero-glow::before {
  width: 720px; height: 720px;
  left: -180px; top: -220px;
  background: radial-gradient(circle, #2a4cff 0%, transparent 70%);
}
.hero-glow::after {
  width: 720px; height: 720px;
  right: -160px; top: 120px;
  background: radial-gradient(circle, #3b6df5 0%, transparent 70%);
  opacity: 0.35;
}

/* CTA shine effect */
.aj-cta { transition: transform var(--dur) var(--ease), filter var(--dur) var(--ease); }
.aj-cta::before {
  content: ""; position: absolute; top: 0; left: -40%;
  width: 40%; height: 100%;
  background: linear-gradient(120deg, transparent 0%, rgba(255,255,255,0.35) 50%, transparent 100%);
  transform: skewX(-20deg);
  transition: left 600ms var(--ease);
  pointer-events: none;
}
.aj-cta:hover::before { left: 110%; }
.aj-cta:hover { transform: translateY(-1px); }
.aj-cta:active { transform: scale(0.985); }

/* Card hover lift */
.lift {
  transition: transform 280ms var(--ease), box-shadow 280ms var(--ease), border-color 280ms var(--ease), background 280ms var(--ease);
}
.lift:hover { transform: translateY(-3px); }

/* Float keyframes */
@keyframes float-1 { 0%,100% { transform: translateY(0) } 50% { transform: translateY(-12px) } }
@keyframes float-2 { 0%,100% { transform: translateY(0) } 50% { transform: translateY(-8px) } }
@keyframes float-3 { 0%,100% { transform: translateY(0) } 50% { transform: translateY(-16px) } }
.float-1 { animation: float-1 7s ease-in-out infinite; }
.float-2 { animation: float-2 9s ease-in-out infinite 0.5s; }
.float-3 { animation: float-3 11s ease-in-out infinite 1s; }

/* Pulse dot */
@keyframes pulse-dot {
  0%, 100% { box-shadow: 0 0 0 0 rgba(151,194,247,0.6); }
  50%      { box-shadow: 0 0 0 8px rgba(151,194,247,0); }
}
.pulse-dot { animation: pulse-dot 2.4s ease-in-out infinite; }

/* Marquee ticker */
@keyframes marquee { from { transform: translateX(0) } to { transform: translateX(-50%) } }
.marquee-track { animation: marquee 40s linear infinite; }

/* Card flip core */
.flip-card {
  perspective: 1400px;
  transform-style: preserve-3d;
}
.flip-inner {
  position: relative; width: 100%; height: 100%;
  transform-style: preserve-3d;
  transition: transform 900ms cubic-bezier(0.22, 1, 0.36, 1);
}
.flip-card.flipped .flip-inner { transform: rotateY(180deg); }
.flip-face {
  position: absolute; inset: 0;
  backface-visibility: hidden;
  -webkit-backface-visibility: hidden;
  overflow: hidden;
}
.flip-back { transform: rotateY(180deg); }

/* Accordion */
details summary { list-style: none; cursor: pointer; }
details summary::-webkit-details-marker { display: none; }
.faq-row[open] .faq-icon { transform: rotate(45deg); }
.faq-icon { transition: transform 280ms var(--ease); }

/* Selection */
::selection { background: rgba(151,194,247,0.35); color: white; }

/* Scrollbar (subtle, dark) */
::-webkit-scrollbar { width: 10px; height: 10px; }
::-webkit-scrollbar-thumb { background: rgba(255,255,255,0.08); border-radius: 4px; }
::-webkit-scrollbar-thumb:hover { background: rgba(255,255,255,0.15); }

/* Utility classes */
.container {
  max-width: 1280px;
  margin: 0 auto;
  padding: 0 48px;
}
@media (max-width: 900px) {
  .container { padding: 0 24px; }
}

/* Glass surfaces */
.glass-dark {
  background: linear-gradient(180deg, rgba(255,255,255,0.04) 0%, rgba(255,255,255,0.02) 100%);
  border: 1px solid rgba(255,255,255,0.08);
  backdrop-filter: blur(16px);
  -webkit-backdrop-filter: blur(16px);
}
.glass-dark:hover { border-color: rgba(151,194,247,0.28); background: linear-gradient(180deg, rgba(151,194,247,0.06) 0%, rgba(255,255,255,0.02) 100%); }

.glass-light {
  background: rgba(255,255,255,0.7);
  border: 1px solid rgba(0,29,107,0.08);
  backdrop-filter: blur(12px);
}

/* Number tickers */
.num-tabular { font-variant-numeric: tabular-nums; }

/* Responsive helpers */
@media (max-width: 1100px) { .hide-md-down { display: none !important; } }
@media (max-width: 760px)  { .hide-sm-down { display: none !important; } }

/* Hero typography responsive */
@media (max-width: 900px) {
  .hero-title { font-size: 44px !important; line-height: 1.05 !important; }
  .h1 { font-size: 36px !important; line-height: 1.1 !important; }
  .h2 { font-size: 30px !important; }
  .h3 { font-size: 24px !important; }
}

/* Tweaks panel sits above content */
.tweaks-host { position: fixed; bottom: 24px; right: 24px; z-index: 1000; }

/* ─── Mobile responsive overrides ────────────────────────────────── */

/* Tablet (≤ 1024px) */
@media (max-width: 1024px) {
  .container { padding: 0 32px; }
  .aj-nav-inner { padding: 0 32px !important; gap: 24px !important; }
  /* Section vertical padding crunch */
  section { padding-top: 88px !important; padding-bottom: 88px !important; }
  /* Footer column grid → 2x2 */
  .aj-footer-cols { grid-template-columns: 1fr 1fr !important; gap: 40px !important; }
}

/* Small tablet / large phone (≤ 760px) */
@media (max-width: 760px) {
  .container { padding: 0 20px; }
  .aj-nav-inner { padding: 0 20px !important; gap: 16px !important; }
  section { padding-top: 64px !important; padding-bottom: 64px !important; }

  /* Type scale down */
  .hero-title { font-size: 38px !important; line-height: 1.06 !important; }
  .h1 { font-size: 30px !important; line-height: 1.12 !important; }
  .h2 { font-size: 28px !important; line-height: 1.15 !important; }
  .h3 { font-size: 22px !important; line-height: 1.2 !important; }
  section h2 { font-size: 28px !important; line-height: 1.15 !important; }
  section h2[style*="font-size: 44px"],
  section h2[style*="font-size: 42px"],
  section h2[style*="font-size: 48px"] { font-size: 28px !important; line-height: 1.15 !important; }

  /* Hero — pull padding in, hide right visual if cramped */
  section[style*="radial-gradient(ellipse 90% 70%"] {
    padding-top: 100px !important; padding-bottom: 64px !important;
  }

  /* Anchor sticky bar — allow horizontal scroll */
  div[style*="position: sticky"][style*="top: 68px"] .container {
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: none;
  }
  div[style*="position: sticky"][style*="top: 68px"] .container::-webkit-scrollbar { display: none; }

  /* Footer CTA band → stack */
  .aj-footer-cta { grid-template-columns: 1fr !important; padding: 28px !important; gap: 20px !important; }
  .aj-footer-cols { grid-template-columns: 1fr 1fr !important; gap: 32px !important; margin-top: 48px !important; }

  /* Included right grid → 1 col */
  .included-right-grid { grid-template-columns: 1fr !important; }

  /* WhyAjaia stat triplet → row of 3 stays, or wraps */
  .why-stats-grid { grid-template-columns: 1fr 1fr 1fr !important; gap: 8px !important; }
  .why-stats-grid > div { padding: 22px 16px !important; }
  .why-stats-grid > div > div:nth-child(2) { font-size: 32px !important; }
  .why-stats-grid > div > div:nth-child(3) { font-size: 10px !important; }

  /* Mid-CTA banner padding */
  .mid-cta-grid { padding: 32px 22px !important; gap: 24px !important; }

  /* Final CTA banner padding */
  .final-cta-band { padding: 40px 24px !important; }
  .final-cta-band h2 { font-size: 30px !important; line-height: 1.08 !important; }

  /* Solution + Compare + FAQ sticky → release */
  .sol-grid > div:first-child,
  .faq-grid > div:first-child,
  .compare-rail { position: static !important; }

  /* Problem dashboard floating delta chip → reposition inside */
  .prob-grid .float-2[style*="right: -22px"] { right: 8px !important; top: 16px !important; }

  /* Compare row middle column not hidden — keep visible */
  .compare-row { grid-template-columns: auto 1fr !important; }
  .compare-row > div:last-child { display: none !important; }

  /* Method tile size */
  .method-tile { width: 60px !important; height: 60px !important; }

  /* Section header padding */
  section[style*="padding: 112px"],
  section[style*="padding: 120px"],
  section[style*="padding: 128px"] {
    padding: 64px 0 !important;
  }

  /* Cards: reduce internal padding */
  .lift[style*="padding: 44px"] { padding: 28px 24px !important; }
  .lift[style*="padding: 32px 36px"] { padding: 24px !important; }
  .lift[style*="padding: \"32px\""] { padding: 24px !important; }

  /* Stack section ribbon */
  section .lift + div[style*="padding: 24px 32px"],
  div[style*="padding: 24px 32px"][style*="flex-wrap: wrap"] {
    padding: 20px !important;
  }

  /* Solution card grid cell */
  .sol-grid > div:last-child > div { grid-template-columns: 1fr !important; gap: 14px !important; }
  .sol-grid > div:last-child > div > div[style*="width: 56px"] { width: 44px !important; height: 44px !important; }
}

/* Phone (≤ 520px) */
@media (max-width: 520px) {
  .container { padding: 0 16px; }
  .aj-nav-inner { padding: 0 16px !important; gap: 12px !important; }

  section { padding-top: 56px !important; padding-bottom: 56px !important; }

  .hero-title { font-size: 32px !important; }
  section h2 { font-size: 24px !important; }
  .final-cta-band h2 { font-size: 26px !important; }

  /* WhyAjaia stats → 1 col */
  .why-stats-grid { grid-template-columns: 1fr !important; }

  /* Footer columns → 1 col */
  .aj-footer-cols { grid-template-columns: 1fr !important; gap: 28px !important; }

  /* Hero visual lower height */
  .hero-visual { height: 380px !important; }

  /* FAQ summary smaller */
  .faq-row summary { font-size: 15px !important; gap: 14px !important; }

  /* Reduce big stat numbers */
  div[style*="font-size: 56px"][class*="num-tabular"] { font-size: 40px !important; }
  div[style*="font-size: 72px"][class*="num-tabular"] { font-size: 44px !important; }

  /* CaseStats card → stack stat + content */
  .case-grid a { grid-template-columns: 1fr !important; gap: 16px !important; padding: 24px !important; }

  /* Stats strip cells get fully wrapped */
  .stats-strip { padding: 16px !important; }

  /* Compare rows tighter */
  .compare-row { padding: 16px !important; gap: 10px !important; }
}

/* Very small (≤ 380px) */
@media (max-width: 380px) {
  .hero-title { font-size: 28px !important; }
  section h2 { font-size: 22px !important; }
  .final-cta-band h2 { font-size: 22px !important; }
}