:root {
  --epiora-bg: #05080d;
  --epiora-bg-mid: #05090e;
  --epiora-bg-deep: #03060a;
  --epiora-surface: #080a0e;
  --epiora-foreground: #f2f2ef;
  --epiora-muted: #9a9a97;
  --epiora-subtle: #f2f2ef6b;
  --epiora-border: #ffffff24;
  --epiora-border-subtle: #ffffff14;
  --epiora-accent: #89b5c9;
  --background: var(--epiora-bg);
  --foreground: var(--epiora-foreground);
}

.epiora-web-landing * {
  box-sizing: border-box;
  margin: 0;
  padding: 0;
}
html.epiora-web-active,
body.epiora-web-active {
  background: var(--background);
  width: 100%;
  height: 100%;
  overflow: hidden;
}
@font-face {
  font-family: Geist;
  src: url("/caa3a2e1cccd8315-s.p.0zr6hhvz-h9nw.woff2") format("woff2");
  font-weight: 400 500;
  font-display: swap;
}
body.epiora-web-active {
  color: var(--foreground);
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizelegibility;
  font-family: Geist, Inter, Helvetica, Helvetica Neue, Arial, sans-serif;
}
.epiora-web-landing a {
  color: inherit;
  text-decoration: none;
}
.hero {
  isolation: isolate;
  background: radial-gradient(circle at 12% 18%, #885a3b21, #0000 31%),
    radial-gradient(circle at 70% 38%, #305c761a, #0000 38%),
    linear-gradient(135deg, #080a0e 0%, #05090e 48%, #03060a 100%);
  width: 100vw;
  height: 100dvh;
  position: relative;
  overflow: hidden;
}
.hero:before {
  content: "";
  z-index: 0;
  filter: blur(36px);
  opacity: 0.82;
  pointer-events: none;
  background: linear-gradient(#0000 0%, #e0edf30a 20%, #b3d9ed66 44%, #578ba91a 72%, #0000 100%);
  border-radius: 999px;
  width: 170px;
  height: 118%;
  position: absolute;
  top: -44%;
  left: 33%;
  transform: rotate(43deg);
}
.hero:after {
  content: "";
  z-index: 0;
  filter: blur(24px);
  opacity: 0.66;
  pointer-events: none;
  background: linear-gradient(#0000, #dcedf638, #5d94b40f, #0000);
  border-radius: 999px;
  width: 68px;
  height: 110%;
  position: absolute;
  top: -34%;
  left: 43%;
  transform: rotate(43deg);
}
.ambient-left {
  z-index: 0;
  filter: blur(120px);
  pointer-events: none;
  background: #925b3a17;
  border-radius: 50%;
  width: 48%;
  height: 82%;
  position: absolute;
  top: -12%;
  left: -16%;
}
.ambient-center {
  z-index: 0;
  filter: blur(140px);
  pointer-events: none;
  background: #396a8512;
  border-radius: 50%;
  width: 40%;
  height: 60%;
  position: absolute;
  top: 8%;
  left: 40%;
}
#c {
  z-index: 2;
  pointer-events: none;
  background: 0 0;
  width: 100vw;
  height: 100dvh;
  display: block;
  position: absolute;
  inset: 0;
}
.page {
  z-index: 3;
  grid-template-rows: clamp(76px, 11vh, 108px) minmax(0, 1fr) clamp(96px, 14vh, 132px);
  width: min(1180px, 100% - 56px);
  height: 100%;
  margin: 0 auto;
  display: grid;
  position: relative;
}
.nav {
  justify-content: space-between;
  align-items: center;
  display: flex;
}
.brand {
  align-items: center;
  gap: 11px;
  display: inline-flex;
}
.brand img {
  object-fit: contain;
  width: 29px;
  height: 29px;
  display: block;
}
.brand-name {
  letter-spacing: -0.045em;
  color: #fffffff2;
  font-size: 20px;
  font-weight: 500;
  line-height: 1;
}
.nav-links {
  align-items: center;
  gap: 8px;
  display: flex;
}
.docs-button {
  color: #ffffffe0;
  letter-spacing: -0.012em;
  -webkit-backdrop-filter: blur(12px);
  backdrop-filter: blur(12px);
  background: #ffffff0f;
  border: 1px solid #ffffff24;
  border-radius: 10px;
  justify-content: center;
  align-items: center;
  height: 38px;
  padding: 0 16px;
  font-size: 14px;
  font-weight: 500;
  transition: background 0.18s, border-color 0.18s, color 0.18s;
  display: inline-flex;
}
.x-button {
  width: 38px;
  padding: 0;
}
.docs-button:hover {
  color: #fff;
  background: #ffffff1a;
  border-color: #fff3;
}
.hero-content {
  align-items: center;
  min-height: 0;
  display: flex;
}
.copy {
  z-index: 4;
  width: min(640px, 54vw);
  position: relative;
}
h1 {
  letter-spacing: -0.058em;
  text-wrap: balance;
  max-width: 640px;
  font-size: clamp(50px, 5.4vw, 80px);
  font-weight: 400;
  line-height: 0.98;
}
.description {
  letter-spacing: -0.018em;
  max-width: 600px;
  color: var(--epiora-muted);
  margin-top: clamp(20px, 3vh, 30px);
  font-size: clamp(15px, 1.2vw, 17px);
  line-height: 1.62;
}
.cta {
  color: #000;
  letter-spacing: -0.018em;
  background: linear-gradient(110deg, #fff 0%, #f4f5f2 28%, #fff 42%, #c8cbc9 58%, #d4d6d3 76%, #c3c7c9 100%) 100% / 240% 100%;
  border: 1px solid #ffffffb8;
  border-radius: 13px;
  justify-content: center;
  align-items: center;
  min-width: 140px;
  height: 52px;
  margin-top: clamp(24px, 3.5vh, 36px);
  padding: 0 26px;
  font-size: 15px;
  font-weight: 500;
  transition: background-position 0.52s cubic-bezier(0.22, 1, 0.36, 1), border-color 0.22s, box-shadow 0.22s;
  display: inline-flex;
  box-shadow: 0 0 0 1px #ffffff0f, 0 10px 28px #0000003d, inset 0 1px #fffc;
}
.cta:hover {
  color: #000;
  background-position: 0%;
  border-color: #fffffff0;
  box-shadow: 0 0 0 1px #ffffff1f, 0 12px 32px #00000047, 0 0 24px #ffffff0f, inset 0 1px #fffffff2;
}
.support {
  grid-template-columns: minmax(250px, 1fr) 1.45fr;
  align-items: center;
  gap: 70px;
  display: grid;
}
.support-copy h2 {
  letter-spacing: -0.018em;
  color: #ffffffe0;
  margin-bottom: 5px;
  font-size: 16px;
  font-weight: 500;
  line-height: 1.35;
}
.support-copy p {
  letter-spacing: -0.01em;
  color: var(--epiora-subtle);
  font-size: 14px;
  line-height: 1.45;
}
.logos {
  justify-content: flex-end;
  align-items: center;
  gap: clamp(26px, 4vw, 58px);
  display: flex;
}
.logos img {
  object-fit: contain;
  opacity: 0.52;
  filter: grayscale() brightness(1.7);
  width: auto;
  max-width: 112px;
  height: auto;
  max-height: 30px;
  transition: opacity 0.18s, filter 0.18s;
  display: block;
}
.logos img:hover {
  opacity: 0.88;
  filter: grayscale() brightness(2);
}
@media (max-height: 720px) and (min-width: 721px) {
  .page {
    grid-template-rows: 76px minmax(0, 1fr) 88px;
  }
  h1 {
    font-size: clamp(44px, 5vw, 66px);
  }
  .description {
    margin-top: 18px;
  }
  .cta {
    height: 48px;
    margin-top: 22px;
  }
}
@media (max-width: 720px) {
  .page {
    grid-template-rows: 74px minmax(0, 1fr) 90px;
    width: calc(100% - 32px);
  }
  .copy {
    width: 88%;
  }
  h1 {
    font-size: clamp(42px, 12vw, 58px);
  }
  .description {
    font-size: 15px;
  }
  .support {
    grid-template-columns: 1fr auto;
    gap: 20px;
  }
  .support-copy p {
    display: none;
  }
  .logos {
    gap: 20px;
  }
  .logos img {
    max-width: 78px;
    max-height: 23px;
  }
  .logos img:nth-child(n + 4) {
    display: none;
  }
}
@media (max-width: 470px) {
  .brand img {
    width: 26px;
    height: 26px;
  }
  .brand-name {
    font-size: 18px;
  }
  .copy {
    width: 94%;
  }
  .logos {
    display: none;
  }
  .support {
    grid-template-columns: 1fr;
  }
}