/* Shared styles for /services/* pages.
   Mirrors Homepage.html chrome (reveal, lift, cursor glow hooks) and adds
   service-page primitives: section rhythm, eyebrows, soft cards, CTA strip. */

html { overflow-x: clip; overflow-y: visible; }
body { margin: 0; background: #fff; overflow-x: clip; overflow-y: visible; }
body {
  font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
  color: #101828; -webkit-font-smoothing: antialiased;
}
input, button, select, textarea { font-family: inherit; }
a { color: inherit; }
::selection { background: rgba(30,87,214,0.2); }

/* Cursor glow (matches homepage) */
.cursor-glow {
  position: fixed; top: 0; left: 0; width: 520px; height: 520px;
  border-radius: 50%; pointer-events: none; z-index: 5;
  background: radial-gradient(circle, var(--glow-color, rgba(30,87,214,0.18)) 0%, transparent 62%);
  transform: translate(-50%, -50%);
  mix-blend-mode: multiply;
  opacity: var(--glow-intensity, 0);
}

/* Reveal */
.reveal { opacity: 0; transform: translateY(24px);
  transition: opacity 700ms cubic-bezier(0.16,1,0.3,1), transform 700ms cubic-bezier(0.16,1,0.3,1); }
.reveal.in { opacity: 1; transform: translateY(0); }
.reveal.delay-1 { transition-delay: 80ms; }
.reveal.delay-2 { transition-delay: 160ms; }
.reveal.delay-3 { transition-delay: 240ms; }
.reveal.delay-4 { transition-delay: 320ms; }
.reveal.delay-5 { transition-delay: 400ms; }

.lift { transition: transform 180ms cubic-bezier(0.16,1,0.3,1), box-shadow 180ms cubic-bezier(0.16,1,0.3,1); }
.lift:hover { transform: translateY(-2px); }

/* Keyframes reused across service pages */
@keyframes orbit { from { transform: rotate(0deg); } to { transform: rotate(360deg); } }
@keyframes counter-orbit { from { transform: rotate(0deg); } to { transform: rotate(-360deg); } }
@keyframes float { 0%,100% { transform: translateY(0); } 50% { transform: translateY(-8px); } }
@keyframes shimmer { 0% { background-position: -200% 0; } 100% { background-position: 200% 0; } }
@keyframes pulse-dot { 0%,100% { box-shadow: 0 0 0 0 rgba(18,183,106,0.55); }
                       70% { box-shadow: 0 0 0 10px rgba(18,183,106,0); }
                       100% { box-shadow: 0 0 0 0 rgba(18,183,106,0); } }
@keyframes scan { 0% { transform: translateY(-100%); } 100% { transform: translateY(100%); } }
@keyframes marquee { from { transform: translateX(0); } to { transform: translateX(-50%); } }
@keyframes dash-flow { to { stroke-dashoffset: -40; } }
@keyframes wave { 0%,100% { transform: translateX(0); } 50% { transform: translateX(-40px); } }

/* Service page accent */
:root {
  --sp-blue-primary: #1E57D6;
  --sp-blue-dark: #1846B0;
  --sp-blue-soft: #EFF6FF;
  --sp-ink: #0B1220;
  --sp-muted: #475467;
  --sp-hair: #eaecf0;
  --sp-subtle: #f9fafb;
}