@import url('https://fonts.googleapis.com/css2?family=Geist:wght@400;500;600;700;800;900&family=Inter:wght@300;400;500;600;700;800&family=JetBrains+Mono:wght@500;700&display=swap');

:root {
  --ff-page-bg: #040817;
  --ff-apple-black: #000;
  --ff-apple-white: #f5f5f7;
  --ff-apple-muted: #a1a1a6;
  --ff-apple-blue: #0071e3;
  --ff-apple-blue-hover: #005bbf;
  --ff-surface: #05091a;
  --ff-surface-low: #0d1c2d;
  --ff-surface-high: #1c2b3c;
  --ff-line: rgba(255,255,255,.12);
  --ff-glass: linear-gradient(145deg, rgba(24,34,68,.82), rgba(5,9,27,.94));
}

html,
body,
button,
input,
select,
textarea,
a {
  font-family: "Inter", "Geist", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif !important;
  letter-spacing: 0 !important;
}

body {
  background: var(--ff-apple-black) !important;
  color: var(--ff-apple-white) !important;
}

.font-headline-md,
.font-headline-lg,
.font-headline-lg-mobile,
.font-display-xl,
h1,
h2,
h3 {
  font-family: "Geist", "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif !important;
}

.font-label-sm,
.mono {
  font-family: "JetBrains Mono", monospace !important;
}

.bg-background,
.bg-surface,
.bg-surface-dim,
.bg-surface-container-lowest {
  background-color: var(--ff-apple-black) !important;
}

.bg-surface-container,
.bg-surface-container-low,
.bg-surface-container-high,
.glass,
.glass-card {
  background: var(--ff-glass) !important;
  border-color: rgba(151,166,255,.18) !important;
}

.text-on-background,
.text-on-surface,
.text-white {
  color: var(--ff-apple-white) !important;
}

.text-on-surface-variant,
.text-outline,
p,
li {
  color: rgba(245,245,247,.72) !important;
}

.text-primary,
.text-primary-container,
.text-primary-fixed,
.text-primary-fixed-dim,
a:hover {
  color: var(--ff-apple-blue) !important;
}

.bg-primary,
.bg-primary-container,
.bg-secondary,
.luxury-button,
.ff-start-link,
.ff-top-button {
  background: var(--ff-apple-blue) !important;
  color: #fff !important;
  border-color: rgba(0,113,227,.9) !important;
}

.luxury-button:hover,
.ff-start-link:hover,
.ff-top-button:hover {
  background: var(--ff-apple-blue-hover) !important;
}

.luxury-button-ghost,
.hero-actions .luxury-button-ghost,
.cta-actions .luxury-button-ghost,
button.luxury-button-ghost,
a.luxury-button-ghost {
  color: var(--ff-apple-blue) !important;
}

.luxury-button-ghost:hover,
.hero-actions .luxury-button-ghost:hover,
.cta-actions .luxury-button-ghost:hover {
  color: var(--ff-apple-blue-hover) !important;
}

.solutions-heading h2,
.solutions-heading h2.text-white {
  color: var(--ff-apple-white) !important;
}

.solutions-heading h2 .text-primary-container,
.solutions-heading h2 span {
  color: var(--ff-apple-blue) !important;
}

header,
.ff-shared-header {
  background: rgba(0,0,0,.86) !important;
  border-color: rgba(255,255,255,.1) !important;
  backdrop-filter: saturate(180%) blur(20px) !important;
}

footer,
.ff-shared-footer,
.site-footer {
  
  border-color: rgba(255,255,255,.08) !important;
}