:root {
  color-scheme: dark;
  --background: #0f1723;
  --background-elevated: #15202d;
  --foreground: #e8f0f7;
  --foreground-soft: #c7d3de;
  --foreground-muted: #92a4b7;
  --card: rgba(25, 38, 53, 0.82);
  --card-strong: #1a2a3a;
  --card-raised: rgba(30, 44, 61, 0.92);
  --muted: #223346;
  --muted-strong: #31465c;
  --border: rgba(148, 163, 184, 0.18);
  --border-strong: rgba(148, 163, 184, 0.26);
  --primary: #d6e6f5;
  --primary-soft: #8db0d1;
  --primary-foreground: #102131;
  --accent: #4ec3b7;
  --accent-soft: rgba(78, 195, 183, 0.14);
  --accent-foreground: #07211f;
  --success: #5fd28f;
  --warning: #f0bd63;
  --danger: #f08b8b;
  --gray-300: #aabacc;
  --gray-700: #c7d3de;
  --shadow-sm: 0 12px 28px rgba(0, 0, 0, 0.28);
  --shadow-md: 0 18px 44px rgba(0, 0, 0, 0.34);
  --shadow-lg: 0 28px 60px rgba(0, 0, 0, 0.42);
  --radius-sm: 14px;
  --radius-md: 22px;
  --radius-lg: 32px;
  --ring: 0 0 0 4px rgba(90, 180, 149, 0.2);
  --max-page: 1200px;
  --font-body: "Source Sans 3", "Segoe UI", sans-serif;
  --font-display: "Manrope", "Segoe UI", sans-serif;
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body {
  margin: 0;
  min-height: 100vh;
  font-family: var(--font-body);
  color: var(--foreground);
  background:
    radial-gradient(circle at top, rgba(153, 246, 228, 0.16), transparent 26%),
    linear-gradient(180deg, var(--background) 0%, var(--background-elevated) 100%);
  letter-spacing: -0.01em;
}

h1,h2,h3,h4,h5,h6,.logo-name,.nav-brand-text h1,.footer-brand-name,.f-name {
  font-family: var(--font-display);
  letter-spacing: -0.03em;
}

a { color: inherit; }
button,input,select,textarea { font: inherit; }
::selection { background: rgba(26, 127, 104, 0.18); }

nav,.nav {
  position: sticky;
  top: 0;
  z-index: 1000;
  color: var(--primary-foreground);
  background: rgba(26, 58, 92, 0.9);
  border-bottom: 1px solid rgba(255, 255, 255, 0.06);
  backdrop-filter: blur(10px);
  box-shadow: 0 8px 20px rgba(5, 10, 18, 0.1);
}
.nav-container,.nav-inner {
  max-width: var(--max-page);
  margin: 0 auto;
  display: flex;
  align-items: center;
  gap: 24px;
  min-height: 68px;
  padding: 0 24px;
  position: relative;
}
.nav-brand,.nav-logo {
  display:flex; align-items:center; gap:12px; text-decoration:none; color:inherit;
}
.nav-brand-text,.logo-text {
  display:flex;
  flex-direction:column;
  justify-content:center;
  gap:2px;
  min-width:0;
}
.nav-brand svg,.nav-logo svg,.footer-brand svg,.f-brand svg { color: var(--accent); flex-shrink:0; }
.nav-brand-text h1,.logo-name { margin:0; font-size:1.08rem; font-weight:800; line-height:1.1; }
.nav-brand-text p,.logo-tag,.f-tag,.footer-tag { margin:0; display:block; font-size:.74rem; color:#99f6e4; line-height:1.15; }
.nav-links { display:flex; align-items:center; gap:22px; margin-left:auto; list-style:none; }
.nav-link,.nav-links a:not(.nav-cta) {
  color:rgba(240,245,250,.78); text-decoration:none; font-size:.97rem; font-weight:600; transition:color .18s ease, opacity .18s ease;
}
.nav-link:hover,.nav-links a:not(.nav-cta):hover,.nav-link.active { color:#fff; }
.nav-cta,.btn-primary,.cta-button,.which-plan-cta {
  display:inline-flex; align-items:center; justify-content:center; gap:10px; min-height:46px; padding:0 20px;
  border:0; border-radius:999px; text-decoration:none; font-weight:700; letter-spacing:-.01em; color:#f7fcfa;
  background:linear-gradient(135deg, var(--accent) 0%, #0f766e 100%); box-shadow:0 14px 30px rgba(13,148,136,.24);
  transition:transform .16s ease, box-shadow .16s ease, filter .16s ease;
}
.nav-cta:hover,.btn-primary:hover,.cta-button:hover,.which-plan-cta:hover {
  transform:translateY(-1px); box-shadow:0 18px 38px rgba(13,148,136,.28); filter:saturate(1.04);
}
.btn,.btn-secondary {
  display:inline-flex; align-items:center; justify-content:center; min-height:46px; padding:0 20px; border-radius:999px;
  text-decoration:none; font-weight:700; transition:transform .16s ease, box-shadow .16s ease, border-color .16s ease, background-color .16s ease;
}
.btn-secondary {
  color:var(--foreground); background:rgba(255,255,255,.58); border:1px solid var(--border); box-shadow:inset 0 1px 0 rgba(255,255,255,.5);
}
.btn-secondary:hover { transform:translateY(-1px); border-color:var(--border-strong); background:rgba(255,255,255,.72); }
.hamburger,.nav-toggle { display:none; margin-left:auto; background:none; border:0; color:inherit; cursor:pointer; }
.hamburger { flex-direction:column; gap:4px; }
.hamburger span,.nav-toggle span { display:block; width:24px; height:2px; border-radius:999px; background:currentColor; }
.nav-toggle { flex-direction:column; gap:4px; padding:0; }
.nav-mobile {
  display:none;
  position:absolute;
  top:calc(100% + 10px);
  left:16px;
  right:16px;
  flex-direction:column;
  background:linear-gradient(180deg, rgba(13,21,33,.98) 0%, rgba(15,24,38,.95) 100%);
  border:1px solid rgba(141, 176, 209, .16);
  border-radius:22px;
  box-shadow:0 24px 50px rgba(5,10,18,.34);
  backdrop-filter:blur(14px);
  overflow:hidden;
}
.nav-mobile.open { display:flex; }
.nav-mobile a {
  display:block;
  width:100%;
  padding:16px 18px;
  color:rgba(240,245,250,.9);
  text-decoration:none;
  border-bottom:1px solid rgba(255,255,255,.06);
  line-height:1.35;
  white-space:normal;
  word-break:break-word;
}
.nav-mobile a:last-child { border-bottom:none; }
.page-header {
  position:relative; overflow:hidden;
  background:radial-gradient(circle at top right, rgba(153,246,228,.14), transparent 24%), linear-gradient(135deg, #1a3a5c 0%, #2d5986 100%);
  color:#f5f9fc;
}
.page-header::after { content:""; position:absolute; inset:auto 0 0; height:1px; background:rgba(255,255,255,.08); }
.page-header-inner { position:relative; max-width:var(--max-page); margin:0 auto; padding:56px 24px 50px; }
.page-header h1 { margin:0 0 12px; font-size:clamp(2.3rem,4vw,4rem); line-height:1.02; font-weight:800; }
.page-header p { max-width:760px; margin:0; font-size:1.2rem; line-height:1.65; color:rgba(235,242,248,.86); }
.container { max-width:var(--max-page); margin:0 auto; padding:40px 24px 56px; }
.footer,footer {
  margin-top:64px;
  background:linear-gradient(180deg, #1a3a5c 0%, #112b46 100%);
  color:white;
  padding:3rem 1.5rem;
}
.footer-inner,.footer-container {
  max-width:var(--max-page);
  margin:0 auto 2rem;
  padding:0;
  display:grid;
  grid-template-columns:repeat(auto-fit, minmax(250px, 1fr));
  gap:2rem;
}
.footer-top {
  display:contents;
}
.footer-brand,.f-brand {
  display:flex;
  align-items:center;
  gap:.75rem;
  margin-bottom:.5rem;
}
.footer-brand svg,.f-brand svg {
  width:28px;
  height:28px;
  color: var(--accent);
}
.footer-brand h3,.footer-brand-name,.f-name {
  font-size:1rem;
  font-weight:700;
  color:white;
  margin:0;
}
.footer-tagline,.footer-tag,.f-tag {
  display:block;
  margin:0 0 1rem;
  font-size:.85rem;
  color:#99f6e4;
}
.footer-links,.f-links,.footer-section {
  align-content:start;
}
.footer-section h4 {
  margin:0 0 1rem;
  font-size:.95rem;
  font-weight:600;
}
.footer-links {
  display:flex;
  flex-direction:column;
  gap:.5rem;
}
.footer-links a,.f-links a,.footer-section a {
  color:rgba(255,255,255,.8);
  text-decoration:none;
  display:block;
  font-size:.9rem;
  transition:color .3s ease;
}
.footer-links a:hover,.f-links a:hover,.footer-section a:hover { color:#99f6e4; }
.footer-bottom {
  max-width:var(--max-page);
  margin:0 auto;
  border-top:1px solid rgba(255,255,255,.1);
  padding-top:2rem;
  text-align:center;
  font-size:.85rem;
  color:rgba(255,255,255,.5);
}
.footer-disclaimer,.f-disc,.disclaimer {
  margin:0 0 1rem;
  font-size:.85rem;
  color:rgba(255,255,255,.6);
  line-height:1.6;
}
.footer-copyright,.copyright {
  margin:0;
  font-size:.85rem;
  color:rgba(255,255,255,.5);
}
@media (max-width: 768px) {
  .nav-links { display:none; }
  .nav-links.active {
    display:flex;
    flex-direction:column;
    position:absolute;
    top:68px;
    left:0;
    right:0;
    z-index:1002;
    margin-left:0;
    padding:18px;
    gap:14px;
    background:rgba(15, 24, 38, 0.96);
    border-top:1px solid rgba(255,255,255,.06);
    box-shadow:0 18px 34px rgba(5,10,18,.18);
    list-style:none;
  }
  .nav-links.active li,
  .nav-links.active a {
    width:100%;
  }
  .hamburger,.nav-toggle { display:inline-flex; align-items:center; justify-content:center; }
  .page-header-inner,.container { padding-left:18px; padding-right:18px; }
  .page-header p { font-size:1.05rem; }
  .nav-container,.nav-inner { gap:14px; padding-left:18px; padding-right:18px; }
  .nav-logo { min-width:0; flex:1 1 auto; }
  .logo-text { min-width:0; }
  .logo-name { font-size:1rem; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
  .logo-tag { max-width:185px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
  .nav-toggle { flex:0 0 auto; padding:8px; margin-right:-8px; }
  .nav-mobile { left:18px; right:18px; }
}
@media (max-width: 480px) {
  .footer,footer { padding-left:1rem; padding-right:1rem; }
  .nav-brand svg,.nav-logo svg { width:30px; height:30px; }
  .logo-name { font-size:.98rem; }
  .logo-tag { display:none; }
}