:root{
  --bg: #faf7f1;
  --bg-alt: #f3ede3;
  --ink: #24211c;
  --ink-soft: #6b6255;
  --ink-faint: #a49a89;
  --line: rgba(36,33,28,0.10);
  --line-strong: rgba(36,33,28,0.16);
  --card: #ffffff;
  --accent: #b45324;
  --accent-soft: #f2e2d3;
  --accent-ink: #7a3714;
  --good: #4d7c5f;
  --good-soft: #e4efe6;
}
*{box-sizing:border-box;}
body{
  font-family:-apple-system,BlinkMacSystemFont,'Segoe UI','PingFang SC',sans-serif;
  background:var(--bg); color:var(--ink); margin:0;
}
a{color:inherit;}

.card{background:var(--card);border:1px solid var(--line);border-radius:18px;}
.card-hover{transition:border-color .25s,box-shadow .25s,transform .25s;}
.card-hover:hover{border-color:var(--line-strong);box-shadow:0 10px 30px rgba(36,33,28,0.06);transform:translateY(-2px);}

.btn-primary{background:var(--ink);color:#fff;transition:opacity .2s,transform .2s;display:inline-block;}
.btn-primary:hover{opacity:.85;transform:translateY(-1px);}
.btn-secondary{background:transparent;color:var(--ink);border:1px solid var(--line-strong);transition:background .2s,border-color .2s;display:inline-block;}
.btn-secondary:hover{background:rgba(36,33,28,0.04);}

.eyebrow{font-size:11px;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:var(--accent-ink);}

.dot-live{width:6px;height:6px;border-radius:50%;background:#4d7c5f;}
@keyframes pulse-dot{0%,100%{opacity:1}50%{opacity:.3}}
.pulse-dot{animation:pulse-dot 2s ease-in-out infinite;}

.code-block{
  background:#1f1c17;color:#ece6da;border-radius:12px;padding:18px;
  font-family:'SF Mono','Fira Code','Courier New',monospace;font-size:12.5px;line-height:1.8;
  overflow-x:auto;
}
.code-block .k{color:#c9a4d6;}
.code-block .s{color:#8fbc8f;}
.code-block .c{color:#8b8377;}
.code-block .p{color:#c7bfb0;}
.code-block .v{color:#e0b96a;}

/* ── Header (shared) ── */
.site-header{background:rgba(250,247,241,0.9);backdrop-filter:blur(10px);border-bottom:1px solid var(--line);position:fixed;top:0;left:0;right:0;z-index:50;}
.site-header .inner{max-width:1120px;margin:0 auto;padding:0 16px;height:64px;display:flex;align-items:center;justify-content:space-between;gap:16px;}
.site-header .logo{display:flex;align-items:center;gap:10px;flex-shrink:0;text-decoration:none;}
.site-header .logo-box{width:32px;height:32px;border-radius:8px;background:var(--ink);display:flex;align-items:center;justify-content:center;}
.site-header .logo-box span{color:#fff;font-weight:900;font-size:13px;}
.site-header nav{display:flex;align-items:center;gap:2px;font-size:14px;color:var(--ink-soft);}
.site-header nav a{padding:8px 12px;border-radius:8px;text-decoration:none;color:inherit;font-weight:500;transition:background .15s;}
.site-header nav a:hover{background:rgba(0,0,0,0.05);}
.site-header nav a.active-nav{background:var(--accent-soft);color:var(--accent-ink);}
@media(max-width:820px){.site-header nav{display:none;}}

.stat-tile{border:1px solid var(--line);border-radius:14px;padding:14px 16px;background:var(--bg-alt);}

.tab-btn{padding:8px 16px;font-size:13px;font-weight:600;border-radius:999px;color:var(--ink-soft);border:1px solid transparent;transition:all .18s;white-space:nowrap;cursor:pointer;background:none;}
.tab-btn:hover{color:var(--ink);}
.tab-btn.active{background:var(--ink);color:#fff;}

.price-table th{font-size:11px;text-transform:uppercase;letter-spacing:.06em;color:var(--ink-faint);font-weight:700;text-align:left;padding:10px 14px;border-bottom:1px solid var(--line);}
.price-table td{padding:14px;border-bottom:1px solid var(--line);font-size:13.5px;}
.price-table tr:last-child td{border-bottom:none;}
.badge-save{background:var(--good-soft);color:var(--good);font-size:11px;font-weight:700;padding:2px 8px;border-radius:999px;}

.footer{border-top:1px solid var(--line);padding:32px 16px;}
.footer .inner{max-width:1120px;margin:0 auto;display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:16px;}