:root{
  --bg:#f4f8fd;
  --card:#ffffff;
  --ink:#0e1f3a;
  --muted:#60728b;
  --line:#dce7f4;
  --blue:#1769ff;
  --blue-dark:#0a2c66;
  --cyan:#38d7f6;
  --green:#12b76a;
  --shadow:0 18px 50px rgba(7,28,58,.10);
  --shadow-lg:0 26px 70px rgba(7,28,58,.16);
  --radius:24px;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;background:var(--bg);color:var(--ink);line-height:1.5}
a{text-decoration:none;color:inherit}
img{max-width:100%;display:block}
button,input,select{font:inherit}
.skip-link{position:absolute;left:-999px;top:0;background:#fff;padding:10px 14px;border-radius:12px;z-index:999}
.skip-link:focus{left:12px;top:12px}
.shell{width:min(1180px,calc(100% - 32px));margin:0 auto}
.section{padding:86px 0}
.centered{text-align:center}
.kicker,.eyebrow{display:inline-flex;align-items:center;gap:9px;padding:8px 14px;border-radius:999px;background:#edf5ff;color:#0d59dd;font-size:12px;font-weight:800;letter-spacing:.08em;text-transform:uppercase}
.eyebrow i,.kicker i{width:8px;height:8px;border-radius:999px;background:#19c37d;box-shadow:0 0 0 5px rgba(25,195,125,.16)}
.section-heading{max-width:860px;margin:0 auto 42px}
.section-heading h2{margin:14px 0 12px;font-size:clamp(31px,4vw,54px);line-height:1.04;letter-spacing:-.04em}
.section-heading h2 span{color:#2678ff}
.section-heading p{margin:0 auto;color:var(--muted);font-size:18px;max-width:760px}
.subhead{font-size:30px;line-height:1.08;margin:0 0 12px;letter-spacing:-.03em}

.site-header{position:sticky;top:0;z-index:30;background:rgba(244,248,253,.86);backdrop-filter:blur(16px);border-bottom:1px solid rgba(220,231,244,.7)}
.nav-wrap{display:flex;align-items:center;gap:18px;min-height:86px}
.brand{display:flex;align-items:center;min-width:max-content}
.brand-logo-hero{width:170px;height:auto}
.main-nav{display:flex;align-items:center;gap:22px;margin-left:auto}
.main-nav a{font-size:15px;font-weight:700;color:#33506f}
.main-nav a:hover{color:var(--blue)}
.nav-actions{display:flex;gap:10px;margin-left:6px}
.menu-toggle{display:none;width:46px;height:46px;border-radius:14px;border:1px solid var(--line);background:#fff;align-items:center;justify-content:center;flex-direction:column;gap:5px;cursor:pointer}
.menu-toggle span{display:block;width:18px;height:2px;border-radius:2px;background:#173255}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;height:46px;padding:0 18px;border-radius:14px;font-weight:800;transition:.24s ease;border:1px solid transparent;cursor:pointer}
.btn-lg{height:56px;padding:0 24px;border-radius:18px}
.btn-primary{background:linear-gradient(135deg,#1d7dff,#105ff7);color:#fff;box-shadow:0 14px 28px rgba(23,105,255,.22)}
.btn-primary:hover{transform:translateY(-2px);box-shadow:0 20px 38px rgba(23,105,255,.28)}
.btn-ghost{background:#fff;border-color:var(--line);color:#12335f}
.btn-light{background:#fff;color:#10345d;border:1px solid #e1ebf5}
.btn-white{background:#fff;color:#10345d}
.btn-outline-light{background:transparent;color:#fff;border-color:rgba(255,255,255,.28)}

.hero-v8{position:relative;padding:58px 0 54px;background:radial-gradient(circle at 12% 10%,rgba(23,105,255,.08),transparent 24%),radial-gradient(circle at 88% 14%,rgba(56,215,246,.08),transparent 22%),linear-gradient(180deg,#f9fcff,#f3f8fd)}
.hero-grid,.hero-glow{position:absolute;inset:0;pointer-events:none}
.hero-grid{background-image:linear-gradient(rgba(18,61,114,.05) 1px,transparent 1px),linear-gradient(90deg,rgba(18,61,114,.05) 1px,transparent 1px);background-size:42px 42px;mask-image:linear-gradient(180deg,rgba(0,0,0,.95),transparent 90%)}
.hero-glow-a{background:radial-gradient(circle at 18% 30%,rgba(23,105,255,.11),transparent 28%)}
.hero-glow-b{background:radial-gradient(circle at 82% 18%,rgba(56,215,246,.12),transparent 25%)}
.hero-v8-layout{position:relative;z-index:1;display:grid;grid-template-columns:1.05fr .95fr;gap:42px;align-items:center}
.hero-v8-copy h1{margin:18px 0 14px;font-size:clamp(40px,6vw,76px);line-height:.96;letter-spacing:-.055em;max-width:760px}
.hero-v8-copy h1 span{background:linear-gradient(135deg,#0a2c66,#1769ff 54%,#3bd2f5);-webkit-background-clip:text;background-clip:text;color:transparent}
.hero-lead{font-size:20px;color:#4d6480;max-width:700px;margin:0 0 28px}
.hero-actions{display:flex;flex-wrap:wrap;gap:14px;margin-bottom:24px}
.transport-pills{display:flex;flex-wrap:wrap;gap:10px}
.transport-pills span{padding:11px 14px;border-radius:999px;background:#fff;border:1px solid #dfe9f4;color:#1f4773;font-size:13px;font-weight:700;box-shadow:0 10px 20px rgba(11,33,60,.04)}
.transport-pills.large{margin-bottom:22px}
.hero-metrics{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;margin-top:26px}
.hero-metrics div{background:#fff;border:1px solid #e0eaf5;border-radius:18px;padding:16px 18px;box-shadow:var(--shadow)}
.hero-metrics b{display:block;font-size:24px;letter-spacing:-.03em;margin-bottom:4px}
.hero-metrics span{display:block;color:var(--muted);font-size:13px}
.hero-v8-visual{display:flex;justify-content:center}
.hero-product-image{width:min(100%,640px);border-radius:30px;box-shadow:var(--shadow-lg);border:1px solid #dfe9f3}

.trust-strip{padding-top:16px;padding-bottom:18px}
.trust-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}
.trust-grid>div{background:#fff;border:1px solid #e1ebf4;border-radius:22px;padding:24px;box-shadow:var(--shadow)}
.trust-grid strong{display:block;font-size:21px;letter-spacing:-.03em;margin-bottom:8px}
.trust-grid span{color:var(--muted)}

.value-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}
.value-card{padding:28px;border-radius:24px;border:1px solid #e1ebf4;background:#fff;box-shadow:var(--shadow)}
.value-card.featured{background:linear-gradient(145deg,#0a2141,#133e71);border-color:#113a69;color:#fff}
.value-card.featured p{color:#cad7e8}
.value-icon{width:48px;height:48px;border-radius:16px;display:grid;place-items:center;background:#edf4ff;color:#1869ff;font-size:24px;font-weight:900;margin-bottom:18px}
.value-card.featured .value-icon{background:#1769ff;color:#fff}
.value-card h3{margin:0 0 10px;font-size:23px;letter-spacing:-.03em}
.value-card p{margin:0;color:var(--muted)}

.showcase-section{padding-top:42px}
.showcase-grid{display:grid;grid-template-columns:1fr 1fr;gap:36px;align-items:center}
.showcase-grid.reverse{grid-template-columns:.9fr 1.1fr}
.showcase-copy h2{margin:12px 0 12px;font-size:clamp(30px,4vw,52px);line-height:1.02;letter-spacing:-.05em}
.showcase-copy p{margin:0 0 18px;color:var(--muted);font-size:18px}
.feature-list{list-style:none;padding:0;margin:0;display:grid;gap:12px}
.feature-list li{position:relative;padding-left:28px;color:#23415f;font-size:16px}
.feature-list li:before{content:"";position:absolute;left:0;top:9px;width:12px;height:12px;border-radius:999px;background:linear-gradient(135deg,#39cff4,#196dff);box-shadow:0 0 0 5px rgba(23,105,255,.08)}
.frame-card, .phone-card{background:#fff;border:1px solid #e2eaf4;border-radius:26px;padding:14px;box-shadow:var(--shadow-lg)}
.frame-card img{border-radius:18px;width:100%}
.phone-card{max-width:380px;justify-self:center;background:linear-gradient(180deg,#08254a,#0f3163);padding:14px;border-radius:32px}
.phone-card img{border-radius:22px;width:100%;background:#fff}
.alt{background:linear-gradient(180deg,#eef5fc,#f7fbff)}

.dual-brand{background:linear-gradient(180deg,#f7fbff,#eef5fc)}
.brand-pair{display:flex;align-items:center;justify-content:center;gap:20px;margin:0 auto 36px;flex-wrap:wrap}
.brand-pair img{width:min(100%,260px);height:auto;filter:drop-shadow(0 14px 28px rgba(9,29,55,.08))}
.brand-plus{display:grid;place-items:center;width:58px;height:58px;border-radius:999px;background:#fff;border:1px solid #d9e6f4;font-size:30px;font-weight:900;color:#1769ff;box-shadow:var(--shadow)}
.loon-grid{margin-top:18px}
.cta-inline{margin-top:24px}

.invoices-section{background:linear-gradient(180deg,#fff,#f3f8fd)}
.invoice-mockup{background:#fff;border:1px solid #deebf5;border-radius:28px;padding:24px;box-shadow:var(--shadow-lg)}
.invoice-head{display:flex;justify-content:space-between;align-items:center;gap:10px;padding-bottom:16px;border-bottom:1px solid #e8eff6}
.invoice-head small{display:block;color:#6f84a0;font-weight:800;letter-spacing:.08em}
.invoice-head strong{font-size:28px;letter-spacing:-.03em}
.status-pill{padding:10px 14px;border-radius:999px;font-size:13px;font-weight:800}
.status-pill.paid{background:#ebfff3;color:#0a9359}
.invoice-stats{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin:18px 0}
.invoice-stats div{padding:16px;border-radius:18px;background:#f8fbff;border:1px solid #e2ebf5}
.invoice-stats b{display:block;font-size:24px;letter-spacing:-.03em;margin-bottom:4px}
.invoice-stats span{display:block;color:var(--muted);font-size:13px}
.invoice-table{display:grid;gap:10px}
.invoice-row{display:grid;grid-template-columns:1.4fr .9fr .8fr .8fr;gap:8px;align-items:center;padding:12px 14px;border:1px solid #e6eef6;border-radius:16px;background:#fff}
.invoice-row.head{background:#f6fafe;color:#547091;font-size:13px;font-weight:800}
.paid-tag,.open-tag,.draft-tag{display:inline-flex;justify-self:start;padding:7px 10px;border-radius:999px;font-size:12px;font-weight:800}
.paid-tag{background:#eafbf1;color:#14975e}.open-tag{background:#fff4e5;color:#cc7b00}.draft-tag{background:#edf3ff;color:#1769ff}
.invoice-footer{display:flex;justify-content:space-between;align-items:center;gap:12px;margin-top:18px}
.mini-chart{display:flex;align-items:flex-end;gap:8px;height:78px;padding:12px 14px;border-radius:18px;background:#f6fafe;border:1px solid #e1eaf5;min-width:180px}
.mini-chart i{display:block;width:16px;border-radius:999px 999px 4px 4px;background:linear-gradient(180deg,#4fd7f4,#1769ff)}

.plan-options{background:linear-gradient(180deg,#eff6fd,#f7fbff)}
.option-grid{display:grid;grid-template-columns:1fr 1fr;gap:20px}
.option-card{padding:28px;border-radius:26px;background:#fff;border:1px solid #deebf4;box-shadow:var(--shadow)}
.option-card.featured{background:linear-gradient(145deg,#0a2141,#123d70);color:#fff;border-color:#113967}
.option-card.featured p,.option-card.featured li{color:#d4deeb}
.option-card h3{margin:0 0 8px;font-size:28px;letter-spacing:-.03em}
.option-card p{margin:0 0 18px;color:var(--muted);font-size:17px}
.option-card ul{margin:0;padding-left:18px;display:grid;gap:10px}

.cta-section{padding-top:38px;padding-bottom:92px}
.cta-card{background:linear-gradient(135deg,#08224a,#0d3670 60%,#0b4b91);color:#fff;border-radius:36px;padding:42px;display:grid;grid-template-columns:1.1fr .9fr;gap:34px;align-items:center;box-shadow:var(--shadow-lg);overflow:hidden;position:relative}
.cta-card:before{content:"";position:absolute;inset:auto -120px -140px auto;width:320px;height:320px;border-radius:50%;background:radial-gradient(circle,rgba(58,211,245,.28),transparent 68%)}
.cta-card h2{margin:16px 0 14px;font-size:clamp(30px,4vw,58px);line-height:1.03;letter-spacing:-.05em}
.cta-card p{margin:0 0 22px;color:#d7e2f1;font-size:18px;max-width:650px}
.contact-actions{display:flex;flex-wrap:wrap;gap:12px}
.email-link{display:inline-block;margin-top:18px;color:#64ebff;font-weight:700}
.eyebrow.light{background:rgba(255,255,255,.09);color:#fff;border:1px solid rgba(255,255,255,.1)}
.cta-logos{display:grid;gap:18px;justify-items:center;position:relative;z-index:1}
.cta-logos img{width:min(100%,290px);filter:drop-shadow(0 16px 34px rgba(0,0,0,.20))}

footer{padding:28px 0 42px;border-top:1px solid #dbe7f3;background:#f4f8fd}
.footer-grid{display:grid;grid-template-columns:1.15fr .9fr .95fr;gap:20px;align-items:center}
.footer-logo{width:180px}
.footer-branding p{margin:10px 0 0;color:var(--muted)}
.footer-links{display:flex;flex-wrap:wrap;gap:14px;justify-content:center}
.footer-links a{font-weight:700;color:#33506f}
.footer-note{text-align:right;color:#6b7d95}

.reveal{opacity:0;transform:translateY(18px);transition:opacity .55s ease,transform .55s ease}
.reveal.visible{opacity:1;transform:none}

@media (max-width:1080px){
  .hero-v8-layout,.showcase-grid,.cta-card,.footer-grid{grid-template-columns:1fr}
  .hero-v8-visual{order:-1}
  .main-nav{display:none;position:absolute;top:86px;left:16px;right:16px;padding:16px;background:#fff;border:1px solid var(--line);border-radius:20px;box-shadow:var(--shadow);flex-direction:column;align-items:flex-start}
  .main-nav.open{display:flex}
  .menu-toggle{display:flex;margin-left:auto}
  .nav-actions{display:none}
  .trust-grid,.value-grid,.option-grid{grid-template-columns:1fr}
  .invoice-row{grid-template-columns:1.2fr .8fr .7fr .7fr;font-size:14px}
  .footer-note{text-align:left}
}
@media (max-width:820px){
  .section{padding:74px 0}
  .hero-v8-copy h1{font-size:48px}
  .hero-lead,.section-heading p,.showcase-copy p,.cta-card p{font-size:17px}
  .hero-metrics,.invoice-stats{grid-template-columns:1fr}
  .showcase-grid.reverse{grid-template-columns:1fr}
  .invoice-row{grid-template-columns:1fr 1fr}
  .invoice-row span:nth-child(3),.invoice-row span:nth-child(4),.invoice-row.head span:nth-child(3),.invoice-row.head span:nth-child(4){justify-self:start}
  .invoice-footer{flex-direction:column;align-items:stretch}
}
@media (max-width:600px){
  .shell{width:min(100% - 20px,1180px)}
  .nav-wrap{min-height:76px}
  .brand-logo-hero{width:142px}
  .hero-v8{padding-top:32px}
  .hero-v8-copy h1{font-size:40px}
  .transport-pills span{font-size:12px;padding:10px 12px}
  .section-heading h2,.showcase-copy h2,.cta-card h2{font-size:34px}
  .value-card,.trust-grid>div,.option-card,.invoice-mockup,.cta-card{padding:22px}
  .frame-card,.phone-card{padding:10px}
  .brand-pair img{width:min(100%,220px)}
}

/* Invite-only login page */
.login-page{min-height:100vh;background:radial-gradient(circle at 18% 12%,rgba(23,105,255,.14),transparent 28%),radial-gradient(circle at 82% 18%,rgba(56,215,246,.12),transparent 24%),linear-gradient(180deg,#071a35,#0b2e5e);color:#fff}
.login-shell{width:min(760px,calc(100% - 28px));margin:0 auto;padding:34px 0 56px}
.login-back{display:inline-flex;margin-bottom:22px;color:#d7e5f7;font-weight:700}
.login-back:hover{color:#fff}
.login-card{background:rgba(255,255,255,.97);color:var(--ink);border:1px solid rgba(255,255,255,.65);border-radius:34px;padding:38px;box-shadow:0 30px 80px rgba(0,0,0,.26);text-align:center}
.login-brand-row{display:flex;justify-content:center;align-items:center;gap:18px;flex-wrap:wrap;margin-bottom:18px}
.login-logo{width:min(210px,42%);filter:drop-shadow(0 12px 24px rgba(8,37,77,.10))}
.login-card h1{font-size:clamp(34px,6vw,56px);line-height:1;letter-spacing:-.05em;margin:18px 0 12px}
.login-intro{font-size:18px;color:var(--muted);max-width:560px;margin:0 auto 24px}
.invite-box{text-align:left;background:#f3f8ff;border:1px solid #dce9f7;border-radius:22px;padding:20px 22px;margin:0 auto 22px;max-width:590px}
.invite-box strong{display:block;font-size:20px;color:#0d4ea6;margin-bottom:6px}
.invite-box p{margin:0;color:#5b6f89}
.login-action{width:min(100%,420px)}
.login-help{color:#6a7d94;margin:18px 0 6px}
.login-email{margin-top:4px;color:#1769ff}
@media(max-width:600px){.login-card{padding:26px 18px}.login-logo{width:44%}}
