/* Rozenberg Enterprises — site styles
   Hand-written; no framework, no CDN. Served from /var/www/cdn
   alongside index.html. Source of truth is site/ in the repo. */

/* ─────────────────────────────────────────────────────────────
   Self-contained. No external stylesheets, fonts or scripts —
   the page renders identically with no network access beyond
   the HTML itself.
   ───────────────────────────────────────────────────────────── */

:root {
  --s900:#0f172a; --s800:#1e293b; --s700:#334155; --s600:#475569;
  --s500:#64748b; --s400:#94a3b8; --s300:#cbd5e1; --s200:#e2e8f0;
  --s100:#f1f5f9; --s50:#f8fafc;
  --edge50:#ecfeff; --edge100:#cffafe; --edge400:#22d3ee;
  --edge500:#06b6d4; --edge600:#0891b2; --edge700:#0e7490;
  --em50:#ecfdf5; --em200:#a7f3d0; --em300:#6ee7b7;
  --em500:#10b981; --em600:#059669;
  --amber300:#fcd34d; --amber400:#fbbf24;
  --sans: system-ui,-apple-system,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;
  --mono: ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;
  --wrap: 80rem;
  --pad: 1.25rem;
}

*,*::before,*::after { box-sizing:border-box; }
html { scroll-behavior:smooth; -webkit-text-size-adjust:100%; }
body {
  margin:0; background:#fff; color:var(--s600);
  font-family:var(--sans); font-size:16px; line-height:1.5;
  -webkit-font-smoothing:antialiased; -moz-osx-font-smoothing:grayscale;
}
img,svg { display:block; max-width:100%; }
a { color:inherit; text-decoration:none; }
ul,ol,dl,dd { margin:0; padding:0; list-style:none; }
h1,h2,h3,h4,p,dt { margin:0; }
button { font:inherit; color:inherit; }
::selection { background:var(--edge100); color:var(--s900); }
:focus-visible { outline:2px solid var(--edge500); outline-offset:2px; border-radius:4px; }
.hidden { display:none !important; }

/* ── layout ─────────────────────────────────────────────────── */
.wrap { max-width:var(--wrap); margin-inline:auto; padding-inline:var(--pad); }
.wrap-5xl { max-width:64rem; margin-inline:auto; }
.wrap-4xl { max-width:56rem; margin-inline:auto; padding-inline:var(--pad); }
.wrap-3xl { max-width:48rem; margin-inline:auto; }
.wrap-2xl { max-width:42rem; margin-inline:auto; }
.section { border-bottom:1px solid var(--s200); padding-block:6rem; }
.section--tint { background:var(--s50); }
.section--tight { padding-block:5rem; }
.center { text-align:center; }

/* ── type ───────────────────────────────────────────────────── */
.eyebrow {
  font-size:13px; font-weight:600; text-transform:uppercase;
  letter-spacing:.18em; color:var(--edge600);
}
.h1 {
  margin-top:1.75rem; font-size:clamp(2.75rem,7vw,4.5rem); font-weight:600;
  line-height:1.05; letter-spacing:-.025em; color:var(--s900); text-wrap:balance;
}
.h2 {
  margin-top:.75rem; font-size:clamp(2rem,4.5vw,2.625rem); font-weight:600;
  line-height:1.12; letter-spacing:-.025em; color:var(--s900); text-wrap:balance;
}
.h2--cta { margin-top:0; font-size:clamp(2rem,5vw,3rem); }
.h3 { font-size:17px; font-weight:600; color:var(--s900); }
.lead {
  margin-top:1rem; font-size:16px; line-height:1.65; color:var(--s600);
}
.lead--hero {
  margin-top:1.5rem; max-width:36rem; margin-inline:auto;
  font-size:17px; line-height:1.65; text-wrap:pretty;
}
.fine { font-size:13px; color:var(--s400); }

/* ── buttons ────────────────────────────────────────────────── */
.btn {
  display:inline-block; border-radius:.5rem; padding:.75rem 1.5rem;
  font-size:15px; font-weight:500; text-align:center;
  box-shadow:0 1px 2px rgba(15,23,42,.05);
  transition:background-color .15s, border-color .15s, color .15s;
}
.btn--dark { background:var(--s900); color:#fff; font-weight:600; }
.btn--dark:hover { background:var(--s700); }
.btn--ghost { background:#fff; color:var(--s900); border:1px solid var(--s200); }
.btn--ghost:hover { background:var(--s50); }
.btn--sm { padding:.5rem .875rem; font-size:14px; }
.btn--block { display:block; width:100%; padding:.625rem 1rem; }
.btn-row {
  margin-top:2.25rem; display:flex; flex-direction:column;
  align-items:center; justify-content:center; gap:.75rem;
}
.btn-row .btn { width:100%; }

/* ── announcement ───────────────────────────────────────────── */
.announce {
  border-bottom:1px solid var(--s200); background:var(--s50);
  text-align:center; font-size:13px; color:var(--s600);
}
.announce .wrap { padding-block:.625rem; }
.pill {
  margin-right:.5rem; border-radius:9999px; background:var(--edge100);
  padding:.125rem .5rem; font-size:11px; font-weight:600;
  text-transform:uppercase; letter-spacing:.05em; color:var(--edge700);
}
.announce a {
  margin-left:.25rem; font-weight:500; color:var(--s900);
  text-decoration:underline; text-decoration-color:var(--s300);
  text-underline-offset:4px; transition:text-decoration-color .15s;
}
.announce a:hover { text-decoration-color:var(--edge500); }

/* ── header ─────────────────────────────────────────────────── */
.header {
  position:sticky; top:0; z-index:50;
  border-bottom:1px solid var(--s200);
  background:rgba(255,255,255,.85); backdrop-filter:blur(20px);
}
.nav {
  max-width:var(--wrap); margin-inline:auto; padding:.875rem var(--pad);
  display:flex; align-items:center; gap:2rem;
}
.brand { display:flex; align-items:center; gap:.625rem; flex-shrink:0; }
.brand svg { width:2rem; height:2rem; }
.brand-name {
  font-size:15px; font-weight:600; letter-spacing:-.02em; color:var(--s900);
}
.brand-name span { font-weight:400; color:var(--s400); }
.nav-links { display:none; align-items:center; gap:1.75rem; font-size:14px; }
.nav-links a { color:var(--s600); transition:color .15s; }
.nav-links a:hover { color:var(--s900); }
.nav-status { display:flex; align-items:center; gap:.375rem; }
.nav-actions { margin-left:auto; display:flex; align-items:center; gap:.5rem; }
.nav-signin {
  display:none; border-radius:.5rem; padding:.5rem .875rem;
  font-size:14px; color:var(--s700); transition:background-color .15s,color .15s;
}
.nav-signin:hover { background:var(--s100); color:var(--s900); }

/* ── dots / pulse ───────────────────────────────────────────── */
.dot { border-radius:9999px; flex-shrink:0; }
.dot--sm { width:.375rem; height:.375rem; }
.dot--md { width:.625rem; height:.625rem; }
.dot--em { background:var(--em500); }
.dot--edge { background:var(--edge500); }
.pulse { position:relative; display:inline-flex; }
.pulse .ring {
  position:absolute; inset:0; border-radius:9999px; background:var(--em500);
  animation:ping2 2.6s cubic-bezier(0,0,.2,1) infinite;
}
.pulse .core { position:relative; display:inline-flex; }
@keyframes ping2 {
  0%   { transform:scale(1);   opacity:.7; }
  80%,100% { transform:scale(2.6); opacity:0; }
}

/* ── hero ───────────────────────────────────────────────────── */
.hero { position:relative; overflow:hidden; border-bottom:1px solid var(--s200); }
.hero-inner {
  position:relative; max-width:var(--wrap); margin-inline:auto;
  padding:6rem var(--pad);
}
.grid-bg, .glow { position:absolute; inset:0; pointer-events:none; }
.grid-bg {
  background-image:
    linear-gradient(rgba(15,23,42,.045) 1px, transparent 1px),
    linear-gradient(90deg, rgba(15,23,42,.045) 1px, transparent 1px);
  background-size:56px 56px;
  -webkit-mask-image:radial-gradient(70% 70% at 50% 30%, #000 40%, transparent 100%);
          mask-image:radial-gradient(70% 70% at 50% 30%, #000 40%, transparent 100%);
}
.glow { background:radial-gradient(58% 55% at 50% -5%, rgba(6,182,212,.13), transparent 70%); }
.badge {
  display:inline-flex; align-items:center; gap:.5rem;
  border:1px solid var(--s200); border-radius:9999px; background:#fff;
  padding:.375rem .875rem; font-size:13px; color:var(--s600);
  box-shadow:0 1px 2px rgba(15,23,42,.05);
  transition:border-color .15s, color .15s;
}
.badge:hover { border-color:rgba(6,182,212,.5); color:var(--s900); }

/* ── stats / card grids ─────────────────────────────────────── */
.tiles {
  display:grid; gap:1px; background:var(--s200);
  border:1px solid var(--s200); border-radius:1rem; overflow:hidden;
  box-shadow:0 1px 2px rgba(15,23,42,.05);
}
.tiles--stats { margin-top:5rem; grid-template-columns:repeat(2,1fr); }
.tiles--features { margin-top:3.5rem; grid-template-columns:1fr; }
.stat { background:#fff; padding:1.75rem 1.5rem; text-align:center; }
.stat-num {
  font-size:1.875rem; font-weight:600; letter-spacing:-.025em; color:var(--s900);
  font-variant-numeric:tabular-nums;
}
.stat-num small { font-size:1.25rem; color:var(--s400); }
.stat-label { margin-top:.375rem; font-size:13px; color:var(--s500); }

.feature { background:#fff; padding:2rem; transition:background-color .15s; }
.feature:hover { background:var(--s50); }
.feature-icon {
  display:flex; align-items:center; justify-content:center;
  width:2.5rem; height:2.5rem; border-radius:.5rem;
  border:1px solid var(--edge100); background:var(--edge50); color:var(--edge600);
}
.feature-icon svg { width:1.25rem; height:1.25rem; }
.feature h3 { margin-top:1.25rem; }
.feature p { margin-top:.5rem; font-size:14.5px; line-height:1.65; color:var(--s600); }

/* ── logo wall ──────────────────────────────────────────────── */
.logowall { border-bottom:1px solid var(--s200); background:var(--s50); padding-block:3.5rem; }
.logowall-label {
  text-align:center; font-size:12px; font-weight:500;
  text-transform:uppercase; letter-spacing:.18em; color:var(--s400);
}
.logowall-list {
  margin-top:2rem; display:flex; flex-wrap:wrap;
  align-items:center; justify-content:center;
  column-gap:3rem; row-gap:1.5rem;
  font-size:15px; font-weight:600; letter-spacing:-.02em; color:var(--s400);
}
.logowall-list span { transition:color .15s; }
.logowall-list span:hover { color:var(--s600); }

/* ── split sections ─────────────────────────────────────────── */
.split { display:grid; align-items:center; gap:4rem; }

.metrics {
  margin-top:2rem; display:grid; grid-template-columns:repeat(2,1fr);
  gap:1.5rem; border-top:1px solid var(--s200); padding-top:2rem;
}
.metrics dt { font-size:13px; color:var(--s500); }
.metrics dd { margin:.25rem 0 0; font-size:1.5rem; font-weight:600; color:var(--s900); }

/* ── pop list ───────────────────────────────────────────────── */
.panel {
  border:1px solid var(--s200); border-radius:1rem; background:#fff;
  box-shadow:0 1px 2px rgba(15,23,42,.05); overflow:hidden;
}
.panel-head {
  display:flex; align-items:center; justify-content:space-between;
  border-bottom:1px solid var(--s200); padding:.75rem 1rem;
}
.panel-title { font-size:13px; font-weight:500; color:var(--s900); }
.panel-ok {
  display:flex; align-items:center; gap:.375rem;
  font-size:12px; font-weight:500; color:var(--em600);
}
.pops li {
  display:flex; align-items:center; gap:.75rem;
  padding:.625rem 1rem; font-size:14px;
  border-top:1px solid var(--s100);
}
.pops li:first-child { border-top:0; }
.pops .city { color:var(--s700); }
.pops .ms {
  margin-left:auto; font-family:var(--mono); font-size:13px;
  color:var(--s500); font-variant-numeric:tabular-nums;
}
.panel-foot {
  border-top:1px solid var(--s100); padding:.625rem 1rem;
  font-size:12px; color:var(--s400);
}

/* ── code block ─────────────────────────────────────────────── */
.code {
  border-radius:1rem; background:var(--s900); overflow:hidden;
  box-shadow:0 20px 25px -5px rgba(15,23,42,.1), 0 8px 10px -6px rgba(15,23,42,.1);
}
.code-bar {
  display:flex; align-items:center; gap:.5rem;
  border-bottom:1px solid rgba(255,255,255,.1); padding:.75rem 1rem;
}
.code-bar .tl { width:.625rem; height:.625rem; border-radius:9999px; background:rgba(255,255,255,.15); }
.code-name { margin-left:.5rem; font-family:var(--mono); font-size:12px; color:var(--s400); }
.code pre {
  margin:0; overflow-x:auto; padding:1.25rem;
  font-family:var(--mono); font-size:13px; line-height:1.75; color:var(--s300);
}
.c-dim { color:var(--s500); }
.c-cmd { color:var(--edge400); }
.c-str { color:var(--em300); }
.c-num { color:var(--amber300); }

.checks { margin-top:1.75rem; display:grid; gap:.75rem; font-size:15px; color:var(--s700); }
.checks li { display:flex; gap:.75rem; }
.checks .tick { color:var(--edge600); margin-top:.125rem; }

/* ── pricing ────────────────────────────────────────────────── */
.plans {
  margin-top:3.5rem; display:grid; gap:1.5rem;
  align-items:start; max-width:64rem; margin-inline:auto;
}
.plan {
  border:1px solid var(--s200); border-radius:1rem; background:#fff;
  padding:1.75rem; box-shadow:0 1px 2px rgba(15,23,42,.05);
}
.plan--featured {
  position:relative; border:2px solid var(--edge500);
  box-shadow:0 20px 25px -5px rgba(8,145,178,.1), 0 8px 10px -6px rgba(8,145,178,.1);
}
.plan-flag {
  position:absolute; top:-.75rem; left:1.75rem;
  border-radius:9999px; background:var(--edge600);
  padding:.25rem .625rem; font-size:11px; font-weight:600;
  text-transform:uppercase; letter-spacing:.05em; color:#fff;
}
.plan h3 { font-size:15px; }
.plan-note { margin-top:.375rem; font-size:14px; color:var(--s500); }
.plan-price { margin-top:1.5rem; }
.plan-price b {
  font-size:2.25rem; font-weight:600; letter-spacing:-.025em; color:var(--s900);
}
.plan-price span { font-size:14px; color:var(--s500); }
.plan .btn { margin-top:1.5rem; }
.plan-feats { margin-top:1.75rem; display:grid; gap:.625rem; font-size:14px; color:var(--s600); }
.plan-feats li { display:flex; gap:.625rem; }
.plan-feats .tick { color:var(--edge600); }

/* ── status ─────────────────────────────────────────────────── */
.status-card {
  border:1px solid var(--em200); border-radius:1rem;
  background:rgba(236,253,245,.6); padding:2rem;
}
.status-head { display:flex; flex-wrap:wrap; align-items:center; gap:1rem; }
.status-head h2 { font-size:19px; font-weight:600; color:var(--s900); margin:0; }
.status-updated { margin-left:auto; font-size:13px; color:var(--s500); }
.status-grid { margin-top:1.75rem; display:grid; gap:1.25rem; }
.status-row {
  display:flex; align-items:center; justify-content:space-between; font-size:13px;
}
.status-row .name { color:var(--s600); }
.status-row .pct { font-weight:500; color:var(--em600); }
.bars { margin-top:.5rem; display:flex; gap:3px; }
.bars i { display:block; flex:1; height:1.75rem; border-radius:2px; background:var(--em500); }
.bars i.warn { background:var(--amber400); }

/* ── footer ─────────────────────────────────────────────────── */
.footer { background:var(--s50); padding-block:4rem; }
.footer-grid { display:grid; gap:2.5rem; }
.footer-about p { margin-top:1rem; max-width:20rem; font-size:14px; line-height:1.65; color:var(--s600); }
.footer-addr { margin-top:1.25rem; font-size:13px; line-height:1.65; color:var(--s400); }
.footer h4 { font-size:13px; font-weight:600; color:var(--s900); }
.footer-links { margin-top:1rem; display:grid; gap:.625rem; font-size:14px; color:var(--s600); }
.footer-links a { transition:color .15s; }
.footer-links a:hover { color:var(--s900); }
.footer-base {
  margin-top:3rem; display:flex; flex-wrap:wrap; align-items:center; gap:1rem;
  border-top:1px solid var(--s200); padding-top:1.75rem;
  font-size:13px; color:var(--s400);
}
.footer-sep { display:none; }
.footer-edge { margin-left:auto; display:flex; align-items:center; gap:.375rem; }
.footer-edge b { font-family:var(--mono); font-weight:400; color:var(--s500); }

/* ── cookie notice ──────────────────────────────────────────── */
.cookie {
  position:fixed; bottom:1rem; left:1rem; z-index:50;
  width:calc(100% - 2rem); max-width:24rem;
  border:1px solid var(--s200); border-radius:.75rem;
  background:rgba(255,255,255,.95); backdrop-filter:blur(20px);
  padding:1.25rem;
  box-shadow:0 20px 25px -5px rgba(15,23,42,.1), 0 8px 10px -6px rgba(15,23,42,.1);
}
.cookie p { font-size:14px; line-height:1.65; color:var(--s600); }
.cookie-actions { margin-top:1rem; display:flex; gap:.5rem; }
.cookie-actions button {
  flex:1; border:0; border-radius:.5rem; background:var(--s900);
  padding:.5rem 1rem; font-size:14px; font-weight:500; color:#fff;
  cursor:pointer; transition:background-color .15s;
}
.cookie-actions button:hover { background:var(--s700); }
.cookie-actions a {
  border:1px solid var(--s200); border-radius:.5rem;
  padding:.5rem 1rem; font-size:14px; color:var(--s700);
  transition:background-color .15s;
}
.cookie-actions a:hover { background:var(--s50); }

/* ── responsive ─────────────────────────────────────────────── */
@media (min-width:640px) {
  .hero-inner { padding-top:8rem; }
  .btn-row { flex-direction:row; }
  .btn-row .btn { width:auto; }
  .nav-signin { display:block; }
  .tiles--features { grid-template-columns:repeat(2,1fr); }
  .status-grid { grid-template-columns:repeat(3,1fr); }
  .footer-grid { grid-template-columns:repeat(2,1fr); }
  .footer-sep { display:inline; }
}
@media (min-width:1024px) {
  .nav-links { display:flex; }
  .tiles--stats { grid-template-columns:repeat(4,1fr); }
  .tiles--features { grid-template-columns:repeat(3,1fr); }
  .split { grid-template-columns:repeat(2,1fr); }
  .plans { grid-template-columns:repeat(3,1fr); }
  .plan--featured { margin-top:-1rem; padding-block:2.25rem; }
  .footer-grid { grid-template-columns:repeat(5,1fr); }
  .footer-about { grid-column:span 2; }
  .code-col { order:1; }
  .docs-col { order:2; }
}

/* Respect a reduced-motion preference: the pulse and the count-up are
   decoration, and vestibular triggers are not worth a nice touch. */
@media (prefers-reduced-motion:reduce) {
  html { scroll-behavior:auto; }
  .pulse .ring { animation:none; opacity:.35; }
  *,*::before,*::after { transition-duration:.01ms !important; }
}