:root {
  --brand-blue-600: #0b58c9;
  --brand-blue-500: #0a5ad1;
  --brand-blue-700: #074bb1;
  --brand-blue-800: #02229c;
  --brand-navy-900: #00175d;
  --brand-cyan-400: #00b3db;
  --brand-cyan-600: #008bae;
  --ink-950: #07111f;
  --ink-900: #0d1b2a;
  --ink-700: #334155;
  --ink-500: #64748b;
  --surface-0: #ffffff;
  --surface-50: #f5f8ff;
  --surface-100: #eaf1ff;
  --surface-900: #07111f;
  --success: #0a8f5b;
  --warning: #b7791f;
  --danger: #c43d4b;
  --color-primary: #0b58c9;
  --color-primary-hover: #074bb1;
  --color-primary-active: #02229c;
  --color-accent: #00b3db;
  --color-heading: #07111f;
  --color-body: #334155;
  --color-muted: #64748b;
  --color-page-bg: #f5f8ff;
  --color-dark-bg: #07111f;
  --color-card-bg: rgba(255, 255, 255, 0.68);
  --color-card-border: rgba(255, 255, 255, 0.52);
  --gradient-brand: linear-gradient(135deg, #00175d 0%, #074bb1 38%, #0b58c9 68%, #00b3db 100%);
  --gradient-glass-highlight: linear-gradient(135deg, rgba(255,255,255,.3), rgba(11,88,201,.08), rgba(0,179,219,.1));
  --glass-bg: linear-gradient(135deg, rgba(255,255,255,.16), rgba(255,255,255,.06));
  --glass-border: rgba(255, 255, 255, 0.22);
  --glass-shadow: inset 0 1px 0 rgba(255,255,255,.2), 0 18px 60px rgba(2,18,30,.14);
  --button-primary-bg: linear-gradient(135deg, #0b58c9 0%, #074bb1 58%, #00175d 100%);
  --button-primary-text: #ffffff;
  --button-primary-shadow: 0 18px 42px rgba(11, 88, 201, .34);
  --button-secondary-bg: rgba(255, 255, 255, .94);
  --button-secondary-text: #07111f;
  --button-secondary-border: rgba(255, 255, 255, .76);
  --button-light-bg: rgba(255, 255, 255, .16);
  --button-light-text: #ffffff;
  --button-light-border: rgba(255, 255, 255, .34);
  --button-dark-bg: #07111f;
  --button-dark-text: #ffffff;
  --font-heading: "Manrope", Arial, Helvetica, sans-serif;
  --font-body: "Inter", Arial, Helvetica, sans-serif;
}

*,
*::before,
*::after { box-sizing: border-box; }

html {
  scroll-behavior: smooth;
  background: var(--color-page-bg);
}

body {
  margin: 0;
  color: var(--color-body);
  background:
    radial-gradient(circle at 15% 10%, rgba(0, 179, 219, .16), transparent 28rem),
    linear-gradient(180deg, #f9fbff 0%, #eef5ff 45%, #ffffff 100%);
  font-family: var(--font-body);
  line-height: 1.5;
}

body.togrow-modal-open { overflow: hidden; }

a { color: inherit; text-decoration: none; }
button, input, textarea { font: inherit; }
img { max-width: 100%; display: block; }

.tg-app { min-height: 100vh; overflow: clip; }

.tg-home-story {
  position: relative;
  isolation: isolate;
  min-height: 500svh;
  color: #fff;
  background: var(--ink-950);
}

.tg-container {
  width: min(1180px, calc(100% - 32px));
  margin: 0 auto;
}

.tg-header {
  position: fixed;
  z-index: 50;
  top: 12px;
  left: 0;
  right: 0;
  pointer-events: none;
}

.tg-header__inner {
  min-height: 72px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 20px;
  padding: 12px 14px 12px 20px;
  pointer-events: auto;
  border-radius: 8px;
  background: rgba(255,255,255,.68);
  border: 1px solid rgba(255,255,255,.7);
  box-shadow: 0 16px 50px rgba(8, 32, 70, .12);
  backdrop-filter: blur(18px) saturate(150%);
  -webkit-backdrop-filter: blur(18px) saturate(150%);
  transition: min-height .2s ease, background .2s ease, box-shadow .2s ease;
}

.tg-header.is-scrolled .tg-header__inner {
  min-height: 60px;
  background: rgba(255,255,255,.9);
  box-shadow: 0 12px 38px rgba(8, 32, 70, .14);
}

.tg-logo { width: 150px; flex: 0 0 auto; }

.tg-nav {
  display: flex;
  align-items: center;
  gap: 18px;
  color: var(--ink-700);
  font-size: 14px;
  font-weight: 700;
}

.tg-nav a { white-space: nowrap; }
.tg-nav a:hover { color: var(--color-primary); }

.tg-header__actions {
  display: flex;
  align-items: center;
  gap: 10px;
}

.tg-btn {
  min-height: 44px;
  border: 1px solid transparent;
  border-radius: 8px;
  padding: 0 18px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  font-family: var(--font-heading);
  font-weight: 800;
  color: var(--button-secondary-text);
  cursor: pointer;
  background: var(--button-secondary-bg);
  border-color: var(--button-secondary-border);
  box-shadow: 0 12px 28px rgba(7, 17, 31, .1);
  text-align: center;
  white-space: nowrap;
  transition: transform .18s ease, box-shadow .18s ease, background .18s ease, border-color .18s ease;
}

.tg-btn:hover { transform: translateY(-1px); box-shadow: 0 16px 34px rgba(7, 17, 31, .16); }
.tg-btn:focus-visible { outline: 3px solid rgba(0,179,219,.42); outline-offset: 3px; }
.tg-btn--primary { color: var(--button-primary-text); background: var(--button-primary-bg); box-shadow: var(--button-primary-shadow); border-color: rgba(255,255,255,.16); }
.tg-btn--primary:hover { box-shadow: 0 22px 48px rgba(11, 88, 201, .42); }
.tg-btn--secondary { color: var(--button-secondary-text); background: var(--button-secondary-bg); border-color: var(--button-secondary-border); }
.tg-btn--light { color: var(--button-light-text); background: var(--button-light-bg); border-color: var(--button-light-border); box-shadow: inset 0 1px 0 rgba(255,255,255,.18), 0 14px 34px rgba(0,0,0,.18); }
.tg-btn--dark { color: var(--button-dark-text); background: var(--button-dark-bg); border-color: rgba(255,255,255,.12); }
.tg-btn--ghost { color: var(--color-primary); background: rgba(255,255,255,.82); border-color: rgba(11,88,201,.18); box-shadow: none; }
.tg-btn--wide { width: 100%; }

.tg-menu-button { display: none; width: 44px; padding: 0; }
.tg-menu-button span,
.tg-menu-button::before,
.tg-menu-button::after {
  content: "";
  width: 18px;
  height: 2px;
  background: currentColor;
  display: block;
}
.tg-menu-button { flex-direction: column; }

.tg-hero {
  min-height: 100svh;
  position: relative;
  isolation: isolate;
}

.tg-hero__stage {
  min-height: 100svh;
  display: grid;
  align-items: center;
  padding: 112px 0 38px;
}

.tg-hero__grid {
  display: block;
  align-items: center;
}

.tg-hero__copy {
  position: relative;
  z-index: 2;
  padding: 30px;
  border-radius: 8px;
  background: linear-gradient(135deg, rgba(255,255,255,.82), rgba(255,255,255,.48));
  border: 1px solid rgba(255,255,255,.72);
  box-shadow: var(--glass-shadow);
  backdrop-filter: blur(22px) saturate(140%);
  -webkit-backdrop-filter: blur(22px) saturate(140%);
}

.tg-eyebrow {
  margin: 0 0 12px;
  color: var(--color-primary);
  font-size: 13px;
  font-weight: 800;
}

.tg-hero h1,
.tg-section h2,
.tg-final h2,
.tg-page-hero h1 {
  margin: 0;
  color: var(--color-heading);
  font-family: var(--font-heading);
  line-height: .98;
  letter-spacing: 0;
}

.tg-hero h1 { font-size: clamp(48px, 8vw, 94px); }
.tg-section h2,
.tg-final h2,
.tg-page-hero h1 { font-size: clamp(34px, 5vw, 62px); }

.tg-lede {
  margin: 18px 0 0;
  max-width: 640px;
  color: var(--ink-700);
  font-size: clamp(17px, 2vw, 21px);
}

.tg-hero__actions,
.tg-section__actions {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
  margin-top: 28px;
}

.tg-trustline {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  margin-top: 24px;
  padding: 0;
  list-style: none;
  color: var(--ink-700);
  font-size: 13px;
  font-weight: 700;
}

.tg-trustline li {
  padding: 8px 10px;
  border-radius: 8px;
  background: rgba(255,255,255,.58);
}

.tg-hero__visual {
  position: relative;
  aspect-ratio: 1112 / 834;
  min-height: 360px;
}

.tg-home-backdrop {
  position: fixed;
  z-index: 0;
  inset: 0;
  width: 100vw;
  height: 100svh;
  min-height: 100svh;
  aspect-ratio: auto;
  pointer-events: none;
  overflow: hidden;
  background: #07111f;
}

.tg-frame-canvas,
.tg-frame-fallback {
  width: 100%;
  height: 100%;
  border-radius: 0;
  object-fit: cover;
  background: #dce8fa;
  box-shadow: none;
}

.tg-frame-fallback { position: absolute; inset: 0; }

.tg-frame-canvas { position: relative; z-index: 2; }

.tg-frame-vignette {
  position: absolute;
  z-index: 3;
  inset: 0;
  background:
    radial-gradient(circle at 74% 46%, rgba(0, 179, 219, .08), transparent 28rem),
    linear-gradient(90deg, rgba(7, 17, 31, .88), rgba(7, 17, 31, .52) 42%, rgba(7, 17, 31, .18) 100%),
    linear-gradient(180deg, rgba(7, 17, 31, .42), transparent 30%, rgba(7, 17, 31, .58));
}

.tg-scene-card {
  position: absolute;
  right: 18px;
  bottom: 18px;
  max-width: 280px;
  padding: 18px;
  border-radius: 8px;
  color: #fff;
  background: rgba(7, 17, 31, .78);
  border: 1px solid rgba(255,255,255,.18);
  backdrop-filter: blur(20px);
}

.tg-scene-card strong {
  display: block;
  font-family: var(--font-heading);
  font-size: 18px;
}

.tg-section {
  position: relative;
  padding: clamp(72px, 10vw, 132px) 0;
}

.tg-home-panel {
  position: relative;
  z-index: 2;
  min-height: 100svh;
  display: grid;
  align-items: center;
  padding: 112px 0 52px;
  color: rgba(255,255,255,.84);
  background: transparent;
}

.tg-home-panel h1,
.tg-home-panel h2,
.tg-home-panel .tg-lede,
.tg-home-panel .tg-section__head h2 {
  color: #fff;
}

.tg-home-panel .tg-lede,
.tg-home-panel p {
  color: rgba(255,255,255,.86);
}

.tg-fullscreen-card {
  width: min(760px, 100%);
  padding: clamp(22px, 4vw, 38px);
  border-radius: 8px;
  background:
    linear-gradient(135deg, rgba(255,255,255,.2), rgba(255,255,255,.08)),
    rgba(7,17,31,.52);
  border: 1px solid rgba(255,255,255,.28);
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.18),
    0 24px 90px rgba(0,0,0,.24);
  backdrop-filter: blur(24px) saturate(145%);
  -webkit-backdrop-filter: blur(24px) saturate(145%);
}

.tg-home-panel:nth-of-type(even) .tg-fullscreen-card {
  margin-left: auto;
}

.tg-home-panel .tg-card {
  background:
    linear-gradient(135deg, rgba(255,255,255,.18), rgba(255,255,255,.08)),
    rgba(255,255,255,.08);
  border-color: rgba(255,255,255,.2);
  color: rgba(255,255,255,.78);
}

.tg-home-panel .tg-card h3,
.tg-home-panel .tg-price {
  color: #fff;
}

.tg-home-panel .tg-card p,
.tg-home-panel .tg-feature-list {
  color: rgba(255,255,255,.84);
}

.tg-home-panel .tg-eyebrow {
  color: #77e4ff;
}

.tg-home-panel .tg-trustline {
  color: rgba(255,255,255,.9);
}

.tg-home-panel .tg-trustline li {
  background: rgba(255,255,255,.14);
  border: 1px solid rgba(255,255,255,.2);
}

.tg-section--dark {
  color: rgba(255,255,255,.78);
  background:
    linear-gradient(135deg, rgba(0,179,219,.14), transparent 36%),
    var(--surface-900);
}
.tg-section--dark h2,
.tg-section--dark .tg-card h3 { color: #fff; }
.tg-section--dark .tg-lede { color: rgba(255,255,255,.76); }

.tg-section__head {
  display: flex;
  align-items: end;
  justify-content: space-between;
  gap: 24px;
  margin-bottom: 34px;
}
.tg-section__head .tg-lede { max-width: 520px; margin-top: 0; }

.tg-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 16px;
}

.tg-grid--2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.tg-grid--4 { grid-template-columns: repeat(4, minmax(0, 1fr)); }

.tg-card,
.tg-glass {
  border-radius: 8px;
  padding: 24px;
  background: var(--gradient-glass-highlight), var(--glass-bg);
  border: 1px solid var(--glass-border);
  box-shadow: var(--glass-shadow);
  backdrop-filter: blur(22px) saturate(140%);
  -webkit-backdrop-filter: blur(22px) saturate(140%);
}

.tg-card h3 {
  margin: 0 0 10px;
  color: var(--color-heading);
  font-family: var(--font-heading);
  font-size: 22px;
  line-height: 1.12;
}

.tg-card p { margin: 0; }

.tg-card__meta {
  color: var(--color-primary);
  font-weight: 800;
  font-size: 13px;
}

.tg-product-card {
  display: flex;
  flex-direction: column;
  gap: 18px;
}

.tg-product-card__top {
  display: flex;
  justify-content: space-between;
  gap: 12px;
}

.tg-badge {
  display: inline-flex;
  align-items: center;
  height: 30px;
  padding: 0 10px;
  border-radius: 8px;
  color: #fff;
  background: var(--color-primary);
  font-size: 12px;
  font-weight: 800;
}

.tg-price {
  color: var(--ink-950);
  font-family: var(--font-heading);
  font-size: 30px;
  font-weight: 800;
  font-variant-numeric: tabular-nums;
}

.tg-feature-list {
  display: grid;
  gap: 8px;
  margin: 0;
  padding: 0;
  list-style: none;
}

.tg-feature-list li::before {
  content: "";
  width: 8px;
  height: 8px;
  margin-right: 8px;
  border-radius: 8px;
  display: inline-block;
  background: var(--color-accent);
}

.tg-tabs {
  display: grid;
  grid-template-columns: 260px minmax(0, 1fr);
  gap: 18px;
}

.tg-tabs__nav {
  display: grid;
  gap: 10px;
  align-content: start;
}

.tg-tab-button {
  min-height: 50px;
  border: 1px solid rgba(11,88,201,.12);
  border-radius: 8px;
  text-align: left;
  padding: 0 16px;
  color: var(--ink-700);
  background: rgba(255,255,255,.64);
  cursor: pointer;
  font-weight: 800;
}
.tg-tab-button.is-active { color: #fff; background: var(--gradient-brand); }

.tg-comparison {
  overflow-x: auto;
}
.tg-comparison table {
  width: 100%;
  min-width: 760px;
  border-collapse: separate;
  border-spacing: 0;
  overflow: hidden;
  border-radius: 8px;
}
.tg-comparison th,
.tg-comparison td {
  padding: 16px;
  text-align: left;
  border-bottom: 1px solid rgba(11,88,201,.1);
  background: rgba(255,255,255,.7);
}
.tg-comparison th { color: var(--ink-950); font-family: var(--font-heading); }
.tg-comparison tr:last-child td { border-bottom: 0; }

.tg-faq {
  display: grid;
  gap: 10px;
}
.tg-faq details {
  border-radius: 8px;
  background: rgba(255,255,255,.75);
  border: 1px solid rgba(11,88,201,.1);
  padding: 16px 18px;
}
.tg-faq summary {
  color: var(--ink-950);
  cursor: pointer;
  font-weight: 800;
}

.tg-final {
  margin: 0 auto;
  padding: clamp(42px, 7vw, 78px);
  border-radius: 8px;
  color: #fff;
  background: var(--gradient-brand);
  position: relative;
  overflow: hidden;
}
.tg-final h2 { color: #fff; max-width: 780px; }
.tg-final p { max-width: 640px; color: rgba(255,255,255,.82); }

.tg-footer {
  padding: 46px 0;
  color: rgba(255,255,255,.7);
  background: var(--ink-950);
}
.tg-footer__inner {
  display: flex;
  justify-content: space-between;
  gap: 20px;
  align-items: center;
}
.tg-footer img { width: 130px; filter: brightness(0) invert(1); }

.tg-mobile-cta {
  display: none;
  position: fixed;
  z-index: 45;
  left: 12px;
  right: 12px;
  bottom: 12px;
}

.tg-page-hero {
  padding: 142px 0 54px;
  background: linear-gradient(135deg, rgba(11,88,201,.1), rgba(0,179,219,.08));
}

.tg-dashboard {
  padding-top: 112px;
  min-height: 100vh;
}
.tg-dashboard__layout {
  display: grid;
  grid-template-columns: 260px minmax(0, 1fr);
  gap: 18px;
}
.tg-sidebar { position: sticky; top: 96px; align-self: start; }
.tg-form-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px; }
.tg-form-stack { display: grid; gap: 14px; }
.tg-field { display: grid; gap: 6px; }
.tg-field label { color: var(--ink-950); font-weight: 800; font-size: 13px; }
.tg-field input,
.tg-field textarea,
.tg-field select {
  width: 100%;
  border: 1px solid rgba(11,88,201,.16);
  border-radius: 8px;
  padding: 12px 14px;
  background: rgba(255,255,255,.82);
}
.tg-preview-phone {
  max-width: 340px;
  margin: 0 auto;
  border-radius: 28px;
  padding: 14px;
  background: var(--ink-950);
}
.tg-preview-phone__screen {
  min-height: 580px;
  border-radius: 20px;
  padding: 18px;
  background: #f7fbff;
}
.tg-metric-row {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 12px;
  margin-top: 22px;
}
.tg-metric {
  min-height: 92px;
  display: grid;
  align-content: center;
  gap: 2px;
  padding: 16px;
  border-radius: 8px;
  background: rgba(255,255,255,.72);
  border: 1px solid rgba(11,88,201,.12);
}
.tg-metric strong {
  color: var(--ink-950);
  font-family: var(--font-heading);
  font-size: 34px;
  line-height: 1;
  font-variant-numeric: tabular-nums;
}
.tg-metric span {
  color: var(--ink-700);
  font-weight: 800;
  font-size: 13px;
}
.tg-success,
.tg-error {
  margin: 0;
  padding: 12px 14px;
  border-radius: 8px;
  font-weight: 800;
}
.tg-success {
  color: #063f2a;
  background: rgba(10,143,91,.12);
}
.tg-error {
  color: #6f1e29;
  background: rgba(196,61,75,.12);
}

.tg-profile {
  min-height: 100vh;
  padding: 36px 0;
  background: var(--gradient-brand);
}
.tg-profile__card {
  width: min(460px, calc(100% - 24px));
  margin: 0 auto;
  color: var(--ink-950);
}

.tg-wp-content {
  width: min(900px, calc(100% - 32px));
  margin: 0 auto;
  padding: 140px 0 80px;
}

@media (max-width: 980px) {
  .tg-nav,
  .tg-header__actions .tg-btn--ghost { display: none; }
  .tg-menu-button { display: inline-flex; }
  .tg-nav.is-open {
    display: grid;
    position: absolute;
    left: 16px;
    right: 16px;
    top: 86px;
    padding: 16px;
    border-radius: 8px;
    background: rgba(255,255,255,.94);
    box-shadow: 0 18px 50px rgba(8, 32, 70, .16);
  }
  .tg-hero__grid,
  .tg-tabs,
  .tg-dashboard__layout { grid-template-columns: 1fr; }
  .tg-hero__copy { order: 2; }
  .tg-hero__visual:not(.tg-home-backdrop) { order: 1; min-height: 0; }
  .tg-grid,
  .tg-grid--2,
  .tg-grid--4 { grid-template-columns: 1fr 1fr; }
}

@media (max-width: 640px) {
  .tg-container { width: min(100% - 24px, 1180px); }
  .tg-header { top: 8px; }
  .tg-header__inner { min-height: 60px; padding: 10px; }
  .tg-logo { width: 126px; }
  .tg-header__actions .tg-btn--primary { display: none; }
  .tg-mobile-cta { display: block; }
  .tg-hero__stage { padding-top: 88px; }
  .tg-hero__copy { padding: 20px; }
  .tg-hero h1 { font-size: clamp(44px, 14vw, 60px); }
  .tg-home-panel { padding: 92px 0 42px; }
  .tg-fullscreen-card { width: 100%; }
  .tg-frame-vignette {
    background:
      linear-gradient(180deg, rgba(7,17,31,.78), rgba(7,17,31,.38) 42%, rgba(7,17,31,.82));
  }
  .tg-section__head { display: block; }
  .tg-section__head .tg-lede { margin-top: 14px; }
  .tg-grid,
  .tg-grid--2,
  .tg-grid--4,
  .tg-form-grid,
  .tg-metric-row { grid-template-columns: 1fr; }
  .tg-scene-card { position: static; margin-top: 12px; max-width: none; color: var(--ink-950); background: rgba(255,255,255,.84); }
  .tg-footer__inner { display: grid; }
}

@media (prefers-reduced-motion: reduce) {
  *,
  *::before,
  *::after {
    scroll-behavior: auto !important;
    transition-duration: .001ms !important;
    animation-duration: .001ms !important;
    animation-iteration-count: 1 !important;
  }
  .tg-hero { min-height: auto; }
}