:root{
  --mobile-shell-bg:rgba(9,24,32,.94);
  --mobile-shell-border:rgba(255,255,255,.1);
  --mobile-shell-text:rgba(255,255,255,.84);
  --mobile-shell-muted:rgba(255,255,255,.62);
}

.mnav-toggle{
  display:none;
  align-items:center;
  justify-content:center;
  width:44px;
  height:44px;
  border-radius:999px;
  border:1px solid var(--mobile-shell-border);
  background:rgba(255,255,255,.04);
  color:#fff;
  cursor:pointer;
  transition:transform .22s ease,border-color .22s ease,background .22s ease;
  flex-shrink:0;
}

.mnav-toggle:hover,
.mnav-toggle:focus-visible{
  border-color:rgba(91,184,232,.38);
  background:rgba(91,184,232,.12);
  outline:none;
}

.mnav-toggle-bars,
.mnav-toggle-bars::before,
.mnav-toggle-bars::after{
  content:"";
  display:block;
  width:18px;
  height:2px;
  border-radius:999px;
  background:currentColor;
  transition:transform .22s ease,opacity .22s ease;
}

.mnav-toggle-bars{
  position:relative;
}

.mnav-toggle-bars::before{
  position:absolute;
  top:-6px;
  left:0;
}

.mnav-toggle-bars::after{
  position:absolute;
  top:6px;
  left:0;
}

body.mobile-nav-open{
  overflow:hidden;
}

body.mobile-nav-open .mnav-toggle-bars{
  transform:rotate(45deg);
}

body.mobile-nav-open .mnav-toggle-bars::before{
  transform:translateY(6px) rotate(90deg);
}

body.mobile-nav-open .mnav-toggle-bars::after{
  opacity:0;
}

.mobile-nav-backdrop{
  position:fixed;
  inset:0;
  background:rgba(9,24,32,.54);
  backdrop-filter:blur(5px);
  opacity:0;
  pointer-events:none;
  transition:opacity .24s ease;
  z-index:119;
}

.mobile-nav-panel{
  position:fixed;
  top:0;
  right:0;
  bottom:0;
  width:min(22rem,88vw);
  padding:1rem 1rem 1.2rem;
  background:linear-gradient(180deg,var(--mobile-shell-bg),#08141a);
  box-shadow:-18px 0 42px rgba(0,0,0,.28);
  transform:translateX(100%);
  transition:transform .26s ease;
  z-index:120;
  overflow-y:auto;
}

body.mobile-nav-open .mobile-nav-backdrop{
  opacity:1;
  pointer-events:auto;
}

body.mobile-nav-open .mobile-nav-panel{
  transform:translateX(0);
}

.mobile-nav-header{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:1rem;
  padding:.1rem 0 1rem;
  margin-bottom:.35rem;
  border-bottom:1px solid rgba(255,255,255,.08);
}

.mobile-nav-label{
  font-size:.78rem;
  font-weight:700;
  letter-spacing:.12em;
  text-transform:uppercase;
  color:var(--mobile-shell-muted);
}

.mobile-nav-close{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width:40px;
  height:40px;
  border:none;
  border-radius:999px;
  background:rgba(255,255,255,.06);
  color:#fff;
  cursor:pointer;
}

.mobile-nav-close:hover,
.mobile-nav-close:focus-visible{
  background:rgba(91,184,232,.14);
  outline:none;
}

.mobile-nav-links{
  display:flex;
  flex-direction:column;
  gap:.7rem;
}

.mobile-nav-links a{
  display:flex;
  align-items:center;
  justify-content:flex-start;
  min-height:48px;
  padding:.95rem 1rem;
  border-radius:18px;
  border:1px solid rgba(255,255,255,.08);
  background:rgba(255,255,255,.03);
  color:var(--mobile-shell-text);
  font-size:1rem;
  font-weight:600;
  line-height:1.35;
  transition:background .22s ease,border-color .22s ease,transform .22s ease;
}

.mobile-nav-links a:hover,
.mobile-nav-links a:focus-visible{
  background:rgba(91,184,232,.12);
  border-color:rgba(91,184,232,.28);
  outline:none;
}

.mobile-nav-links a.current{
  color:#fff;
  border-color:rgba(91,184,232,.36);
  background:rgba(91,184,232,.14);
}

.mobile-nav-links a.nc{
  justify-content:center;
  margin-top:.15rem;
  background:linear-gradient(135deg,#2B7CB5,#4DA8D4) !important;
  border-color:transparent;
  color:#fff;
  box-shadow:0 12px 26px rgba(27,94,138,.24);
}

.mobile-nav-links a.nc:hover,
.mobile-nav-links a.nc:focus-visible{
  transform:translateY(-1px);
}

@media (max-width:800px){
  .mnav-toggle{
    display:inline-flex;
  }

  .nav .ni{
    gap:.85rem;
  }

  .nl{
    min-width:0;
  }

  .nlt{
    max-width:calc(100vw - 10rem);
    white-space:nowrap;
    overflow:hidden;
    text-overflow:ellipsis;
  }

  .hero{
    min-height:auto !important;
  }

  .hi{
    padding-top:6.3rem !important;
    padding-bottom:3.25rem !important;
    gap:1.35rem !important;
  }

  .hpr{
    gap:.9rem 1.15rem !important;
  }

  .hpi{
    min-width:calc(50% - .6rem);
  }

  .founder-cta{
    padding-top:1.4rem !important;
  }

  .hc{
    display:block !important;
    width:100%;
    max-width:none !important;
    margin-top:.2rem;
    padding:1.15rem !important;
    border-radius:24px !important;
  }

  .hcl{
    margin-bottom:.9rem !important;
    font-size:.76rem !important;
    letter-spacing:.16em !important;
  }

  .hm{
    gap:.65rem !important;
  }

  .mr{
    padding:.82rem .88rem !important;
    gap:.8rem !important;
  }

  .mi{
    width:38px !important;
    height:38px !important;
  }

  .mn{
    font-size:.76rem !important;
  }

  .mv{
    font-size:.98rem !important;
    line-height:1.35 !important;
  }

  .proof-panel{
    padding:1.12rem !important;
  }

  .proof-top{
    display:grid !important;
    grid-template-columns:1fr !important;
    gap:.7rem !important;
    margin-bottom:.7rem !important;
  }

  .proof-top > div{
    min-width:0;
  }

  .proof-kicker{
    display:block !important;
    font-size:.72rem !important;
    line-height:1.35 !important;
    white-space:normal;
  }

  .proof-badge{
    width:fit-content;
    max-width:100%;
    white-space:normal !important;
    justify-self:start;
  }

  .proof-panel h3{
    max-width:100%;
    font-size:clamp(1.55rem,7.1vw,2rem) !important;
    line-height:1.08 !important;
    text-wrap:balance;
  }

  .proof-copy,
  .proof-note{
    font-size:.95rem !important;
    line-height:1.68 !important;
  }

  .proof-review{
    padding:.9rem .95rem !important;
  }

  .proof-review p,
  .proof-list li,
  .proof-stat span,
  .proof-feature span{
    font-size:.9rem !important;
    line-height:1.58 !important;
  }

  .proof,
  .wy{
    scroll-margin-top:5.5rem;
  }
}

@media (max-width:640px){
  .mobile-nav-panel{
    width:min(24rem,92vw);
  }

  .hero h1,
  .f-intro h1{
    text-wrap:balance;
  }

  .hero h1{
    font-size:clamp(2.45rem,13vw,3.6rem) !important;
    line-height:1.02 !important;
  }

  .hsub,
  .f-intro p{
    font-size:1rem !important;
    line-height:1.72 !important;
  }

  .hpi{
    min-width:100%;
  }

  .proof-feature strong{
    font-size:clamp(1.68rem,9vw,2.2rem) !important;
  }

  .proof-feature.word strong{
    font-size:clamp(1.3rem,6.8vw,1.7rem) !important;
  }
}
