/* Syracuse Reviews v2 — white, quiet, glass */
:root{
  --bg:#f7f9fb;
  --panel:#ffffff;
  --ink:#0f172a;
  --muted:#5b6473;
  --line:#e7eef5;
  --brand:#0ea5e9;
  --accent:#22c55e;
  --ring: rgba(14,165,233,.18);
  --shadow: 0 10px 30px rgba(15,23,42,.06), 0 2px 10px rgba(15,23,42,.04);
}

*{box-sizing:border-box}
html,body{height:100%}
body{
  margin:0;
  font-family:Inter, system-ui, -apple-system, Segoe UI, Roboto, Arial;
  color:var(--ink);
  background:
    radial-gradient(1000px 600px at 20% -10%, #eefaff 0%, transparent 45%),
    linear-gradient(180deg, #fff 0%, var(--bg) 100%);
  -webkit-font-smoothing:antialiased;
  text-rendering:optimizeLegibility;
}

.wrap{max-width:1120px;margin:0 auto;padding:0 20px}
.center{text-align:center}
.mb16{margin-bottom:16px}
.xsmall{font-size:12px}

/* Header */
.site-header{
  position:sticky;top:0;z-index:20;
  background:rgba(255,255,255,.6);
  border-bottom:1px solid var(--line);
  backdrop-filter:saturate(160%) blur(10px);
}
.nav{height:72px;display:flex;align-items:center;justify-content:space-between}
.brand{display:inline-flex;align-items:center;gap:.5rem;text-decoration:none;color:var(--ink);font-weight:800}
.gem{width:10px;height:10px;border-radius:50%;background:var(--brand);box-shadow:0 0 0 5px rgba(14,165,233,.15)}
.nav-links{display:flex;gap:18px;align-items:center}
.nav-links a{color:var(--muted);text-decoration:none;font-weight:600}
.nav-links a:hover{color:var(--ink)}
.btn{background:var(--ink);color:#fff;border-radius:14px;padding:14px 18px;text-decoration:none;font-weight:700;box-shadow:var(--shadow);transition:transform .15s ease, box-shadow .15s ease}
.btn:hover{transform:translateY(-1px)}
.btn.small{padding:10px 12px;border-radius:12px}
.btn.ghost{background:#fff;color:var(--ink);border:1px solid var(--line)}
.btn.block{display:block;width:100%}

/* Hero */
.hero{padding:72px 0 24px}
.hero-grid{display:grid;grid-template-columns:1.1fr .9fr;gap:44px;align-items:center}
.hero-copy h1{font-size: clamp(40px, 7vw, 72px);line-height:1.02;margin:0 0 10px}
.hero-copy .sub{color:var(--muted);font-size: clamp(16px, 2.6vw, 18px);margin:6px 0 18px}
.hero-cta{display:flex;gap:12px}
.trust{color:var(--muted);margin-top:8px}
.hero-scene{position:relative;min-height:420px}
.map{position:absolute;inset:0;border-radius:24px;background:
  radial-gradient(100px 100px at 80% 30%, #e8eef5 0%, transparent 60%),
  linear-gradient(180deg, #f8fbff 0%, #eef2f8 100%);
  border:1px solid var(--line);box-shadow:var(--shadow)}
.haze{filter:blur(.2px) saturate(110%)}
.glass{backdrop-filter:saturate(140%) blur(8px); background:rgba(255,255,255,.66); border:1px solid rgba(231,238,245,.9); border-radius:16px; box-shadow:var(--shadow)}
.soft{background:rgba(255,255,255,.8)}
.stack{position:absolute;padding:16px}
.card-a{left:18px;right:120px;top:16px}
.card-b{right:18px;top:160px;min-width:240px}
.row{display:flex;align-items:center;gap:10px}
.brand-dot{width:12px;height:12px;border-radius:6px;background:var(--brand);box-shadow:0 0 0 4px var(--ring)}
.avatar{width:24px;height:24px;border-radius:50%;background:linear-gradient(135deg,#bfe6ff,#a5b4fc)}
.dots{margin-left:auto;border:0;background:transparent;color:#8a95a5;font-weight:800}
.stars{letter-spacing:2px;color:#f59e0b;margin:8px 0 4px}
.muted{color:var(--muted)}

/* Pricing */
.pricing{padding:16px 0 12px}
.plan-row{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;margin-top:16px}
.plan{position:relative;padding:22px;border-radius:18px;border:1px solid var(--line)}
.plan h3{margin:0 0 6px}
.price{font-size:36px;font-weight:900;margin:6px 0 16px}
.currency{font-size:.6em;opacity:.7;margin-right:1px}
.term{font-size:.5em;color:var(--muted);font-weight:800}
.flag{position:absolute;transform:translateY(-14px);right:22px;background:rgba(14,165,233,.12);color:#0369a1;padding:6px 10px;border-radius:999px;border:1px solid var(--ring);font-size:12px}
.pop{outline:2px solid var(--ring)}
.list{list-style:none;margin:0 0 16px;padding:0;display:grid;gap:10px;color:var(--muted);font-weight:500}

/* Tiles */
.tiles{padding:24px 0}
.tile-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}
.tile{padding:20px;border-radius:16px;border:1px solid var(--line)}
.tile h4{margin:0 0 6px}
.tile p{margin:0;color:var(--muted)}

/* Partners */
.partners{padding:24px 0}
.logos{display:grid;grid-template-columns:repeat(5,1fr);gap:14px;list-style:none;padding:0;margin:14px 0 0}
.logos li{display:flex;align-items:center;justify-content:center;background:#fff;border:1px solid var(--line);border-radius:12px;padding:16px;font-weight:800;color:#111827;box-shadow:var(--shadow);opacity:.95}

/* CTA */
.cta{padding:40px 0 64px}
.cta-card{display:flex;align-items:center;justify-content:space-between;gap:18px;padding:24px;border-radius:18px;border:1px solid var(--line)}

/* Footer */
.site-footer{border-top:1px solid var(--line);background:#fff}
.foot{display:flex;align-items:center;justify-content:space-between;padding:18px 0}

/* Motion */
.reveal{opacity:0;transform:translateY(10px);transition:opacity .5s ease, transform .5s ease}
.reveal.show{opacity:1;transform:translateY(0)}
.hero-scene:hover .card-a{transform:translateY(-2px)}
.hero-scene:hover .card-b{transform:translateY(-1px)}

/* Responsive */
@media (max-width: 980px){
  .hero-grid{grid-template-columns:1fr}
  .plan-row{grid-template-columns:1fr}
  .tile-grid{grid-template-columns:1fr}
  .logos{grid-template-columns:repeat(2,1fr)}
  .cta-card{flex-direction:column;align-items:flex-start}
}
