/* ═══════════════════════════════════════════════════════════════
   Adsgenix Design System — Tokens, Typography, Layout
   Scoped inside #page-landing to avoid conflicts with app CSS
   ═══════════════════════════════════════════════════════════════ */

/* ── Design tokens (scoped to landing) ──────────────────────── */
#page-landing {
  --bg:    #07090d;
  --bg-1:  #0b0e14;
  --bg-2:  #10141c;
  --bg-3:  #161b25;
  --line:  #1c2230;
  --line-bright: #2a3245;
  --ink-1: #edf0f6;
  --ink-2: #a8afbd;
  --ink-3: #6b7383;
  --ink-4: #3f4656;
  --accent:      #4f8cff;
  --accent-ink:  #b9d1ff;
  --accent-glow: rgba(79,140,255,0.22);
  --signal: #7ef0c4;
  --warn:   #ffb347;
  --radius-s: 8px;
  --radius-m: 14px;
  --radius-l: 22px;
  --ease: cubic-bezier(.2,.7,.2,1);
}

/* ── Base reset for landing scope ───────────────────────────── */
#page-landing {
  font-family: 'Geist', ui-sans-serif, system-ui, sans-serif;
  font-weight: 400;
  font-feature-settings: "ss01","cv11";
  letter-spacing: -0.005em;
  line-height: 1.55;
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
  background: var(--bg);
  color: var(--ink-1);
  overflow-x: hidden;
}

/* ── Subtle page grain ──────────────────────────────────────── */
.ld-grain {
  position: fixed;
  inset: 0;
  pointer-events: none;
  z-index: 1;
  background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 200 200' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.8' numOctaves='2'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='0.5'/%3E%3C/svg%3E");
  opacity: .04;
  mix-blend-mode: overlay;
}

/* ── Aurora ─────────────────────────────────────────────────── */
.ld-aurora {
  position: fixed;
  inset: 0;
  z-index: 0;
  pointer-events: none;
  overflow: hidden;
}
.ld-aurora::before, .ld-aurora::after {
  content: "";
  position: absolute;
  border-radius: 50%;
  filter: blur(120px);
}
.ld-aurora::before {
  width: 900px; height: 900px;
  background: radial-gradient(circle, rgba(79,140,255,0.12), transparent 60%);
  top: -300px; left: 50%; transform: translateX(-50%);
}
.ld-aurora::after {
  width: 700px; height: 700px;
  background: radial-gradient(circle, rgba(126,240,196,0.05), transparent 70%);
  bottom: -400px; right: -200px;
}

/* ── Typography scale ───────────────────────────────────────── */
#page-landing .ld-eyebrow {
  font-family: 'Geist Mono', ui-monospace, monospace;
  font-size: 11px;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--ink-3);
  font-weight: 500;
}
#page-landing .ld-display {
  font-size: clamp(48px, 7.2vw, 104px);
  font-weight: 400;
  letter-spacing: -0.045em;
  line-height: 0.96;
}
#page-landing .ld-display em {
  font-family: 'Instrument Serif', serif;
  font-style: italic;
  font-weight: 400;
  letter-spacing: -0.01em;
}
#page-landing h2.ld-h2 {
  font-size: clamp(32px, 4.2vw, 56px);
  letter-spacing: -0.035em;
  line-height: 1.02;
  font-weight: 500;
}
#page-landing h2.ld-h2 em,
#page-landing h3.ld-h3 em {
  font-family: 'Instrument Serif', serif;
  font-style: italic;
  font-weight: 400;
  letter-spacing: -0.01em;
}
#page-landing h3.ld-h3 {
  font-size: 22px;
  font-weight: 500;
  letter-spacing: -0.02em;
}
#page-landing .ld-lead {
  font-size: 18px;
  color: var(--ink-2);
  line-height: 1.55;
  max-width: 56ch;
}
#page-landing .ld-mono {
  font-family: 'Geist Mono', ui-monospace, monospace;
  font-size: 12px;
  letter-spacing: 0;
}

/* ── Layout ─────────────────────────────────────────────────── */
#page-landing .ld-wrap {
  max-width: 1280px;
  margin: 0 auto;
  padding: 0 32px;
  position: relative;
  z-index: 2;
}
#page-landing .ld-wrap-narrow {
  max-width: 980px;
  margin: 0 auto;
  padding: 0 32px;
  position: relative;
  z-index: 2;
}
#page-landing section { position: relative; z-index: 2; }
#page-landing .ld-divider { height: 1px; background: var(--line); width: 100%; }

/* ── Reveal animation ───────────────────────────────────────── */
#page-landing .reveal {
  opacity: 0;
  transform: translateY(24px);
  transition: opacity .8s var(--ease), transform .8s var(--ease);
}
#page-landing .reveal.in { opacity: 1; transform: translateY(0); }
#page-landing .reveal.d1 { transition-delay: .08s; }
#page-landing .reveal.d2 { transition-delay: .16s; }
#page-landing .reveal.d3 { transition-delay: .24s; }
#page-landing .reveal.d4 { transition-delay: .32s; }

/* ── Animations ─────────────────────────────────────────────── */
@keyframes ld-blink { 50% { opacity: .4; } }
@keyframes ld-floaty { 0%,100%{transform:translateY(0)}50%{transform:translateY(-12px)} }

/* ── Reduced motion ─────────────────────────────────────────── */
@media (prefers-reduced-motion: reduce) {
  #page-landing .reveal {
    opacity: 1 !important;
    transform: none !important;
    transition-duration: .01ms !important;
  }
  #page-landing * { animation-duration: .01ms !important; }
}