:root {
  --gf-black: #000000;
  --gf-dark: #151515;
  --gf-graphite: #1f1517;
  --gf-white: #ffffff;
  --gf-off-white: #f2f3f5;
  --gf-soft-gray: #e6e7ea;
  --gf-text-light: #f4f4f4;
  --gf-text-muted: #9aa0a6;
  --gf-text-dark: #151515;
  --gf-magenta: #c60673;
  --gf-fuchsia: #ff199c;
  --gf-violet: #8b00ff;
  --gf-gradient-brand: linear-gradient(135deg, #c60673 0%, #ff199c 60%, #ff199c 100%);

  --gf-background: #180e10;
  --gf-foreground: #f4f4f4;
  --gf-surface: #151515;
  --gf-surface-2: #1f1517;
  --gf-border: rgba(244, 244, 244, 0.08);
}

body.gf-theme-light,
.gf-theme-light {
  --gf-background: #f2f3f5;
  --gf-foreground: #151515;
  --gf-surface: #ffffff;
  --gf-surface-2: #f2f3f5;
  --gf-border: rgba(21, 21, 21, 0.08);
  --gf-text-muted: #5a5f66;
}

html {
  scroll-behavior: smooth;
  scroll-padding-top: 88px;
}

body {
  margin: 0;
  background: var(--gf-background);
  color: var(--gf-foreground);
  font-family: "DM Sans", system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}

* {
  box-sizing: border-box;
}

a {
  color: inherit;
  text-decoration: none;
}

.gf-container {
  width: min(100% - 40px, 1180px);
  margin-inline: auto;
}

.gf-section {
  position: relative;
  padding: 96px 0;
}

.gf-section--default {
  min-height: 60vh;
  display: flex;
  align-items: center;
}

.gf-section h1 {
  margin: 0 0 16px;
  font-size: clamp(48px, 8vw, 96px);
  line-height: 0.95;
  letter-spacing: -0.07em;
}

.gf-section p {
  max-width: 680px;
  margin: 0;
  color: var(--gf-text-muted);
  font-size: 20px;
  line-height: 1.6;
}

.gf-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  min-height: 48px;
  padding: 14px 22px;
  border-radius: 999px;
  font-weight: 600;
  line-height: 1;
  transition: transform 0.2s ease, box-shadow 0.2s ease, filter 0.2s ease;
}

.gf-btn:hover {
  transform: translateY(-1px);
}

.gf-btn--primary {
  color: #ffffff;
  background: var(--gf-gradient-brand);
  box-shadow: 0 10px 40px -10px rgba(255, 30, 154, 0.6);
}

.gf-btn--secondary {
  color: var(--gf-foreground);
  border: 1px solid color-mix(in oklab, var(--gf-magenta) 50%, transparent);
  background: transparent;
}

.gf-text-gradient {
  background: var(--gf-gradient-brand);
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
}

/* ---------- Header ---------- */

.gf-site-header {
  position: sticky;
  top: 0;
  z-index: 50;
  backdrop-filter: blur(24px);
  -webkit-backdrop-filter: blur(24px);
}

.gf-site-header__backdrop {
  position: absolute;
  inset: 0;
  z-index: -1;
  background: linear-gradient(180deg, rgba(11, 5, 9, 0.85), rgba(11, 5, 9, 0.55));
  border-bottom: 1px solid rgba(244, 244, 244, 0.06);
}

.gf-theme-light .gf-site-header__backdrop,
body.gf-theme-light .gf-site-header__backdrop {
  background: linear-gradient(180deg, rgba(248, 245, 247, 0.9), rgba(248, 245, 247, 0.6));
  border-bottom-color: rgba(21, 21, 21, 0.08);
}

.gf-site-header__inner {
  width: min(100% - 48px, 1280px);
  margin-inline: auto;
  min-height: 72px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 24px;
}

.gf-site-header__inner--minimal {
  justify-content: center;
}

.gf-logo {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  color: var(--gf-foreground);
  line-height: 1;
}

.gf-logo__mark {
  width: 280px;
  height: 32px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  filter: drop-shadow(0 0 18px rgba(255, 25, 156, 0.28));
}

.gf-logo__text {
  font-size: 17px;
  font-weight: 700;
  letter-spacing: -0.04em;
}

.gf-site-header__nav {
  display: flex;
  align-items: center;
  gap: 32px;
}

.gf-site-header__nav-link {
  color: var(--gf-text-muted);
  font-size: 14px;
  font-weight: 500;
  transition: color 0.2s ease;
}

.gf-site-header__nav-link:hover,
.gf-site-header__nav-link:focus-visible {
  color: var(--gf-foreground);
}

.gf-site-header__actions {
  display: flex;
  align-items: center;
  gap: 12px;
}

.gf-site-header__cta {
  min-height: 42px;
  padding: 12px 18px;
  font-size: 14px;
}

.gf-site-header__menu-toggle {
  display: none;
  width: 44px;
  height: 44px;
  border: 1px solid var(--gf-border);
  border-radius: 999px;
  background: color-mix(in oklab, var(--gf-surface) 80%, transparent);
  color: var(--gf-foreground);
  cursor: pointer;
}

.gf-site-header__menu-toggle span {
  display: block;
  width: 18px;
  height: 2px;
  margin: 4px auto;
  border-radius: 999px;
  background: currentColor;
}

@media (max-width: 820px) {
  .gf-site-header__inner {
    width: min(100% - 32px, 1280px);
  }

  .gf-site-header__nav,
  .gf-site-header__actions {
    display: none;
  }

  .gf-site-header__menu-toggle {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
  }
}

/* ---------- Motion / reveal ---------- */

@keyframes gf-float-slow {
  0%, 100% {
    transform: translateY(0) rotate(0);
  }
  50% {
    transform: translateY(-18px) rotate(2deg);
  }
}

@keyframes gf-pulse-glow {
  0%, 100% {
    opacity: 0.55;
  }
  50% {
    opacity: 1;
  }
}

@keyframes gf-scan {
  0% {
    transform: translateY(-100%);
    opacity: 0;
  }
  20% {
    opacity: 1;
  }
  100% {
    transform: translateY(100%);
    opacity: 0;
  }
}

@keyframes gf-brand-shimmer {
  0%, 100% {
    background-position: 0% 50%;
  }
  50% {
    background-position: 100% 50%;
  }
}

[data-reveal] {
  opacity: 0;
  transform: translate3d(0, 18px, 0);
  transition:
    opacity 0.9s cubic-bezier(0.22, 1, 0.36, 1),
    transform 0.9s cubic-bezier(0.22, 1, 0.36, 1);
  transition-delay: calc(var(--reveal-delay, 0) * 1ms);
  will-change: opacity, transform;
}

[data-reveal="fade"] {
  transform: none;
}

[data-reveal="left"] {
  transform: translate3d(-24px, 0, 0);
}

[data-reveal="right"] {
  transform: translate3d(24px, 0, 0);
}

[data-reveal="zoom"] {
  transform: scale(0.96);
}

[data-reveal].is-visible {
  opacity: 1;
  transform: translate3d(0, 0, 0) scale(1);
}

@media (prefers-reduced-motion: reduce) {
  [data-reveal] {
    opacity: 1 !important;
    transform: none !important;
    transition: none !important;
  }
}

/* ---------- Shared visual utilities ---------- */

.gf-text-gradient {
  background: var(--gf-gradient-brand);
  background-size: 200% 200%;
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
  animation: gf-brand-shimmer 7s ease-in-out infinite;
}

.gf-eyebrow {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 7px 13px;
  border-radius: 999px;
  color: var(--gf-foreground);
  background: color-mix(in oklab, var(--gf-magenta) 10%, transparent);
  border: 1px solid color-mix(in oklab, var(--gf-magenta) 30%, transparent);
  font-size: 11px;
  font-weight: 600;
  letter-spacing: 0.14em;
  text-transform: uppercase;
}

.gf-eyebrow__dot {
  width: 6px;
  height: 6px;
  border-radius: 999px;
  background: var(--gf-magenta);
  box-shadow: 0 0 18px rgba(255, 25, 156, 0.6);
}

.gf-hairline {
  height: 1px;
  background: linear-gradient(
    90deg,
    transparent,
    color-mix(in oklab, var(--gf-magenta) 60%, transparent),
    transparent
  );
}

.gf-interface-card {
  background: var(--gf-surface);
  border: 1px solid var(--gf-border);
  border-radius: 20px;
  box-shadow: 0 20px 80px -20px rgba(255, 30, 154, 0.25);
}

/* ---------- Hero ---------- */

.gf-hero {
  position: relative;
  overflow: hidden;
}

.gf-hero__background {
  pointer-events: none;
  position: absolute;
  inset: 0;
  z-index: -1;
}

.gf-hero__orb {
  position: absolute;
  left: -160px;
  top: -160px;
  width: 600px;
  height: 600px;
  border-radius: 999px;
  background: radial-gradient(circle, rgba(198, 6, 115, 0.35), transparent 60%);
  filter: blur(64px);
  opacity: 0.6;
}

.gf-hero__grid {
  position: absolute;
  inset: 0;
  opacity: 0.4;
  background-image: radial-gradient(circle at 1px 1px, rgba(255, 73, 199, 0.18) 1px, transparent 0);
  background-size: 28px 28px;
  mask-image: radial-gradient(ellipse at center, black, transparent 70%);
  -webkit-mask-image: radial-gradient(ellipse at center, black, transparent 70%);
}

.gf-hero__inner {
  display: grid;
  align-items: center;
  gap: 64px;
  padding-top: 64px;
  padding-bottom: 96px;
}

.gf-hero__title {
  margin: 24px 0 0;
  max-width: 760px;
  color: var(--gf-foreground);
  font-size: clamp(44px, 7vw, 72px);
  font-weight: 700;
  line-height: 1.02;
  letter-spacing: -0.055em;
  text-wrap: balance;
}

.gf-hero__subtitle {
  max-width: 590px;
  margin: 28px 0 0;
  color: var(--gf-text-muted);
  font-size: 18px;
  line-height: 1.7;
}

.gf-hero__cta {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 16px;
  margin-top: 36px;
}

.gf-hero__microcopy {
  margin: 24px 0 0;
  color: var(--gf-text-muted);
  font-size: 14px;
  line-height: 1.6;
}

.gf-hero__visual-wrap {
  display: flex;
  justify-content: center;
}

/* ---------- Hero visual ---------- */

.gf-hero-visual {
  position: relative;
  width: 100%;
  max-width: 540px;
  aspect-ratio: 1 / 1;
}

.gf-hero-visual__bg {
  position: absolute;
  inset: 0;
  z-index: -1;
}

.gf-hero-visual__glow {
  position: absolute;
  border-radius: 999px;
  filter: blur(64px);
}

.gf-hero-visual__glow--top {
  right: -40px;
  top: -40px;
  width: 420px;
  height: 420px;
  background: radial-gradient(circle, rgba(255, 25, 156, 0.55), transparent 60%);
  animation: gf-pulse-glow 3.5s ease-in-out infinite;
}

.gf-hero-visual__glow--bottom {
  left: 0;
  bottom: 0;
  width: 320px;
  height: 320px;
  background: radial-gradient(circle, rgba(198, 6, 115, 0.45), transparent 60%);
}

.gf-interface-card--main {
  position: absolute;
  left: 8%;
  top: 12%;
  width: 78%;
  padding: 24px;
  animation: gf-float-slow 9s ease-in-out infinite;
}

.gf-interface-card__top,
.gf-interface-card__event {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  color: var(--gf-text-muted);
  font-size: 12px;
}

.gf-interface-card__top {
  text-transform: uppercase;
  letter-spacing: 0.14em;
}

.gf-interface-card__guest {
  display: flex;
  align-items: center;
  gap: 20px;
  margin-top: 20px;
}

.gf-interface-card__label {
  color: var(--gf-text-muted);
  font-size: 12px;
  font-weight: 500;
  letter-spacing: 0.14em;
  text-transform: uppercase;
}

.gf-interface-card__name {
  margin-top: 4px;
  color: var(--gf-foreground);
  font-size: 18px;
  font-weight: 700;
  letter-spacing: -0.03em;
}

.gf-interface-card__meta {
  margin-top: 3px;
  color: var(--gf-text-muted);
  font-size: 12px;
}

.gf-interface-card--main .gf-hairline {
  margin-top: 24px;
}

.gf-interface-card__event {
  margin-top: 16px;
}

.gf-status-pill {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  flex-shrink: 0;
  padding: 5px 10px;
  border-radius: 999px;
  color: var(--gf-fuchsia);
  background: color-mix(in oklab, var(--gf-magenta) 18%, transparent);
  font-size: 11px;
  font-weight: 700;
}

.gf-qr-pattern {
  position: relative;
  display: grid;
  width: 96px;
  height: 96px;
  flex-shrink: 0;
  grid-template-columns: repeat(6, 1fr);
  grid-template-rows: repeat(6, 1fr);
  gap: 3px;
  padding: 8px;
  border-radius: 14px;
  overflow: hidden;
  background: var(--gf-surface-2);
}

.gf-qr-pattern__cell {
  border-radius: 2px;
}

.gf-qr-pattern__cell--corner {
  background: var(--gf-magenta);
}

.gf-qr-pattern__cell--fill {
  background: color-mix(in oklab, var(--gf-foreground) 80%, transparent);
}

.gf-qr-pattern__scan-line {
  position: absolute;
  left: 0;
  right: 0;
  height: 2px;
  background: linear-gradient(90deg, transparent, var(--gf-magenta), transparent);
  animation: gf-scan 3s ease-in-out infinite;
}

.gf-interface-card--chip {
  position: absolute;
  right: 2%;
  bottom: 6%;
  width: 58%;
  padding: 16px;
}

.gf-chip {
  display: flex;
  align-items: center;
  gap: 12px;
}

.gf-chip__icon {
  display: grid;
  width: 40px;
  height: 40px;
  flex-shrink: 0;
  place-items: center;
  border-radius: 999px;
  color: #ffffff;
  background: var(--gf-gradient-brand);
  box-shadow: 0 12px 30px -12px rgba(255, 25, 156, 0.8);
}

.gf-chip__content {
  min-width: 0;
}

.gf-chip__title {
  overflow: hidden;
  color: var(--gf-foreground);
  font-size: 14px;
  font-weight: 700;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.gf-chip__text {
  margin-top: 3px;
  color: var(--gf-text-muted);
  font-size: 11px;
  white-space: nowrap;
}

.gf-interface-card--live {
  position: absolute;
  left: 2%;
  top: 2%;
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 9px 12px;
  color: var(--gf-text-muted);
  font-size: 11px;
  font-weight: 600;
  letter-spacing: 0.14em;
  text-transform: uppercase;
}

.gf-live-dot {
  width: 6px;
  height: 6px;
  border-radius: 999px;
  background: var(--gf-magenta);
  animation: gf-pulse-glow 3.5s ease-in-out infinite;
}

@media (min-width: 1024px) {
  .gf-hero__inner {
    grid-template-columns: 1.05fr 1fr;
    padding-top: 96px;
    padding-bottom: 128px;
  }

  .gf-hero__visual-wrap {
    justify-content: flex-end;
  }
}

@media (max-width: 720px) {
  .gf-hero__inner {
    gap: 48px;
    padding-top: 48px;
    padding-bottom: 72px;
  }

  .gf-hero__title {
    font-size: clamp(42px, 13vw, 58px);
  }

  .gf-hero__subtitle {
    font-size: 16px;
  }

  .gf-hero-visual {
    max-width: 420px;
  }

  .gf-interface-card--main {
    width: 86%;
    left: 4%;
    padding: 18px;
  }

  .gf-interface-card__guest {
    gap: 14px;
  }

  .gf-qr-pattern {
    width: 78px;
    height: 78px;
  }

  .gf-interface-card--chip {
    width: 74%;
    right: 0;
  }

  .gf-interface-card__event {
    align-items: flex-start;
    flex-direction: column;
  }
}

/* ---------- Section titles ---------- */

.gf-section-title {
  margin: 0;
  color: var(--gf-foreground);
  font-size: clamp(40px, 6vw, 64px);
  font-weight: 700;
  line-height: 1.05;
  letter-spacing: -0.05em;
  text-wrap: balance;
}

/* ---------- Problem section ---------- */

.gf-problem {
  position: relative;
  border-top: 1px solid var(--gf-border);
  padding: 96px 0;
}

.gf-problem__intro {
  display: grid;
  gap: 48px;
}

.gf-problem__title {
  margin-top: 20px;
  max-width: 760px;
}

.gf-problem__description {
  margin: 0;
  align-self: end;
  color: var(--gf-text-muted);
  font-size: 18px;
  line-height: 1.7;
}

.gf-problem__cards {
  display: grid;
  gap: 20px;
  margin-top: 64px;
}

.gf-problem-card {
  position: relative;
  overflow: hidden;
  padding: 28px;
  border: 1px solid var(--gf-border);
  border-radius: 20px;
  background: var(--gf-surface);
  transition:
    transform 0.22s ease,
    border-color 0.22s ease,
    box-shadow 0.22s ease;
}

.gf-problem-card:hover {
  transform: translateY(-4px);
  border-color: color-mix(in oklab, var(--gf-magenta) 35%, var(--gf-border));
  box-shadow: 0 24px 70px -36px rgba(255, 25, 156, 0.55);
}

.gf-problem-card__glow {
  position: absolute;
  top: -40px;
  right: -40px;
  width: 128px;
  height: 128px;
  border-radius: 999px;
  background: var(--gf-gradient-brand);
  filter: blur(32px);
  opacity: 0;
  transition: opacity 0.25s ease;
}

.gf-problem-card:hover .gf-problem-card__glow {
  opacity: 1;
}

.gf-problem-card__header {
  position: relative;
  z-index: 1;
  display: flex;
  align-items: center;
  gap: 12px;
}

.gf-problem-card__number {
  display: grid;
  width: 36px;
  height: 36px;
  flex-shrink: 0;
  place-items: center;
  border-radius: 999px;
  color: var(--gf-fuchsia);
  background: color-mix(in oklab, var(--gf-magenta) 15%, transparent);
  font-size: 14px;
  font-weight: 700;
}

.gf-problem-card__title {
  margin: 0;
  color: var(--gf-foreground);
  font-size: 18px;
  font-weight: 700;
  line-height: 1.2;
  letter-spacing: -0.03em;
}

.gf-problem-card__body {
  position: relative;
  z-index: 1;
  margin: 16px 0 0;
  color: var(--gf-text-muted);
  font-size: 14px;
  line-height: 1.7;
}

@media (min-width: 768px) {
  .gf-problem__cards {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
}

@media (min-width: 1024px) {
  .gf-problem {
    padding: 128px 0;
  }

  .gf-problem__intro {
    grid-template-columns: 1.1fr 1fr;
  }
}

@media (max-width: 720px) {
  .gf-problem {
    padding: 80px 0;
  }

  .gf-problem__intro {
    gap: 28px;
  }

  .gf-problem__cards {
    margin-top: 44px;
  }

  .gf-section-title {
    font-size: clamp(36px, 11vw, 48px);
  }
}

/* ---------- Flow section ---------- */

.gf-flow {
  position: relative;
  overflow: hidden;
  border-top: 1px solid var(--gf-border);
  padding: 96px 0;
}

.gf-flow__glow {
  pointer-events: none;
  position: absolute;
  left: 50%;
  top: 0;
  width: 820px;
  height: 420px;
  border-radius: 999px;
  background: radial-gradient(ellipse, rgba(255, 25, 156, 0.35), transparent 60%);
  filter: blur(64px);
  opacity: 0.4;
  transform: translateX(-50%);
}

.gf-flow__intro {
  max-width: 780px;
}

.gf-flow__title {
  margin-top: 20px;
}

.gf-flow__steps {
  position: relative;
  display: grid;
  gap: 16px;
  margin-top: 64px;
}

.gf-flow__connector {
  pointer-events: none;
  display: none;
  position: absolute;
  left: 0;
  right: 0;
  top: 64px;
  height: 1px;
  background: linear-gradient(
    90deg,
    transparent,
    color-mix(in oklab, var(--gf-magenta) 50%, transparent),
    transparent
  );
}

.gf-flow-card {
  position: relative;
  padding: 24px;
  border: 1px solid var(--gf-border);
  border-radius: 20px;
  background: var(--gf-surface);
  transition:
    transform 0.22s ease,
    border-color 0.22s ease,
    box-shadow 0.22s ease;
}

.gf-flow-card:hover {
  transform: translateY(-4px);
  border-color: color-mix(in oklab, var(--gf-magenta) 35%, var(--gf-border));
  box-shadow: 0 24px 70px -36px rgba(255, 25, 156, 0.55);
}

.gf-flow-card__number {
  display: flex;
  width: 40px;
  height: 40px;
  align-items: center;
  justify-content: center;
  border-radius: 14px;
  color: #ffffff;
  background: var(--gf-gradient-brand);
  box-shadow: 0 14px 36px -18px rgba(255, 25, 156, 0.9);
  font-size: 14px;
  font-weight: 700;
}

.gf-flow-card__title {
  margin: 20px 0 0;
  color: var(--gf-foreground);
  font-size: 18px;
  font-weight: 700;
  line-height: 1.2;
  letter-spacing: -0.03em;
}

.gf-flow-card__body {
  margin: 8px 0 0;
  color: var(--gf-text-muted);
  font-size: 14px;
  line-height: 1.7;
}

.gf-flow-card__line {
  height: 1px;
  width: 100%;
  margin-top: 24px;
  opacity: 0.6;
  background: linear-gradient(
    90deg,
    color-mix(in oklab, var(--gf-magenta) 40%, transparent),
    transparent
  );
}

@media (min-width: 768px) {
  .gf-flow__steps {
    grid-template-columns: repeat(5, minmax(0, 1fr));
  }

  .gf-flow__connector {
    display: block;
  }
}

@media (min-width: 1024px) {
  .gf-flow {
    padding: 128px 0;
  }
}

@media (max-width: 900px) {
  .gf-flow__steps {
    grid-template-columns: 1fr;
  }

  .gf-flow__connector {
    display: none;
  }
}

@media (max-width: 720px) {
  .gf-flow {
    padding: 80px 0;
  }

  .gf-flow__steps {
    margin-top: 44px;
  }
}

/* ---------- Staff section ---------- */

.gf-staff {
  position: relative;
  border-top: 1px solid var(--gf-border);
  padding: 96px 0;
}

.gf-staff__inner {
  display: grid;
  align-items: center;
  gap: 64px;
}

.gf-staff__title {
  max-width: 680px;
  margin-top: 20px;
}

.gf-staff__description {
  max-width: 590px;
  margin: 24px 0 0;
  color: var(--gf-text-muted);
  font-size: 18px;
  line-height: 1.7;
}

.gf-staff__bullets {
  display: grid;
  gap: 14px;
  margin: 36px 0 0;
  padding: 0;
  list-style: none;
}

.gf-staff__bullet {
  display: flex;
  align-items: flex-start;
  gap: 12px;
  color: var(--gf-foreground);
  font-size: 16px;
  line-height: 1.5;
}

.gf-staff__bullet-icon {
  display: grid;
  width: 20px;
  height: 20px;
  flex-shrink: 0;
  place-items: center;
  margin-top: 2px;
  border-radius: 999px;
  background: var(--gf-gradient-brand);
  box-shadow: 0 10px 28px -12px rgba(255, 25, 156, 0.85);
}

.gf-staff__bullet-text {
  color: var(--gf-foreground);
}

.gf-staff__visual {
  display: flex;
  justify-content: center;
}

/* ---------- Phone mockup ---------- */

.gf-phone-mockup {
  position: relative;
}

.gf-phone-mockup__glow {
  position: absolute;
  inset: -40px;
  z-index: -1;
  border-radius: 999px;
  background: radial-gradient(circle, rgba(255, 25, 156, 0.35), transparent 65%);
  filter: blur(64px);
  opacity: 0.7;
}

.gf-phone-mockup__device {
  position: relative;
  width: 280px;
  height: 560px;
  padding: 12px;
  border: 1px solid var(--gf-border);
  border-radius: 44px;
  background: var(--gf-surface-2);
  box-shadow: 0 20px 80px -20px rgba(255, 30, 154, 0.25);
}

.gf-phone-mockup__screen {
  display: flex;
  width: 100%;
  height: 100%;
  flex-direction: column;
  overflow: hidden;
  padding: 20px;
  border-radius: 36px;
  background: var(--gf-surface);
}

.gf-phone-mockup__topbar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  color: var(--gf-text-muted);
  font-size: 11px;
  font-weight: 600;
  letter-spacing: 0.14em;
  text-transform: uppercase;
}

.gf-phone-mockup__live {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  color: var(--gf-text-muted);
  font-size: 11px;
  letter-spacing: 0;
  text-transform: none;
}

.gf-phone-mockup__live span:first-child {
  width: 6px;
  height: 6px;
  border-radius: 999px;
  background: var(--gf-magenta);
  animation: gf-pulse-glow 3.5s ease-in-out infinite;
}

.gf-phone-mockup__title {
  margin-top: 20px;
  color: var(--gf-foreground);
  font-size: 20px;
  font-weight: 700;
  line-height: 1.15;
  letter-spacing: -0.04em;
}

.gf-phone-mockup__subtitle {
  margin: 4px 0 0;
  color: var(--gf-text-muted);
  font-size: 12px;
  line-height: 1.5;
}

.gf-phone-scanner {
  position: relative;
  width: 100%;
  aspect-ratio: 1 / 1;
  margin-top: 20px;
  overflow: hidden;
  border-radius: 16px;
  background: var(--gf-surface-2);
}

.gf-phone-scanner__grid {
  position: absolute;
  inset: 16px;
  display: grid;
  grid-template-columns: repeat(8, 1fr);
  grid-template-rows: repeat(8, 1fr);
  gap: 3px;
}

.gf-phone-scanner__cell {
  border-radius: 2px;
}

.gf-phone-scanner__cell--corner {
  background: var(--gf-magenta);
}

.gf-phone-scanner__cell--fill {
  background: color-mix(in oklab, var(--gf-foreground) 80%, transparent);
}

.gf-phone-scanner__scan-line {
  pointer-events: none;
  position: absolute;
  left: 8px;
  right: 8px;
  height: 2px;
  border-radius: 999px;
  background: linear-gradient(90deg, transparent, var(--gf-magenta), transparent);
  animation: gf-scan 3s ease-in-out infinite;
}

.gf-phone-scanner__corner {
  position: absolute;
  width: 20px;
  height: 20px;
  border-color: var(--gf-magenta);
  border-style: solid;
  border-radius: 3px;
}

.gf-phone-scanner__corner--tl {
  top: 8px;
  left: 8px;
  border-width: 2px 0 0 2px;
}

.gf-phone-scanner__corner--tr {
  top: 8px;
  right: 8px;
  border-width: 2px 2px 0 0;
}

.gf-phone-scanner__corner--bl {
  bottom: 8px;
  left: 8px;
  border-width: 0 0 2px 2px;
}

.gf-phone-scanner__corner--br {
  right: 8px;
  bottom: 8px;
  border-width: 0 2px 2px 0;
}

.gf-phone-confirmation {
  display: flex;
  align-items: center;
  gap: 12px;
  margin-top: 20px;
  padding: 16px;
  border: 1px solid color-mix(in oklab, var(--gf-magenta) 35%, transparent);
  border-radius: 16px;
  background: color-mix(in oklab, var(--gf-magenta) 12%, transparent);
}

.gf-phone-confirmation__icon {
  display: grid;
  width: 36px;
  height: 36px;
  flex-shrink: 0;
  place-items: center;
  border-radius: 999px;
  background: var(--gf-gradient-brand);
  box-shadow: 0 14px 34px -16px rgba(255, 25, 156, 0.9);
}

.gf-phone-confirmation__title {
  color: var(--gf-foreground);
  font-size: 14px;
  font-weight: 700;
  line-height: 1.2;
}

.gf-phone-confirmation__meta {
  margin-top: 3px;
  color: var(--gf-text-muted);
  font-size: 11px;
}

.gf-phone-mockup__footer {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  margin-top: auto;
  color: var(--gf-text-muted);
  font-size: 11px;
}

@media (min-width: 1024px) {
  .gf-staff {
    padding: 128px 0;
  }

  .gf-staff__inner {
    grid-template-columns: 1fr 1fr;
  }

  .gf-staff__visual {
    justify-content: flex-end;
  }
}

@media (max-width: 720px) {
  .gf-staff {
    padding: 80px 0;
  }

  .gf-staff__inner {
    gap: 52px;
  }

  .gf-phone-mockup__device {
    width: min(280px, 82vw);
    height: calc(min(280px, 82vw) * 2);
  }

  .gf-phone-mockup__screen {
    padding: 18px;
  }

  .gf-phone-mockup__footer {
    flex-direction: column;
    align-items: flex-start;
  }
}

/* ---------- Benefits section ---------- */

.gf-benefits {
  position: relative;
  border-top: 1px solid var(--gf-border);
  padding: 96px 0;
}

.gf-benefits__intro {
  display: grid;
  align-items: end;
  gap: 40px;
}

.gf-benefits__title {
  margin-top: 20px;
  max-width: 820px;
}

.gf-benefits__grid {
  display: grid;
  gap: 20px;
  margin-top: 64px;
}

.gf-benefit-card {
  position: relative;
  overflow: hidden;
  padding: 28px;
  border: 1px solid var(--gf-border);
  border-radius: 20px;
  background: var(--gf-surface);
  transition:
    transform 0.22s ease,
    border-color 0.22s ease,
    box-shadow 0.22s ease;
}

.gf-benefit-card:hover {
  transform: translateY(-4px);
  border-color: color-mix(in oklab, var(--gf-magenta) 35%, var(--gf-border));
  box-shadow: 0 24px 70px -36px rgba(255, 25, 156, 0.55);
}

.gf-benefit-card__glow {
  position: absolute;
  top: -48px;
  right: -48px;
  width: 128px;
  height: 128px;
  border-radius: 999px;
  background: var(--gf-gradient-brand);
  filter: blur(32px);
  opacity: 0;
  transition: opacity 0.25s ease;
}

.gf-benefit-card:hover .gf-benefit-card__glow {
  opacity: 0.7;
}

.gf-benefit-card__icon {
  position: relative;
  z-index: 1;
  display: grid;
  width: 44px;
  height: 44px;
  place-items: center;
  border: 1px solid color-mix(in oklab, var(--gf-magenta) 30%, transparent);
  border-radius: 14px;
  color: var(--gf-fuchsia);
  background: color-mix(in oklab, var(--gf-magenta) 12%, transparent);
}

.gf-benefit-card__icon svg {
  width: 20px;
  height: 20px;
}

.gf-benefit-card__title {
  position: relative;
  z-index: 1;
  margin: 20px 0 0;
  color: var(--gf-foreground);
  font-size: 18px;
  font-weight: 700;
  line-height: 1.2;
  letter-spacing: -0.03em;
}

.gf-benefit-card__body {
  position: relative;
  z-index: 1;
  margin: 8px 0 0;
  color: var(--gf-text-muted);
  font-size: 14px;
  line-height: 1.7;
}

@media (min-width: 768px) {
  .gf-benefits__grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (min-width: 1024px) {
  .gf-benefits {
    padding: 128px 0;
  }

  .gf-benefits__intro {
    grid-template-columns: 1.2fr 1fr;
  }

  .gf-benefits__grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
}

@media (max-width: 720px) {
  .gf-benefits {
    padding: 80px 0;
  }

  .gf-benefits__grid {
    margin-top: 44px;
  }
}

/* ---------- Use cases section ---------- */

.gf-use-cases {
  position: relative;
  border-top: 1px solid var(--gf-border);
  padding: 96px 0;
}

.gf-use-cases__intro {
  max-width: 780px;
}

.gf-use-cases__title {
  margin-top: 20px;
}

.gf-use-cases__grid {
  display: grid;
  gap: 16px;
  margin-top: 56px;
}

.gf-use-case-card {
  position: relative;
  display: flex;
  min-height: 170px;
  flex-direction: column;
  justify-content: space-between;
  gap: 32px;
  padding: 24px;
  border: 1px solid var(--gf-border);
  border-radius: 20px;
  background: var(--gf-surface);
  transition:
    transform 0.22s ease,
    border-color 0.22s ease,
    box-shadow 0.22s ease,
    background 0.22s ease;
}

.gf-use-case-card:hover {
  transform: translateY(-4px);
  border-color: color-mix(in oklab, var(--gf-magenta) 45%, transparent);
  box-shadow: 0 24px 70px -36px rgba(255, 25, 156, 0.55);
}

.gf-use-case-card__icon {
  display: grid;
  width: 40px;
  height: 40px;
  place-items: center;
  border: 1px solid color-mix(in oklab, var(--gf-magenta) 30%, transparent);
  border-radius: 14px;
  color: var(--gf-fuchsia);
  background: color-mix(in oklab, var(--gf-magenta) 10%, transparent);
}

.gf-use-case-card__icon svg {
  width: 20px;
  height: 20px;
}

.gf-use-case-card__title {
  margin: 0;
  color: var(--gf-foreground);
  font-size: 16px;
  font-weight: 700;
  line-height: 1.25;
  letter-spacing: -0.03em;
}

@media (min-width: 640px) {
  .gf-use-cases__grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (min-width: 1024px) {
  .gf-use-cases {
    padding: 128px 0;
  }

  .gf-use-cases__grid {
    grid-template-columns: repeat(4, minmax(0, 1fr));
  }
}

@media (max-width: 720px) {
  .gf-use-cases {
    padding: 80px 0;
  }

  .gf-use-cases__grid {
    margin-top: 44px;
  }
}

/* ---------- Product interface section ---------- */

.gf-interface {
  position: relative;
  border-top: 1px solid var(--gf-border);
  padding: 96px 0;
}

.gf-interface__intro {
  max-width: 780px;
}

.gf-interface__grid {
  display: grid;
  gap: 20px;
  margin-top: 64px;
}

.gf-product-card {
  position: relative;
  overflow: hidden;
  padding: 24px;
  border: 1px solid var(--gf-border);
  border-radius: 20px;
  background: var(--gf-surface);
  box-shadow: 0 20px 80px -20px rgba(255, 30, 154, 0.18);
  transition:
    transform 0.22s ease,
    border-color 0.22s ease,
    box-shadow 0.22s ease;
}

.gf-product-card:hover {
  transform: translateY(-4px);
  border-color: color-mix(in oklab, var(--gf-magenta) 35%, var(--gf-border));
  box-shadow: 0 24px 70px -36px rgba(255, 25, 156, 0.55);
}

.gf-product-card__subtitle {
  display: block;
  color: var(--gf-text-muted);
  font-size: 11px;
  font-weight: 600;
  letter-spacing: 0.14em;
  text-transform: uppercase;
}

.gf-product-card__title {
  margin: 12px 0 0;
  color: var(--gf-foreground);
  font-size: 20px;
  font-weight: 700;
  line-height: 1.15;
  letter-spacing: -0.04em;
}

.gf-product-card__content {
  margin-top: 24px;
}

.gf-product-card__meta {
  margin-top: 16px;
  color: var(--gf-text-muted);
  font-size: 12px;
  line-height: 1.5;
}

/* Registration card */

.gf-registration-list {
  display: grid;
  gap: 8px;
}

.gf-registration-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
  padding: 12px;
  border: 1px solid var(--gf-border);
  border-radius: 14px;
  background: var(--gf-surface-2);
}

.gf-registration-row__info {
  min-width: 0;
}

.gf-registration-row__name {
  overflow: hidden;
  color: var(--gf-foreground);
  font-size: 14px;
  font-weight: 600;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.gf-registration-row__role {
  overflow: hidden;
  margin-top: 2px;
  color: var(--gf-text-muted);
  font-size: 11px;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.gf-registration-row__status {
  flex-shrink: 0;
  padding: 4px 8px;
  border-radius: 999px;
  color: var(--gf-fuchsia);
  background: color-mix(in oklab, var(--gf-magenta) 15%, transparent);
  font-size: 10px;
  font-weight: 700;
}

/* QR product card */

.gf-product-qr {
  position: relative;
  width: 100%;
  aspect-ratio: 1 / 1;
  overflow: hidden;
  border-radius: 14px;
  background: var(--gf-surface-2);
}

.gf-product-qr__grid {
  position: absolute;
  inset: 16px;
  display: grid;
  grid-template-columns: repeat(7, 1fr);
  grid-template-rows: repeat(7, 1fr);
  gap: 3px;
}

.gf-product-qr__cell {
  border-radius: 2px;
}

.gf-product-qr__cell--corner {
  background: var(--gf-magenta);
}

.gf-product-qr__cell--fill {
  background: color-mix(in oklab, var(--gf-foreground) 80%, transparent);
}

.gf-product-qr__scan-line {
  pointer-events: none;
  position: absolute;
  left: 8px;
  right: 8px;
  height: 2px;
  border-radius: 999px;
  background: linear-gradient(90deg, transparent, var(--gf-magenta), transparent);
  animation: gf-scan 3s ease-in-out infinite;
}

/* Automation card */

.gf-automation-list {
  display: grid;
  gap: 10px;
}

.gf-automation-row {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 12px;
  border: 1px solid var(--gf-border);
  border-radius: 14px;
  background: var(--gf-surface-2);
}

.gf-automation-row__dot {
  width: 8px;
  height: 8px;
  flex-shrink: 0;
  border-radius: 999px;
  background: var(--gf-magenta);
  box-shadow: 0 0 18px rgba(255, 25, 156, 0.6);
  animation: gf-pulse-glow 3.5s ease-in-out infinite;
}

.gf-automation-row__content {
  display: grid;
  min-width: 0;
  gap: 2px;
}

.gf-automation-row__label {
  overflow: hidden;
  color: var(--gf-foreground);
  font-size: 14px;
  font-weight: 600;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.gf-automation-row__value {
  overflow: hidden;
  color: var(--gf-text-muted);
  font-size: 11px;
  text-overflow: ellipsis;
  white-space: nowrap;
}

@media (min-width: 768px) {
  .gf-interface__grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
}

@media (min-width: 1024px) {
  .gf-interface {
    padding: 128px 0;
  }
}

@media (max-width: 720px) {
  .gf-interface {
    padding: 80px 0;
  }

  .gf-interface__grid {
    margin-top: 44px;
  }
}

/* ---------- Demo CTA / Form section ---------- */

.gf-demo-cta {
  position: relative;
  overflow: hidden;
  border-top: 1px solid var(--gf-border);
  padding: 96px 0;
}

.gf-demo-cta__background {
  pointer-events: none;
  position: absolute;
  inset: 0;
  z-index: -2;
  opacity: 0.7;
  background:
    radial-gradient(ellipse at 50% 30%, rgba(255, 25, 156, 0.45), transparent 55%),
    radial-gradient(ellipse at 50% 80%, rgba(198, 6, 115, 0.4), transparent 55%);
}

.gf-demo-cta__grid {
  pointer-events: none;
  position: absolute;
  inset: 0;
  z-index: -1;
  opacity: 0.06;
  background-image: radial-gradient(circle at 1px 1px, rgba(255, 73, 199, 0.8) 1px, transparent 0);
  background-size: 28px 28px;
}

.gf-demo-cta__intro {
  max-width: 780px;
  margin-inline: auto;
  text-align: center;
}

.gf-demo-cta__intro .gf-eyebrow {
  margin-inline: auto;
}

.gf-demo-cta__title {
  margin-top: 20px;
  word-break: keep-all;
}

.gf-demo-cta__description {
  max-width: 620px;
  margin: 24px auto 0;
  color: var(--gf-text-muted);
  font-size: 18px;
  line-height: 1.7;
}

.gf-demo-form {
  max-width: 780px;
  margin: 48px auto 0;
  padding: 28px;
  border-radius: 28px;
  color: var(--gf-text-dark);
  background: #ffffff;
  box-shadow:
    0 30px 80px -30px rgba(255, 25, 156, 0.45),
    0 0 0 1px rgba(0, 0, 0, 0.04);
}

.gf-demo-form__grid {
  display: grid;
  gap: 16px;
}

.gf-field {
  min-width: 0;
}

.gf-field--full {
  grid-column: 1 / -1;
}

.gf-field__label {
  display: block;
  margin-bottom: 6px;
  color: #737373;
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.14em;
  text-transform: uppercase;
}

.gf-field__control {
  display: block;
  width: 100%;
  min-height: 48px;
  padding: 12px 16px;
  border: 1px solid #e5e5e5;
  border-radius: 14px;
  outline: none;
  color: #171717;
  background: #ffffff;
  font-family: "DM Sans", system-ui, sans-serif;
  font-size: 14px;
  line-height: 1.4;
  transition:
    border-color 0.2s ease,
    box-shadow 0.2s ease;
}

.gf-field__control:focus {
  border-color: var(--gf-magenta);
  box-shadow: 0 0 0 4px rgba(198, 6, 115, 0.08);
}

.gf-field__textarea {
  min-height: 116px;
  resize: vertical;
}

.gf-demo-form__privacy {
  display: flex;
  align-items: flex-start;
  gap: 12px;
  margin-top: 20px;
  color: #525252;
  font-size: 12px;
  line-height: 1.5;
}

.gf-demo-form__privacy input {
  width: 16px;
  height: 16px;
  flex-shrink: 0;
  margin-top: 2px;
  accent-color: var(--gf-magenta);
}

.gf-demo-form__submit {
  width: 100%;
  margin-top: 24px;
  border: 0;
  cursor: pointer;
  font-family: "DM Sans", system-ui, sans-serif;
}

.gf-demo-form__success {
  display: none;
  padding: 64px 16px;
  text-align: center;
}

.gf-demo-form.is-submitted .gf-demo-form__fields {
  display: none;
}

.gf-demo-form.is-submitted .gf-demo-form__success {
  display: block;
}

.gf-demo-form__success-icon {
  display: grid;
  width: 56px;
  height: 56px;
  margin-inline: auto;
  place-items: center;
  border-radius: 999px;
  background: var(--gf-gradient-brand);
  box-shadow: 0 20px 48px -18px rgba(255, 25, 156, 0.9);
}

.gf-demo-form__success-title {
  margin: 20px 0 0;
  color: var(--gf-text-dark);
  font-size: 26px;
  font-weight: 700;
  line-height: 1.15;
  letter-spacing: -0.04em;
}

.gf-demo-form__success-text {
  margin: 8px 0 0;
  color: #525252;
  font-size: 14px;
  line-height: 1.6;
}

@media (min-width: 640px) {
  .gf-demo-form {
    padding: 36px;
  }

  .gf-demo-form__grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (min-width: 1024px) {
  .gf-demo-cta {
    padding: 128px 0;
  }
}

@media (max-width: 720px) {
  .gf-demo-cta {
    padding: 80px 0;
  }

  .gf-demo-form {
    margin-top: 40px;
    padding: 22px;
    border-radius: 24px;
  }
}

/* ---------- Footer ---------- */

.gf-site-footer {
  position: relative;
  border-top: 1px solid var(--gf-border);
  padding: 64px 0 40px;
}

.gf-site-footer__accent {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  height: 1px;
  background: linear-gradient(90deg, transparent, var(--gf-magenta), transparent);
}

.gf-site-footer__inner {
  display: grid;
  gap: 48px;
}

.gf-site-footer__brand {
  min-width: 0;
}

.gf-site-footer__address {
  max-width: 420px;
  margin: 16px 0 0;
  color: var(--gf-text-muted);
  font-size: 12px;
  font-style: normal;
  line-height: 1.7;
}

.gf-site-footer__contacts {
  min-width: 0;
}

.gf-site-footer__label {
  color: var(--gf-text-muted);
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.14em;
  text-transform: uppercase;
}

.gf-site-footer__link {
  display: inline-block;
  margin-top: 16px;
  color: var(--gf-text-muted);
  font-size: 14px;
  transition: color 0.2s ease;
}

.gf-site-footer__link:hover,
.gf-site-footer__link:focus-visible {
  color: var(--gf-foreground);
}

.gf-site-footer__social {
  display: inline-flex;
  width: 36px;
  height: 36px;
  align-items: center;
  justify-content: center;
  margin-top: 12px;
  border: 1px solid var(--gf-border);
  border-radius: 999px;
  color: var(--gf-text-muted);
  background: color-mix(in oklab, var(--gf-surface) 80%, transparent);
  transition:
    color 0.2s ease,
    border-color 0.2s ease,
    background 0.2s ease,
    transform 0.2s ease;
}

.gf-site-footer__social:hover,
.gf-site-footer__social:focus-visible {
  color: var(--gf-fuchsia);
  border-color: color-mix(in oklab, var(--gf-magenta) 45%, transparent);
  background: color-mix(in oklab, var(--gf-magenta) 10%, transparent);
  transform: translateY(-1px);
}

.gf-site-footer__bottom {
  margin-top: 56px;
}

.gf-site-footer__copyright {
  margin: 0;
  color: var(--gf-text-muted);
  font-size: 12px;
  line-height: 1.6;
}

@media (min-width: 1024px) {
  .gf-site-footer__inner {
    grid-template-columns: 1.4fr 1fr;
  }
}

@media (max-width: 720px) {
  .gf-site-footer {
    padding: 56px 0 34px;
  }

  .gf-site-footer__bottom {
    margin-top: 44px;
  }
}

/* ---------- Coming soon page ---------- */

.gf-coming-soon {
  position: relative;
  min-height: calc(100vh - 72px);
  overflow: hidden;
  display: flex;
  align-items: center;
  padding: 96px 0;
}

.gf-coming-soon__background {
  pointer-events: none;
  position: absolute;
  inset: 0;
  z-index: -1;
}

.gf-coming-soon__orb {
  position: absolute;
  border-radius: 999px;
  filter: blur(72px);
}

.gf-coming-soon__orb--one {
  top: -160px;
  left: -120px;
  width: 520px;
  height: 520px;
  background: radial-gradient(circle, rgba(198, 6, 115, 0.42), transparent 62%);
}

.gf-coming-soon__orb--two {
  right: -140px;
  bottom: -120px;
  width: 620px;
  height: 620px;
  background: radial-gradient(circle, rgba(255, 25, 156, 0.38), transparent 64%);
}

.gf-coming-soon__grid {
  position: absolute;
  inset: 0;
  opacity: 0.35;
  background-image: radial-gradient(circle at 1px 1px, rgba(255, 73, 199, 0.18) 1px, transparent 0);
  background-size: 28px 28px;
  mask-image: radial-gradient(ellipse at center, black, transparent 74%);
  -webkit-mask-image: radial-gradient(ellipse at center, black, transparent 74%);
}

.gf-coming-soon__inner {
  display: grid;
  align-items: center;
  gap: 64px;
}

.gf-coming-soon__content {
  max-width: 780px;
}

.gf-coming-soon__title {
  margin: 24px 0 0;
  color: var(--gf-foreground);
  font-size: clamp(48px, 8vw, 88px);
  font-weight: 700;
  line-height: 0.98;
  letter-spacing: -0.065em;
  text-wrap: balance;
}

.gf-coming-soon__description {
  max-width: 620px;
  margin: 28px 0 0;
  color: var(--gf-text-muted);
  font-size: 18px;
  line-height: 1.7;
}

.gf-coming-soon__actions {
  display: flex;
  flex-wrap: wrap;
  gap: 16px;
  margin-top: 36px;
}

.gf-coming-soon__microcopy {
  margin: 24px 0 0;
  color: var(--gf-text-muted);
  font-size: 14px;
}

.gf-coming-soon__visual {
  display: flex;
  justify-content: center;
}

.gf-coming-soon-card {
  position: relative;
  width: min(100%, 420px);
  padding: 28px;
  border: 1px solid var(--gf-border);
  border-radius: 28px;
  background:
    linear-gradient(180deg, color-mix(in oklab, var(--gf-surface) 92%, transparent), var(--gf-surface)),
    radial-gradient(circle at 80% 0%, rgba(255, 25, 156, 0.18), transparent 40%);
  box-shadow: 0 30px 90px -36px rgba(255, 25, 156, 0.5);
}

.gf-coming-soon-card__top {
  display: flex;
  justify-content: space-between;
  gap: 16px;
  color: var(--gf-text-muted);
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.14em;
  text-transform: uppercase;
}

.gf-coming-soon-card__mark {
  display: flex;
  justify-content: center;
  margin-top: 56px;
  transform: scale(1.35);
}

.gf-coming-soon-card__status {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  margin-top: 56px;
  padding: 12px 16px;
  border: 1px solid color-mix(in oklab, var(--gf-magenta) 28%, transparent);
  border-radius: 999px;
  color: var(--gf-text-muted);
  background: color-mix(in oklab, var(--gf-magenta) 10%, transparent);
  font-size: 12px;
}

.gf-coming-soon-card__dot {
  width: 7px;
  height: 7px;
  border-radius: 999px;
  background: var(--gf-magenta);
  box-shadow: 0 0 18px rgba(255, 25, 156, 0.7);
  animation: gf-pulse-glow 3.5s ease-in-out infinite;
}

.gf-coming-soon-card__bars {
  display: grid;
  gap: 10px;
  margin-top: 28px;
}

.gf-coming-soon-card__bars span {
  display: block;
  height: 9px;
  border-radius: 999px;
  background: linear-gradient(
    90deg,
    color-mix(in oklab, var(--gf-magenta) 35%, transparent),
    transparent
  );
}

.gf-coming-soon-card__bars span:nth-child(2) {
  width: 76%;
}

.gf-coming-soon-card__bars span:nth-child(3) {
  width: 54%;
}

@media (min-width: 1024px) {
  .gf-coming-soon__inner {
    grid-template-columns: 1.1fr 0.9fr;
  }

  .gf-coming-soon__visual {
    justify-content: flex-end;
  }
}

@media (max-width: 720px) {
  .gf-coming-soon {
    padding: 72px 0;
  }

  .gf-coming-soon__inner {
    gap: 52px;
  }

  .gf-coming-soon__title {
    font-size: clamp(42px, 13vw, 58px);
  }

  .gf-coming-soon__description {
    font-size: 16px;
  }

  .gf-coming-soon-card {
    padding: 24px;
  }
}

/* ---------- Thank you page ---------- */

.gf-thank-you {
  position: relative;
  min-height: calc(100vh - 72px);
  overflow: hidden;
  display: flex;
  align-items: center;
  padding: 96px 0;
}

.gf-thank-you__background {
  pointer-events: none;
  position: absolute;
  inset: 0;
  z-index: -1;
}

.gf-thank-you__orb {
  position: absolute;
  border-radius: 999px;
  filter: blur(72px);
}

.gf-thank-you__orb--one {
  top: -160px;
  left: -120px;
  width: 520px;
  height: 520px;
  background: radial-gradient(circle, rgba(198, 6, 115, 0.42), transparent 62%);
}

.gf-thank-you__orb--two {
  right: -140px;
  bottom: -120px;
  width: 620px;
  height: 620px;
  background: radial-gradient(circle, rgba(255, 25, 156, 0.38), transparent 64%);
}

.gf-thank-you__grid {
  position: absolute;
  inset: 0;
  opacity: 0.35;
  background-image: radial-gradient(circle at 1px 1px, rgba(255, 73, 199, 0.18) 1px, transparent 0);
  background-size: 28px 28px;
  mask-image: radial-gradient(ellipse at center, black, transparent 74%);
  -webkit-mask-image: radial-gradient(ellipse at center, black, transparent 74%);
}

.gf-thank-you__inner {
  display: flex;
  justify-content: center;
}

.gf-thank-you__card {
  width: min(100%, 820px);
  padding: clamp(32px, 6vw, 72px);
  border: 1px solid var(--gf-border);
  border-radius: 32px;
  text-align: center;
  background:
    linear-gradient(180deg, color-mix(in oklab, var(--gf-surface) 94%, transparent), var(--gf-surface)),
    radial-gradient(circle at 50% 0%, rgba(255, 25, 156, 0.18), transparent 42%);
  box-shadow: 0 30px 90px -36px rgba(255, 25, 156, 0.5);
}

.gf-thank-you__icon {
  display: grid;
  width: 68px;
  height: 68px;
  margin-inline: auto;
  place-items: center;
  border-radius: 999px;
  background: var(--gf-gradient-brand);
  box-shadow: 0 22px 60px -22px rgba(255, 25, 156, 0.9);
}

.gf-thank-you__eyebrow {
  margin-top: 28px;
}

.gf-thank-you__title {
  max-width: 720px;
  margin: 24px auto 0;
  color: var(--gf-foreground);
  font-size: clamp(42px, 7vw, 72px);
  font-weight: 700;
  line-height: 1;
  letter-spacing: -0.06em;
  text-wrap: balance;
}

.gf-thank-you__description {
  max-width: 620px;
  margin: 26px auto 0;
  color: var(--gf-text-muted);
  font-size: 18px;
  line-height: 1.7;
}

.gf-thank-you__actions {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 14px;
  margin-top: 36px;
}

.gf-thank-you__microcopy {
  margin: 28px 0 0;
  color: var(--gf-text-muted);
  font-size: 14px;
}

@media (max-width: 720px) {
  .gf-thank-you {
    padding: 72px 0;
  }

  .gf-thank-you__card {
    border-radius: 26px;
  }

  .gf-thank-you__description {
    font-size: 16px;
  }

  .gf-thank-you__actions {
    flex-direction: column;
  }

  .gf-thank-you__actions .gf-btn {
    width: 100%;
  }
}

/* ---------- Coming soon standalone corrections ---------- */

.gf-coming-soon-page .site {
  min-height: 100vh;
}

.gf-coming-soon-page .gf-coming-soon {
  min-height: 100vh;
  padding: 72px 0;
}

.gf-coming-soon__logo {
  display: inline-flex;
  margin-bottom: 32px;
}

.gf-coming-soon__logo .gf-logo {
  pointer-events: auto;
}

.gf-coming-soon__logo .gf-logo__mark {
  width: 36px;
  height: 36px;
}

.gf-coming-soon__logo .gf-logo__text {
  font-size: 18px;
}

@media (max-width: 720px) {
  .gf-coming-soon-page .gf-coming-soon {
    padding: 56px 0;
  }

  .gf-coming-soon__logo {
    margin-bottom: 28px;
  }
}

/* ---------- Coming soon Lovable-aligned version ---------- */

.gf-coming-soon--lovable {
  min-height: calc(100vh - 300px);
  display: block;
  padding: 22px 0 150px;
  border-bottom: 1px solid color-mix(in oklab, var(--gf-magenta) 32%, transparent);
}

.gf-coming-soon--lovable .gf-coming-soon__inner {
  display: flex;
  min-height: inherit;
  flex-direction: column;
  align-items: center;
  gap: 0;
}

.gf-coming-soon__top-logo {
  display: flex;
  justify-content: center;
  width: 100%;
}

.gf-coming-soon__top-logo .gf-logo {
  pointer-events: auto;
}

.gf-coming-soon__top-logo .gf-logo__mark {
  width: 32px;
  height: 32px;
}

.gf-coming-soon__top-logo .gf-logo__text {
  font-size: 17px;
  font-weight: 700;
}

.gf-coming-soon__content--centered {
  max-width: 760px;
  margin-top: clamp(130px, 18vh, 210px);
  text-align: center;
}

.gf-coming-soon__content--centered .gf-eyebrow {
  margin-inline: auto;
}

.gf-coming-soon--lovable .gf-coming-soon__title {
  margin-top: 28px;
  font-size: clamp(52px, 6.4vw, 82px);
  line-height: 0.94;
  letter-spacing: -0.075em;
}

.gf-coming-soon--lovable .gf-coming-soon__description {
  max-width: 620px;
  margin: 28px auto 0;
  font-size: 18px;
  line-height: 1.75;
}

.gf-coming-soon--lovable .gf-coming-soon__microcopy {
  margin-top: 34px;
  color: var(--gf-text-muted);
  font-size: 14px;
}

.gf-coming-soon--lovable .gf-coming-soon__orb--one {
  top: -220px;
  left: -160px;
  opacity: 0.65;
}

.gf-coming-soon--lovable .gf-coming-soon__orb--two {
  right: -220px;
  bottom: -220px;
  opacity: 0.55;
}

.gf-coming-soon--lovable .gf-coming-soon__grid {
  opacity: 0.16;
}

.gf-coming-soon-page .gf-site-footer {
  border-top: 0;
}

@media (max-width: 720px) {
  .gf-coming-soon--lovable {
    min-height: calc(100vh - 360px);
    padding: 22px 0 96px;
  }

  .gf-coming-soon__content--centered {
    margin-top: 96px;
  }

  .gf-coming-soon--lovable .gf-coming-soon__title {
    font-size: clamp(44px, 13vw, 58px);
  }

  .gf-coming-soon--lovable .gf-coming-soon__description {
    font-size: 16px;
  }
}

/* ---------- Coming soon final layout fix ---------- */

body.gf-coming-soon-page .gf-coming-soon--lovable {
  min-height: calc(100vh - 270px);
  display: flex;
  align-items: center;
  padding: 96px 0 140px;
  border-bottom: 1px solid color-mix(in oklab, var(--gf-magenta) 32%, transparent);
}

body.gf-coming-soon-page .gf-coming-soon--lovable .gf-coming-soon__inner {
  display: flex !important;
  width: min(100% - 40px, 1180px);
  min-height: auto;
  flex-direction: column !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 0 !important;
  margin-inline: auto;
}

body.gf-coming-soon-page .gf-coming-soon__top-logo {
  position: absolute;
  top: 28px;
  left: 50%;
  display: flex !important;
  justify-content: center;
  width: auto;
  transform: translateX(-50%);
  z-index: 2;
}

body.admin-bar.gf-coming-soon-page .gf-coming-soon__top-logo {
  top: 30px;
}

body.gf-coming-soon-page .gf-coming-soon__content--centered {
  width: min(100%, 760px);
  max-width: 760px;
  margin: 0 auto !important;
  text-align: center;
}

body.gf-coming-soon-page .gf-coming-soon__content--centered .gf-eyebrow {
  margin-inline: auto;
}

body.gf-coming-soon-page .gf-coming-soon--lovable .gf-coming-soon__title {
  margin-top: 28px;
  font-size: clamp(54px, 5.8vw, 82px);
  line-height: 0.96;
  letter-spacing: -0.075em;
  text-align: center;
}

body.gf-coming-soon-page .gf-coming-soon--lovable .gf-coming-soon__description {
  max-width: 620px;
  margin: 28px auto 0;
  color: var(--gf-text-muted);
  font-size: 18px;
  line-height: 1.75;
  text-align: center;
}

body.gf-coming-soon-page .gf-coming-soon--lovable .gf-coming-soon__microcopy {
  margin: 34px auto 0;
  color: var(--gf-text-muted);
  font-size: 14px;
  text-align: center;
}

body.gf-coming-soon-page .gf-coming-soon__visual {
  display: none !important;
}

body.gf-coming-soon-page .gf-site-footer {
  border-top: 0;
}

@media (max-width: 720px) {
  body.gf-coming-soon-page .gf-coming-soon--lovable {
    min-height: calc(100vh - 330px);
    padding: 96px 0 90px;
  }

  body.gf-coming-soon-page .gf-coming-soon__top-logo {
    top: 24px;
  }

  body.admin-bar.gf-coming-soon-page .gf-coming-soon__top-logo {
    top: 60px;
  }

  body.gf-coming-soon-page .gf-coming-soon--lovable .gf-coming-soon__title {
    font-size: clamp(44px, 13vw, 58px);
  }

  body.gf-coming-soon-page .gf-coming-soon--lovable .gf-coming-soon__description {
    font-size: 16px;
  }
}


/* ---------- WP Visual Lite Editor compatibility ---------- */

.gf-logo__image {
  display: block;
  width: 100%;
  height: auto;
  object-fit: contain;
}

[data-wpve-editable="1"] {
  min-width: 1px;
}


/* ---------- WelcomeFlow logo sizing corrections ---------- */

.gf-coming-soon__top-logo .gf-logo__mark,
.gf-thank-you__top-logo .gf-logo__mark {
  width: 280px !important;
  height: 32px !important;
}

.gf-coming-soon__logo .gf-logo__mark {
  width: 132px !important;
  height: 32px !important;
}

/* ---------- Thank you Lovable-aligned WPVE version ---------- */

body.gf-thank-you-page .gf-thank-you--lovable {
  position: relative;
  min-height: calc(100vh - 300px);
  display: flex;
  align-items: center;
  overflow: hidden;
  padding: 96px 0 140px;
  border-bottom: 1px solid color-mix(in oklab, var(--gf-magenta) 32%, transparent);
}

body.gf-thank-you-page .gf-thank-you--lovable .gf-thank-you__inner {
  display: flex !important;
  width: min(100% - 40px, 1180px);
  min-height: auto;
  flex-direction: column !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 0 !important;
  margin-inline: auto;
}

body.gf-thank-you-page .gf-thank-you__top-logo {
  position: absolute;
  top: 28px;
  left: 50%;
  display: flex;
  justify-content: center;
  width: auto;
  transform: translateX(-50%);
  z-index: 2;
}

body.admin-bar.gf-thank-you-page .gf-thank-you__top-logo {
  top: 30px;
}

body.gf-thank-you-page .gf-thank-you__top-logo .gf-logo__mark {
  width: 280px !important;
  height: 32px !important;
}

body.gf-thank-you-page .gf-thank-you__top-logo .gf-logo__text {
  font-size: 17px;
  font-weight: 700;
}

body.gf-thank-you-page .gf-thank-you__content {
  width: min(100%, 760px);
  max-width: 760px;
  margin: 0 auto;
  padding: 0;
  border: 0;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
  text-align: center;
}

body.gf-thank-you-page .gf-thank-you__icon {
  display: grid;
  width: 64px;
  height: 64px;
  margin: 20px auto 8px;
  place-items: center;
  border-radius: 999px;
  background: var(--gf-gradient-brand);
  box-shadow: 0 22px 60px -22px rgba(255, 25, 156, 0.9);
}

body.gf-thank-you-page .gf-thank-you__eyebrow {
  margin-inline: auto;
}

body.gf-thank-you-page .gf-thank-you__title {
  max-width: 760px;
  margin: 28px auto 0;
  color: var(--gf-foreground);
  font-size: clamp(54px, 5.8vw, 82px);
  font-weight: 700;
  line-height: 0.96;
  letter-spacing: -0.075em;
  text-align: center;
  text-wrap: balance;
}

body.gf-thank-you-page .gf-thank-you__description {
  max-width: 620px;
  margin: 32px auto 0;
  color: var(--gf-text-muted);
  font-size: 18px;
  line-height: 1.75;
  text-align: center;
}

body.gf-thank-you-page .gf-thank-you__actions {
  display: flex;
  justify-content: center;
  margin-top: 40px;
}

body.gf-thank-you-page .gf-thank-you__actions .gf-btn {
  min-width: 160px;
}

body.gf-thank-you-page .gf-thank-you__microcopy {
  display: none;
}

body.gf-thank-you-page .gf-thank-you__card {
  display: contents;
}

body.gf-thank-you-page .gf-thank-you__orb--one {
  top: -220px;
  left: -160px;
  opacity: 0.65;
}

body.gf-thank-you-page .gf-thank-you__orb--two {
  right: -220px;
  bottom: -220px;
  opacity: 0.55;
}

body.gf-thank-you-page .gf-thank-you__grid {
  opacity: 0.16;
}

body.gf-thank-you-page .gf-site-footer {
  border-top: 0;
}

@media (max-width: 720px) {
  body.gf-thank-you-page .gf-thank-you--lovable {
    min-height: calc(100vh - 330px);
    padding: 96px 0 90px;
  }

  body.gf-thank-you-page .gf-thank-you__top-logo {
    top: 24px;
  }

  body.admin-bar.gf-thank-you-page .gf-thank-you__top-logo {
    top: 60px;
  }

  body.gf-thank-you-page .gf-thank-you__title {
    font-size: clamp(44px, 13vw, 58px);
  }

  body.gf-thank-you-page .gf-thank-you__description {
    font-size: 16px;
  }

  body.gf-thank-you-page .gf-thank-you__actions {
    flex-direction: column;
  }

  body.gf-thank-you-page .gf-thank-you__actions .gf-btn {
    width: 100%;
  }
}