feat: rewrite marketing landing page for WISP operators

- Pain point section: disconnected tools, slow impact assessment
- WISP-specific features: impact dashboard, subscriber trace, alert triage, config tracking
- Pricing tiers: Starter (free/10 devices), Pro (/dev/mo), Business (/dev/mo)
- Use case sections: NOC, Help Desk, Owner perspectives
- Tech details: 786 device profiles, secure agent arch, SNMP v1/v2c/v3
- Updated both changelogs
This commit is contained in:
Graham McIntire 2026-02-13 19:07:04 -06:00
parent 608bad0cf6
commit dec6f0f271
3 changed files with 341 additions and 162 deletions

View file

@ -1,4 +1,5 @@
2026-02-13
feat: complete marketing page rewrite — WISP-focused positioning, pain points, pricing tiers, use cases
fix: safer float formatting, nil crash prevention in templates
fix: add missing age_text and severity_color helpers to alert_live
fix: prevent nil Decimal/Calendar crashes in trace template

View file

@ -1,8 +1,11 @@
<MarketingLayouts.marketing flash={@flash}>
<!-- Hero Section -->
<div class="mx-auto max-w-7xl px-4 sm:px-6 lg:px-8 pt-20 pb-16 text-center lg:pt-32">
<div class="inline-flex items-center rounded-full px-4 py-1.5 mb-8 bg-blue-50 text-blue-700 text-sm font-medium ring-1 ring-blue-600/20">
<span class="mr-2">📡</span> Built specifically for WISP &amp; ISP operators
</div>
<h1 class="mx-auto max-w-4xl font-display text-5xl font-medium tracking-tight text-slate-900 sm:text-7xl">
Network monitoring
See the
<span class="relative whitespace-nowrap text-blue-600">
<svg
aria-hidden="true"
@ -12,39 +15,86 @@
>
<path d="M203.371.916c-26.013-2.078-76.686 1.963-124.73 9.946L67.3 12.749C35.421 18.062 18.2 21.766 6.004 25.934 1.244 27.561.828 27.778.874 28.61c.07 1.214.828 1.121 9.595-1.176 9.072-2.377 17.15-3.92 39.246-7.496C123.565 7.986 157.869 4.492 195.942 5.046c7.461.108 19.25 1.696 19.17 2.582-.107 1.183-7.874 4.31-25.75 10.366-21.992 7.45-35.43 12.534-36.701 13.884-2.173 2.308-.202 4.407 4.442 4.734 2.654.187 3.263.157 15.593-.78 35.401-2.686 57.944-3.488 88.365-3.143 46.327.526 75.721 2.23 130.788 7.584 19.787 1.924 20.814 1.98 24.557 1.332l.066-.011c1.201-.203 1.53-1.825.399-2.335-2.911-1.31-4.893-1.604-22.048-3.261-57.509-5.556-87.871-7.36-132.059-7.842-23.239-.254-33.617-.116-50.627.674-11.629.54-42.371 2.494-46.696 2.967-2.359.259 8.133-3.625 26.504-9.81 23.239-7.825 27.934-10.149 28.304-14.005.417-4.348-3.529-6-16.878-7.066Z" />
</svg>
<span class="relative">made simple</span>
<span class="relative">business impact</span>
</span>
for network operators.
of every network event.
</h1>
<p class="mx-auto mt-6 max-w-2xl text-lg tracking-tight text-slate-700">
Cloud-hosted monitoring with lightweight Docker agents running on your network.
Monitor internal devices securely via SNMP—no firewall changes, no exposed ports.
TowerOps connects your network monitoring to subscriber impact and revenue.
When a tower goes down, instantly see which customers are affected, how much MRR is at risk,
and what to fix first.
</p>
<p class="mx-auto mt-4 max-w-2xl text-xl font-semibold tracking-tight text-blue-600">
Monitor 10 devices for free. No credit card required.
Free up to 10 devices. No credit card required.
</p>
<div class="mt-10 flex justify-center gap-x-6">
<.link
navigate={~p"/users/register"}
class="group inline-flex items-center justify-center rounded-full py-2 px-4 text-sm font-semibold focus-visible:outline-2 focus-visible:outline-offset-2 bg-blue-600 text-white hover:text-slate-100 hover:bg-blue-500 active:bg-blue-800 active:text-blue-100 focus-visible:outline-blue-600"
class="group inline-flex items-center justify-center rounded-full py-3 px-6 text-sm font-semibold focus-visible:outline-2 focus-visible:outline-offset-2 bg-blue-600 text-white hover:text-slate-100 hover:bg-blue-500 active:bg-blue-800 active:text-blue-100 focus-visible:outline-blue-600"
>
Get started free
Start monitoring free →
</.link>
<a
href="#features"
class="group inline-flex items-center justify-center rounded-full py-3 px-6 text-sm font-semibold ring-1 ring-slate-200 text-slate-700 hover:text-slate-900 hover:ring-slate-300 active:bg-slate-100 focus-visible:outline-blue-600"
>
See how it works
</a>
</div>
</div>
<!-- Pain Point Section -->
<section class="bg-slate-900 py-20 sm:py-24">
<div class="mx-auto max-w-7xl px-4 sm:px-6 lg:px-8">
<div class="mx-auto max-w-2xl text-center">
<h2 class="font-display text-3xl tracking-tight text-white sm:text-4xl">
Your tools don't talk to each other.
</h2>
<p class="mt-4 text-lg tracking-tight text-slate-400">
You've got LibreNMS for monitoring, Preseem for QoE, Sonar or Gaiia for billing,
and a spreadsheet for tower sites. When something breaks, you're alt-tabbing between
five dashboards trying to figure out who's affected.
</p>
</div>
<div class="mt-16 grid grid-cols-1 gap-4 sm:grid-cols-2 lg:grid-cols-4">
<div class="rounded-lg bg-slate-800 p-6 text-center">
<div class="text-3xl font-bold text-red-400">45 min</div>
<div class="mt-2 text-sm text-slate-400">Average time to assess outage impact</div>
</div>
<div class="rounded-lg bg-slate-800 p-6 text-center">
<div class="text-3xl font-bold text-red-400">5+</div>
<div class="mt-2 text-sm text-slate-400">Dashboards to check during incidents</div>
</div>
<div class="rounded-lg bg-slate-800 p-6 text-center">
<div class="text-3xl font-bold text-red-400">???</div>
<div class="mt-2 text-sm text-slate-400">Subscribers affected right now</div>
</div>
<div class="rounded-lg bg-slate-800 p-6 text-center">
<div class="text-3xl font-bold text-red-400">$???</div>
<div class="mt-2 text-sm text-slate-400">Revenue at risk from this outage</div>
</div>
</div>
<div class="mt-12 text-center">
<p class="text-lg font-medium text-blue-400">
TowerOps gives you one place to see it all.
</p>
</div>
</div>
</section>
<!-- Primary Features Section -->
<section
id="features"
aria-label="Features for monitoring your infrastructure"
aria-label="Features for WISP operators"
class="relative overflow-hidden bg-blue-600 pt-20 pb-28 sm:py-32"
>
<div class="mx-auto max-w-7xl px-4 sm:px-6 lg:px-8 relative">
<div class="max-w-2xl md:mx-auto md:text-center xl:max-w-none">
<h2 class="font-display text-3xl tracking-tight text-white sm:text-4xl md:text-5xl">
Everything you need to monitor your network.
Operational intelligence built for WISPs.
</h2>
<p class="mt-6 text-lg tracking-tight text-blue-100">
Comprehensive SNMP monitoring with real-time alerts and performance tracking.
Not another generic monitoring tool. TowerOps understands tower sites, subscribers, and revenue.
</p>
</div>
<div class="mt-16 grid grid-cols-1 gap-8 sm:grid-cols-2 lg:grid-cols-3">
@ -52,26 +102,26 @@
<div class="relative rounded-2xl bg-white/10 p-8 ring-1 ring-white/10">
<div class="flex items-center gap-x-3">
<div class="flex h-10 w-10 items-center justify-center rounded-lg bg-white/20">
<.icon name="hero-cpu-chip" class="h-6 w-6 text-white" />
<.icon name="hero-currency-dollar" class="h-6 w-6 text-white" />
</div>
<h3 class="text-lg font-semibold text-white">Secure Agent Architecture</h3>
<h3 class="text-lg font-semibold text-white">Impact Dashboard</h3>
</div>
<p class="mt-4 text-sm text-blue-100">
Deploy lightweight Docker agents on your network to monitor internal equipment.
Your devices stay private—no firewall changes, no open ports, no VPN required.
See MRR at risk, affected subscriber counts, and active incidents at a glance.
Know the business impact of every network event before your customers call.
</p>
</div>
<!-- Feature 2 -->
<div class="relative rounded-2xl bg-white/10 p-8 ring-1 ring-white/10">
<div class="flex items-center gap-x-3">
<div class="flex h-10 w-10 items-center justify-center rounded-lg bg-white/20">
<.icon name="hero-signal" class="h-6 w-6 text-white" />
<.icon name="hero-magnifying-glass" class="h-6 w-6 text-white" />
</div>
<h3 class="text-lg font-semibold text-white">SNMP Monitoring</h3>
<h3 class="text-lg font-semibold text-white">Subscriber Trace</h3>
</div>
<p class="mt-4 text-sm text-blue-100">
Automatic device discovery via SNMP. Track interface statistics, sensor readings,
and device health with support for MikroTik, Cisco, and generic SNMP devices.
Help desk calls in? Search by name or account and instantly see their device status,
QoE scores, alerts, and whether nearby subscribers are also affected.
</p>
</div>
<!-- Feature 3 -->
@ -80,68 +130,69 @@
<div class="flex h-10 w-10 items-center justify-center rounded-lg bg-white/20">
<.icon name="hero-bell-alert" class="h-6 w-6 text-white" />
</div>
<h3 class="text-lg font-semibold text-white">Real-time Alerts</h3>
<h3 class="text-lg font-semibold text-white">Smart Alert Triage</h3>
</div>
<p class="mt-4 text-sm text-blue-100">
Get instant notifications when devices go down or thresholds are exceeded.
Configurable alert rules with email notifications to keep you informed.
Alerts grouped by tower site and ranked by severity and subscriber impact.
Filter by critical/unresolved/all. Resolve directly from the alert view.
</p>
</div>
<!-- Feature 4 -->
<div class="relative rounded-2xl bg-white/10 p-8 ring-1 ring-white/10">
<div class="flex items-center gap-x-3">
<div class="flex h-10 w-10 items-center justify-center rounded-lg bg-white/20">
<.icon name="hero-chart-bar" class="h-6 w-6 text-white" />
<.icon name="hero-clock" class="h-6 w-6 text-white" />
</div>
<h3 class="text-lg font-semibold text-white">Performance Charts</h3>
<h3 class="text-lg font-semibold text-white">Config Change Tracking</h3>
</div>
<p class="mt-4 text-sm text-blue-100">
Visualize historical data with interactive time-series charts. Track bandwidth,
temperature sensors, and custom metrics over configurable time ranges.
Correlate config changes with performance shifts. See a timeline of what changed,
when, and whether it caused problems — before you start guessing.
</p>
</div>
<!-- Feature 5 -->
<div class="relative rounded-2xl bg-white/10 p-8 ring-1 ring-white/10">
<div class="flex items-center gap-x-3">
<div class="flex h-10 w-10 items-center justify-center rounded-lg bg-white/20">
<.icon name="hero-cloud" class="h-6 w-6 text-white" />
<.icon name="hero-signal" class="h-6 w-6 text-white" />
</div>
<h3 class="text-lg font-semibold text-white">Cloud-Hosted Platform</h3>
<h3 class="text-lg font-semibold text-white">Tower Site Intelligence</h3>
</div>
<p class="mt-4 text-sm text-blue-100">
Access your monitoring dashboard from anywhere. No servers to maintain—we handle
updates, backups, and scaling so you can focus on your network.
Enriched site pages with subscriber counts, device health grids, active alerts,
latency charts, and recent config changes — all on one screen.
</p>
</div>
<!-- Feature 6 -->
<div class="relative rounded-2xl bg-white/10 p-8 ring-1 ring-white/10">
<div class="flex items-center gap-x-3">
<div class="flex h-10 w-10 items-center justify-center rounded-lg bg-white/20">
<.icon name="hero-arrow-path" class="h-6 w-6 text-white" />
<.icon name="hero-puzzle-piece" class="h-6 w-6 text-white" />
</div>
<h3 class="text-lg font-semibold text-white">Simple Deployment</h3>
<h3 class="text-lg font-semibold text-white">Billing &amp; QoE Integrations</h3>
</div>
<p class="mt-4 text-sm text-blue-100">
Deploy agents with a single Docker command. Automatic updates and health monitoring
ensure your agents stay online and current.
Connect Gaiia or Sonar for subscriber data and Preseem for QoE metrics.
TowerOps pulls it all together so you see the full picture without switching tabs.
</p>
</div>
</div>
</div>
</section>
<!-- How It Works Section -->
<section
id="how-it-works"
aria-label="How Towerops works"
aria-label="How TowerOps works"
class="relative bg-slate-50 py-20 sm:py-32"
>
<div class="mx-auto max-w-7xl px-4 sm:px-6 lg:px-8">
<div class="mx-auto max-w-2xl md:text-center">
<h2 class="font-display text-3xl tracking-tight text-slate-900 sm:text-4xl">
How it works
Up and running in 10 minutes
</h2>
<p class="mt-4 text-lg tracking-tight text-slate-700">
Secure hybrid architecture with zero firewall changes. Deploy in minutes, not hours.
No agents to install on every device. One Docker container per network, and you're monitoring everything.
</p>
</div>
<div class="mt-16 grid grid-cols-1 gap-8 lg:grid-cols-3 lg:gap-12">
@ -151,16 +202,14 @@
<div class="flex h-10 w-10 items-center justify-center rounded-full bg-blue-600 text-white font-semibold text-lg">
1
</div>
<h3 class="text-xl font-semibold text-slate-900">Deploy Agent</h3>
<h3 class="text-xl font-semibold text-slate-900">Deploy a lightweight agent</h3>
</div>
<p class="mt-4 text-base text-slate-600">
Run our lightweight Docker agent on your network (on a server, VM, or edge device).
The agent stays on your private network and polls your internal SNMP devices locally.
Run a single Docker container on your network. It discovers SNMP devices automatically
and starts collecting metrics. No firewall changes, no VPN, no open ports.
</p>
<div class="mt-6 rounded-lg bg-blue-50 border border-blue-200 p-4">
<p class="text-sm text-slate-700">
Complete deployment instructions are provided when you create an agent in your dashboard.
</p>
<div class="mt-6 rounded-lg bg-slate-900 p-4 font-mono text-sm text-green-400">
$ docker run -d towerops/agent
</div>
</div>
<!-- Step 2 -->
@ -169,27 +218,18 @@
<div class="flex h-10 w-10 items-center justify-center rounded-full bg-blue-600 text-white font-semibold text-lg">
2
</div>
<h3 class="text-xl font-semibold text-slate-900">Agent Monitors & Reports</h3>
<h3 class="text-xl font-semibold text-slate-900">Connect your tools</h3>
</div>
<p class="mt-4 text-base text-slate-600">
The agent discovers and monitors your SNMP devices locally, then securely sends metrics
to our cloud platform. No firewall changes needed—only outbound HTTPS connections.
Add your Gaiia/Sonar API key for subscriber data and Preseem for QoE metrics.
TowerOps automatically maps subscribers to devices and tower sites.
</p>
<div class="mt-6 flex items-center justify-center gap-3 flex-wrap">
<div class="rounded-lg bg-gradient-to-r from-blue-600 to-blue-500 px-4 py-2 text-xs font-medium text-white shadow-lg">
Towerops Cloud
</div>
<.icon name="hero-arrow-left" class="h-4 w-4 text-blue-600" />
<div class="rounded-lg bg-blue-100 px-4 py-2 text-xs font-medium text-blue-900">
Agent
</div>
<.icon name="hero-arrow-right" class="h-4 w-4 text-slate-400" />
<div class="rounded-lg bg-slate-200 px-3 py-2 text-xs font-medium text-slate-700">
Router
</div>
<div class="rounded-lg bg-slate-200 px-3 py-2 text-xs font-medium text-slate-700">
Switch
</div>
<div class="mt-6 flex flex-wrap gap-2">
<span class="inline-flex items-center rounded-full bg-blue-50 px-3 py-1 text-xs font-medium text-blue-700 ring-1 ring-blue-600/20">Gaiia</span>
<span class="inline-flex items-center rounded-full bg-blue-50 px-3 py-1 text-xs font-medium text-blue-700 ring-1 ring-blue-600/20">Sonar</span>
<span class="inline-flex items-center rounded-full bg-blue-50 px-3 py-1 text-xs font-medium text-blue-700 ring-1 ring-blue-600/20">Preseem</span>
<span class="inline-flex items-center rounded-full bg-slate-100 px-3 py-1 text-xs font-medium text-slate-500 ring-1 ring-slate-300">UISP — coming soon</span>
<span class="inline-flex items-center rounded-full bg-slate-100 px-3 py-1 text-xs font-medium text-slate-500 ring-1 ring-slate-300">Splynx — coming soon</span>
</div>
</div>
<!-- Step 3 -->
@ -198,144 +238,276 @@
<div class="flex h-10 w-10 items-center justify-center rounded-full bg-blue-600 text-white font-semibold text-lg">
3
</div>
<h3 class="text-xl font-semibold text-slate-900">View in Cloud</h3>
<h3 class="text-xl font-semibold text-slate-900">See the full picture</h3>
</div>
<p class="mt-4 text-base text-slate-600">
The agent securely sends metrics to our cloud platform. Access your dashboard from
anywhere with real-time charts, alerts, and historical data.
Your dashboard lights up with subscriber impact, revenue at risk, device health,
and site status. Help desk gets subscriber trace. NOC gets alert triage. Everyone wins.
</p>
<div class="mt-6 rounded-lg border-2 border-blue-200 bg-white p-4">
<div class="flex items-center gap-2">
<.icon name="hero-chart-bar" class="h-5 w-5 text-blue-600" />
<span class="text-sm font-medium text-slate-900">Cloud Dashboard</span>
<span class="text-sm font-medium text-slate-900">Impact Dashboard</span>
</div>
<div class="mt-2 text-xs text-slate-600">
Real-time metrics • Alerts • History
<div class="mt-2 grid grid-cols-2 gap-2 text-xs text-slate-600">
<div>📊 MRR at Risk</div>
<div>👥 Affected Subs</div>
<div>🔴 Active Incidents</div>
<div>📍 Site Health</div>
</div>
</div>
</div>
</div>
</div>
</section>
<!-- Secondary Features Section -->
<section
id="secondary-features"
aria-label="Features for managing your infrastructure"
class="pt-20 pb-14 sm:pt-32 sm:pb-20 lg:pb-32"
>
<!-- Social Proof / Use Cases -->
<section class="py-20 sm:py-24">
<div class="mx-auto max-w-7xl px-4 sm:px-6 lg:px-8">
<div class="mx-auto max-w-2xl md:text-center">
<h2 class="font-display text-3xl tracking-tight text-slate-900 sm:text-4xl">
Built for multi-site operations.
Built by a WISP operator, for WISP operators.
</h2>
<p class="mt-4 text-lg tracking-tight text-slate-700">
Organize devices by site, collaborate with your team, and maintain clear visibility
across your entire network infrastructure.
We run a network too. TowerOps exists because we got tired of the same problems you have.
</p>
</div>
<div class="mt-20 grid grid-cols-1 gap-8 sm:grid-cols-2 lg:grid-cols-3">
<!-- Feature 1 -->
<div>
<div class="w-9 rounded-lg bg-blue-600">
<svg aria-hidden="true" class="h-9 w-9" fill="none">
<path
d="M8 17a1 1 0 0 1 1-1h18a1 1 0 0 1 1 1v2a1 1 0 0 1-1 1H9a1 1 0 0 1-1-1v-2Z"
fill="#fff"
opacity=".5"
/>
<path
d="M8 24a1 1 0 0 1 1-1h18a1 1 0 0 1 1 1v2a1 1 0 0 1-1 1H9a1 1 0 0 1-1-1v-2Z"
fill="#fff"
opacity=".3"
/>
<path
d="M8 10a1 1 0 0 1 1-1h18a1 1 0 0 1 1 1v2a1 1 0 0 1-1 1H9a1 1 0 0 1-1-1v-2Z"
fill="#fff"
/>
</svg>
</div>
<h3 class="mt-6 text-sm font-medium text-blue-600">Site Management</h3>
<p class="mt-2 font-display text-xl text-slate-900">
Organize devices by physical location
</p>
<p class="mt-4 text-sm text-slate-600">
Group devices by tower site or facility. View site-wide status and health metrics
at a glance, then drill down into individual device details.
<div class="mt-16 grid grid-cols-1 gap-8 sm:grid-cols-2 lg:grid-cols-3">
<div class="rounded-xl bg-slate-50 p-8">
<div class="text-2xl mb-4">🏗️</div>
<h3 class="text-lg font-semibold text-slate-900">For the NOC</h3>
<p class="mt-3 text-sm text-slate-600">
Alert triage grouped by site with severity colors and subscriber impact.
Stop wasting time on low-impact alerts when a whole tower is down.
</p>
</div>
<!-- Feature 2 -->
<div>
<div class="w-9 rounded-lg bg-blue-600">
<svg aria-hidden="true" class="h-9 w-9" fill="none">
<path
opacity=".5"
d="M25.778 25.778c.39.39 1.027.393 1.384-.028A11.952 11.952 0 0 0 30 18c0-6.627-5.373-12-12-12S6 11.373 6 18c0 2.954 1.067 5.659 2.838 7.75.357.421.993.419 1.384.028.39-.39.386-1.02.036-1.448A9.959 9.959 0 0 1 8 18c0-5.523 4.477-10 10-10s10 4.477 10 10a9.959 9.959 0 0 1-2.258 6.33c-.35.427-.354 1.058.036 1.448Z"
fill="#fff"
/>
<path
d="M12 28.395V28a6 6 0 0 1 12 0v.395A11.945 11.945 0 0 1 18 30c-2.186 0-4.235-.584-6-1.605ZM21 16.5c0-1.933-.5-3.5-3-3.5s-3 1.567-3 3.5 1.343 3.5 3 3.5 3-1.567 3-3.5Z"
fill="#fff"
/>
</svg>
</div>
<h3 class="mt-6 text-sm font-medium text-blue-600">Team Collaboration</h3>
<p class="mt-2 font-display text-xl text-slate-900">Share access with your team</p>
<p class="mt-4 text-sm text-slate-600">
Create organizations and invite team members. Control access with owner, admin, and member roles.
Each team member sees only what they need.
<div class="rounded-xl bg-slate-50 p-8">
<div class="text-2xl mb-4">📞</div>
<h3 class="text-lg font-semibold text-slate-900">For the Help Desk</h3>
<p class="mt-3 text-sm text-slate-600">
Subscriber trace: search by name, see their device status, QoE, and whether
the whole tower is having issues. Answer "is it just me?" in seconds.
</p>
</div>
<!-- Feature 3 -->
<div>
<div class="w-9 rounded-lg bg-blue-600">
<svg aria-hidden="true" class="h-9 w-9" fill="none">
<defs>
<linearGradient
id="reporting-gradient"
x1="11.5"
y1="18"
x2="36"
y2="15.5"
gradientUnits="userSpaceOnUse"
>
<stop offset=".194" stop-color="#fff" />
<stop offset="1" stop-color="#6692F1" />
</linearGradient>
</defs>
<path
d="m30 15-4 5-4-11-4 18-4-11-4 7-4-5"
stroke="url(#reporting-gradient)"
stroke-width="2"
stroke-linecap="round"
stroke-linejoin="round"
/>
</svg>
</div>
<h3 class="mt-6 text-sm font-medium text-blue-600">Historical Data</h3>
<p class="mt-2 font-display text-xl text-slate-900">Track trends over time</p>
<p class="mt-4 text-sm text-slate-600">
All sensor readings and interface statistics are stored for historical analysis.
View data from the past hour, day, week, or month with interactive charts.
<div class="rounded-xl bg-slate-50 p-8">
<div class="text-2xl mb-4">📈</div>
<h3 class="text-lg font-semibold text-slate-900">For the Owner</h3>
<p class="mt-3 text-sm text-slate-600">
MRR at risk, revenue impact per incident, and site health scores.
Make investment decisions based on which towers affect the most revenue.
</p>
</div>
</div>
</div>
</section>
<!-- Call to Action Section -->
<!-- Pricing Section -->
<section id="pricing" class="bg-slate-50 py-20 sm:py-32">
<div class="mx-auto max-w-7xl px-4 sm:px-6 lg:px-8">
<div class="mx-auto max-w-2xl text-center">
<h2 class="font-display text-3xl tracking-tight text-slate-900 sm:text-4xl">
Simple per-device pricing
</h2>
<p class="mt-4 text-lg tracking-tight text-slate-700">
Start free. Pay only when you're ready to scale.
</p>
</div>
<div class="mt-16 grid grid-cols-1 gap-8 lg:grid-cols-3">
<!-- Free -->
<div class="rounded-2xl bg-white p-8 shadow-sm ring-1 ring-slate-200">
<h3 class="text-lg font-semibold text-slate-900">Starter</h3>
<p class="mt-2 text-sm text-slate-500">Get started with your first tower.</p>
<div class="mt-6">
<span class="text-4xl font-bold text-slate-900">Free</span>
</div>
<ul class="mt-8 space-y-3 text-sm text-slate-600">
<li class="flex items-center gap-2">
<.icon name="hero-check" class="h-5 w-5 text-blue-600 flex-shrink-0" />
Up to 10 monitored devices
</li>
<li class="flex items-center gap-2">
<.icon name="hero-check" class="h-5 w-5 text-blue-600 flex-shrink-0" />
1 agent / 1 network
</li>
<li class="flex items-center gap-2">
<.icon name="hero-check" class="h-5 w-5 text-blue-600 flex-shrink-0" />
SNMP monitoring &amp; alerts
</li>
<li class="flex items-center gap-2">
<.icon name="hero-check" class="h-5 w-5 text-blue-600 flex-shrink-0" />
7-day data retention
</li>
<li class="flex items-center gap-2">
<.icon name="hero-check" class="h-5 w-5 text-blue-600 flex-shrink-0" />
Impact dashboard
</li>
</ul>
<.link
navigate={~p"/users/register"}
class="mt-8 block w-full rounded-full py-2.5 text-center text-sm font-semibold text-blue-600 ring-1 ring-blue-200 hover:ring-blue-300 hover:bg-blue-50"
>
Get started free
</.link>
</div>
<!-- Pro -->
<div class="rounded-2xl bg-white p-8 shadow-lg ring-2 ring-blue-600 relative">
<div class="absolute -top-4 left-1/2 -translate-x-1/2">
<span class="inline-flex items-center rounded-full bg-blue-600 px-4 py-1 text-xs font-semibold text-white">
Most popular
</span>
</div>
<h3 class="text-lg font-semibold text-slate-900">Pro</h3>
<p class="mt-2 text-sm text-slate-500">For growing WISPs with multiple sites.</p>
<div class="mt-6">
<span class="text-4xl font-bold text-slate-900">$3</span>
<span class="text-sm text-slate-500">/device/month</span>
</div>
<ul class="mt-8 space-y-3 text-sm text-slate-600">
<li class="flex items-center gap-2">
<.icon name="hero-check" class="h-5 w-5 text-blue-600 flex-shrink-0" />
Unlimited devices
</li>
<li class="flex items-center gap-2">
<.icon name="hero-check" class="h-5 w-5 text-blue-600 flex-shrink-0" />
Unlimited agents &amp; networks
</li>
<li class="flex items-center gap-2">
<.icon name="hero-check" class="h-5 w-5 text-blue-600 flex-shrink-0" />
Gaiia / Sonar integration
</li>
<li class="flex items-center gap-2">
<.icon name="hero-check" class="h-5 w-5 text-blue-600 flex-shrink-0" />
Preseem QoE integration
</li>
<li class="flex items-center gap-2">
<.icon name="hero-check" class="h-5 w-5 text-blue-600 flex-shrink-0" />
Subscriber trace &amp; alert triage
</li>
<li class="flex items-center gap-2">
<.icon name="hero-check" class="h-5 w-5 text-blue-600 flex-shrink-0" />
Config change tracking
</li>
<li class="flex items-center gap-2">
<.icon name="hero-check" class="h-5 w-5 text-blue-600 flex-shrink-0" />
90-day data retention
</li>
</ul>
<.link
navigate={~p"/users/register"}
class="mt-8 block w-full rounded-full py-2.5 text-center text-sm font-semibold text-white bg-blue-600 hover:bg-blue-500"
>
Start 14-day free trial
</.link>
</div>
<!-- Business -->
<div class="rounded-2xl bg-white p-8 shadow-sm ring-1 ring-slate-200">
<h3 class="text-lg font-semibold text-slate-900">Business</h3>
<p class="mt-2 text-sm text-slate-500">For larger operators with advanced needs.</p>
<div class="mt-6">
<span class="text-4xl font-bold text-slate-900">$6</span>
<span class="text-sm text-slate-500">/device/month</span>
</div>
<ul class="mt-8 space-y-3 text-sm text-slate-600">
<li class="flex items-center gap-2">
<.icon name="hero-check" class="h-5 w-5 text-blue-600 flex-shrink-0" />
Everything in Pro
</li>
<li class="flex items-center gap-2">
<.icon name="hero-check" class="h-5 w-5 text-blue-600 flex-shrink-0" />
Config backup &amp; diff
</li>
<li class="flex items-center gap-2">
<.icon name="hero-check" class="h-5 w-5 text-blue-600 flex-shrink-0" />
NetBox integration
</li>
<li class="flex items-center gap-2">
<.icon name="hero-check" class="h-5 w-5 text-blue-600 flex-shrink-0" />
Capacity planning insights
</li>
<li class="flex items-center gap-2">
<.icon name="hero-check" class="h-5 w-5 text-blue-600 flex-shrink-0" />
1-year data retention
</li>
<li class="flex items-center gap-2">
<.icon name="hero-check" class="h-5 w-5 text-blue-600 flex-shrink-0" />
Priority support
</li>
<li class="flex items-center gap-2">
<.icon name="hero-check" class="h-5 w-5 text-blue-600 flex-shrink-0" />
Custom integrations
</li>
</ul>
<.link
navigate={~p"/users/register"}
class="mt-8 block w-full rounded-full py-2.5 text-center text-sm font-semibold text-blue-600 ring-1 ring-blue-200 hover:ring-blue-300 hover:bg-blue-50"
>
Start 14-day free trial
</.link>
</div>
</div>
<p class="mt-8 text-center text-sm text-slate-500">
All plans include team access, email alerts, and API access.
Need a custom plan for 500+ devices? <a href="mailto:hello@towerops.net" class="text-blue-600 hover:text-blue-500 underline">Talk to us</a>.
</p>
</div>
</section>
<!-- Tech Details -->
<section class="py-20 sm:py-24">
<div class="mx-auto max-w-7xl px-4 sm:px-6 lg:px-8">
<div class="mx-auto max-w-2xl md:text-center">
<h2 class="font-display text-3xl tracking-tight text-slate-900 sm:text-4xl">
Built for network engineers
</h2>
<p class="mt-4 text-lg tracking-tight text-slate-700">
We know you care about the details. Here's what's under the hood.
</p>
</div>
<div class="mt-16 grid grid-cols-1 gap-6 sm:grid-cols-2 lg:grid-cols-4">
<div class="rounded-lg border border-slate-200 p-6">
<h3 class="font-semibold text-slate-900">786 Device Profiles</h3>
<p class="mt-2 text-sm text-slate-600">
MikroTik, Ubiquiti, Cambium, Cisco, Juniper, and hundreds more. Auto-detected via SNMP sysObjectID.
</p>
</div>
<div class="rounded-lg border border-slate-200 p-6">
<h3 class="font-semibold text-slate-900">Secure Agent Architecture</h3>
<p class="mt-2 text-sm text-slate-600">
Agent initiates outbound-only connections. Your devices never touch the internet. Zero attack surface.
</p>
</div>
<div class="rounded-lg border border-slate-200 p-6">
<h3 class="font-semibold text-slate-900">SNMP v1/v2c/v3</h3>
<p class="mt-2 text-sm text-slate-600">
Full SNMP support including SNMPv3 auth/priv. Custom OID polling for vendor-specific metrics.
</p>
</div>
<div class="rounded-lg border border-slate-200 p-6">
<h3 class="font-semibold text-slate-900">Real-time LiveView UI</h3>
<p class="mt-2 text-sm text-slate-600">
No page refreshes. WebSocket-powered dashboard updates in real time as metrics flow in.
</p>
</div>
</div>
</div>
</section>
<!-- Final CTA -->
<section class="relative overflow-hidden bg-blue-600 py-32">
<div class="mx-auto max-w-7xl px-4 sm:px-6 lg:px-8 relative">
<div class="mx-auto max-w-lg text-center">
<h2 class="font-display text-3xl tracking-tight text-white sm:text-4xl">
Start monitoring today
Stop guessing. Start seeing impact.
</h2>
<p class="mt-4 text-lg tracking-tight text-white">
Monitor up to 10 devices for free. No credit card required.
<p class="mt-4 text-lg tracking-tight text-blue-100">
Free for up to 10 devices. Deploy an agent, connect your billing system,
and see the difference in your first outage.
</p>
<.link
navigate={~p"/users/register"}
class="group inline-flex items-center justify-center rounded-full py-2 px-4 text-sm font-semibold focus-visible:outline-2 focus-visible:outline-offset-2 mt-10 bg-white text-slate-900 hover:bg-blue-50 active:bg-blue-200 active:text-slate-600 focus-visible:outline-white"
class="group inline-flex items-center justify-center rounded-full py-3 px-6 text-sm font-semibold focus-visible:outline-2 focus-visible:outline-offset-2 mt-10 bg-white text-slate-900 hover:bg-blue-50 active:bg-blue-200 active:text-slate-600 focus-visible:outline-white"
>
Get started free
Start monitoring free →
</.link>
</div>
</div>

View file

@ -1,3 +1,9 @@
2026-02-13 — New Marketing Site
* Completely redesigned landing page focused on WISP/ISP operators
* New sections: pain points, subscriber impact features, use cases by role (NOC/Help Desk/Owner)
* Pricing page with Starter (free), Pro ($3/device/mo), and Business ($6/device/mo) tiers
* Technical details section highlighting 786 device profiles, SNMP v1/v2c/v3, secure agent architecture
2026-02-13 — Smart Alert Triage
* Alerts page now groups alerts by site/tower so you can see which locations have the most problems
* Filter by: All, Critical, Unresolved, Resolved