/* One continuous glass surface. No painted reflection or overlay shapes. */
:is(.landing .primary, .landing .outline, .landing .pill, .platform button) {
  position: relative;
  isolation: isolate;
  overflow: hidden;
  color: #e8eef6;
  border-radius: 999px;
  border: 1px solid rgba(222, 235, 252, 0.19);
  border-top-color: rgba(236, 245, 255, 0.38);
  border-bottom-color: rgba(166, 192, 225, 0.17);
  background:
    linear-gradient(
      180deg,
      rgba(237, 245, 255, 0.065),
      rgba(237, 245, 255, 0.015) 55%,
      rgba(178, 202, 234, 0.035)
    ),
    rgba(48, 65, 88, 0.25);
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.12),
    0 4px 14px rgba(0, 0, 0, 0.18);
  -webkit-backdrop-filter: blur(22px) saturate(120%);
  backdrop-filter: blur(22px) saturate(120%);
  text-shadow: none;
  white-space: nowrap;
  font-weight: 500;
  transition:
    transform 240ms cubic-bezier(0.2, 0.8, 0.2, 1),
    background-color 240ms ease-out,
    border-color 240ms ease-out,
    box-shadow 240ms ease-out;
}
:is(
  .landing .primary,
  .landing .outline,
  .landing .pill,
  .platform button
)::before,
:is(
  .landing .primary,
  .landing .outline,
  .landing .pill,
  .platform button
)::after {
  content: none;
}
.landing .primary,
.platform button:not(.secondary) {
  background:
    linear-gradient(
      180deg,
      rgba(236, 245, 255, 0.09),
      rgba(236, 245, 255, 0.025) 60%,
      rgba(178, 202, 234, 0.045)
    ),
    rgba(66, 87, 115, 0.28);
  border-color: rgba(210, 229, 252, 0.25);
  border-top-color: rgba(236, 245, 255, 0.46);
}
.landing .primary {
  min-height: 52px;
  padding-inline: 28px;
}
.landing .outline {
  min-height: 45px;
  padding-inline: 23px;
}
.landing .pill.active {
  color: #f0f5fc;
  border-color: rgba(167, 201, 242, 0.39);
  background-color: rgba(68, 102, 148, 0.25);
}
@media (hover: hover) {
  :is(
      .landing .primary,
      .landing .outline,
      .landing .pill,
      .platform button
    ):hover:not(:disabled) {
    transform: translateY(-1px);
    color: #fff;
    background:
      linear-gradient(
        180deg,
        rgba(236, 245, 255, 0.1),
        rgba(236, 245, 255, 0.025)
      ),
      rgba(72, 96, 128, 0.31);
    border-color: rgba(215, 233, 255, 0.35);
    border-top-color: rgba(240, 248, 255, 0.58);
    box-shadow:
      inset 0 1px 0 rgba(255, 255, 255, 0.16),
      0 6px 18px rgba(0, 0, 0, 0.22);
  }
}
:is(
    .landing .primary,
    .landing .outline,
    .landing .pill,
    .platform button
  ):active:not(:disabled) {
  transform: scale(0.98);
  box-shadow:
    inset 0 1px 3px rgba(0, 0, 0, 0.14),
    0 2px 6px rgba(0, 0, 0, 0.16);
}
:is(
  .landing .primary,
  .landing .outline,
  .landing .pill,
  .platform button
):focus-visible {
  outline: 2px solid #a9c8ec;
  outline-offset: 5px;
}
:is(
  .landing .primary,
  .landing .outline,
  .landing .pill,
  .platform button
):disabled {
  opacity: 0.4;
  transform: none;
  box-shadow: none;
}
@supports not (backdrop-filter: blur(22px)) {
  :is(.landing .primary, .landing .outline, .landing .pill, .platform button) {
    background-color: #1c2735;
  }
}
@media (prefers-reduced-transparency: reduce) {
  :is(.landing .primary, .landing .outline, .landing .pill, .platform button) {
    -webkit-backdrop-filter: none;
    backdrop-filter: none;
    background: #243143;
  }
}
@media (prefers-reduced-motion: reduce) {
  :is(.landing .primary, .landing .outline, .landing .pill, .platform button) {
    transition: none;
    transform: none !important;
  }
}