/* Buttons, tags, section heads, pricing, FAQ, testimonials, stats numbers, CTA */
.btn{
  appearance:none;border:1px solid var(--border-strong);
  background:#fff;color:var(--ink-2);
  height:38px;padding:0 16px;border-radius:8px;
  font-size:14px;font-weight:500;
  display:inline-flex;align-items:center;gap:8px;
  transition:background .12s, border-color .12s, transform .08s;
}
.btn:hover{background:var(--surface-2)}
.btn:active{transform:translateY(1px)}
.btn.primary{background:var(--ink);color:#fff;border-color:var(--ink)}
.btn.primary:hover{background:#262626}
.btn.ghost{border-color:transparent;background:transparent}
.btn.ghost:hover{background:var(--surface-2)}
.btn.lg{height:46px;padding:0 22px;font-size:15px}
.btn svg{width:14px;height:14px}

.btn--block{width:100%;justify-content:center}

.kbd{
  font-family:var(--font-mono);font-size:11px;
  background:var(--surface-2);border:1px solid var(--border);
  border-bottom-width:2px;
  border-radius:4px;padding:1px 5px;color:var(--ink-3);
}
.tag{
  display:inline-flex;align-items:center;gap:6px;
  height:24px;padding:0 9px;border-radius:999px;
  font-size:12px;font-weight:500;
  background:var(--muted-bg);color:var(--muted-ink);
  border:1px solid var(--muted-bd);
}
.tag.dot::before{
  content:"";width:6px;height:6px;border-radius:50%;
  background:currentColor;opacity:.85;
}
.tag.ok{background:var(--ok-bg);color:var(--ok-ink);border-color:var(--ok-bd)}
.tag.warn{background:var(--warn-bg);color:var(--warn-ink);border-color:var(--warn-bd)}
.tag.info{background:var(--info-bg);color:var(--info-ink);border-color:var(--info-bd)}

.section-head{max-width:680px;margin-bottom:40px}
.section-head .label{
  font-size:12px;text-transform:uppercase;letter-spacing:.08em;
  color:var(--ink-4);font-weight:600;margin-bottom:10px;
}
.section-head h2{
  font-size:38px;line-height:1.1;letter-spacing:-.02em;font-weight:700;margin:0 0 12px;
  text-wrap:balance;
}
.section-head p{font-size:17px;color:var(--ink-3);line-height:1.55;margin:0;text-wrap:pretty}
@media (max-width:700px){
  .section-head h2{font-size:30px}
  .section-head p{font-size:15px}
}

.pain-grid{display:grid;grid-template-columns:repeat(3, 1fr);gap:14px}
@media (max-width:900px){.pain-grid{grid-template-columns:1fr}}
.pain{
  background:#fff;border:1px solid var(--border);border-radius:var(--radius-lg);
  padding:22px;box-shadow:var(--shadow-1);
}
.pain .quote{
  font-family:var(--font-mono);font-size:11px;color:var(--ink-4);
  text-transform:uppercase;letter-spacing:.07em;margin-bottom:8px;
}
.pain h3{
  font-size:17px;font-weight:600;letter-spacing:-.01em;margin:0 0 8px;
  text-wrap:balance;
}
.pain p{font-size:14px;color:var(--ink-3);line-height:1.55;margin:0}
.pain .fix{
  margin-top:14px;padding-top:14px;border-top:1px dashed var(--border-strong);
  display:flex;align-items:center;gap:8px;font-size:13px;color:var(--ok-ink);
  font-weight:500;
}
.pain .fix svg{width:14px;height:14px}

.stat .v{font-size:42px;font-weight:700;letter-spacing:-.025em;line-height:1}
.stat .v small{
  font-size:18px;font-weight:600;color:var(--ink-3);letter-spacing:0;margin-left:2px;
}
.stat .l{
  font-size:13px;color:var(--ink-3);margin-top:8px;max-width:230px;line-height:1.45;
}

.price-grid{
  display:grid;grid-template-columns:repeat(3, 1fr);gap:16px;margin-top:8px;
}
@media (max-width:900px){.price-grid{grid-template-columns:1fr}}
.price{
  background:#fff;border:1px solid var(--border);border-radius:14px;
  padding:24px;box-shadow:var(--shadow-1);position:relative;
  display:flex;flex-direction:column;
}
.price.featured{background:var(--ink);color:#fff;border-color:var(--ink);box-shadow:var(--shadow-3)}
.price .nm{font-size:15px;font-weight:600;letter-spacing:-.005em}
.price .sub{color:var(--ink-3);font-size:13px;margin-top:4px;min-height:36px}
.price.featured .sub{color:#a1a1aa}
.price .pp{margin:18px 0 14px;display:flex;align-items:baseline;gap:4px}
.price .pp .num{font-size:42px;font-weight:700;letter-spacing:-.025em}
.price .pp .per{font-size:13px;color:var(--ink-3)}
.price.featured .pp .per{color:#a1a1aa}
.price .feats{
  list-style:none;padding:0;margin:14px 0 22px;
  display:flex;flex-direction:column;gap:9px;
  border-top:1px solid var(--border);padding-top:18px;
}
.price.featured .feats{border-top-color:#262626}
.price .feats li{display:flex;gap:9px;align-items:flex-start;font-size:13.5px}
.price .feats li svg{width:14px;height:14px;flex:none;margin-top:4px;color:var(--ok-ink)}
.price.featured .feats li svg{color:#86efac}
.price .pick{margin-top:auto}
.price.featured .btn{background:#fff;color:var(--ink);border-color:#fff}
.price.featured .btn:hover{background:#f4f4f5}
.price .badge{
  position:absolute;top:14px;right:14px;
  font-size:10.5px;text-transform:uppercase;letter-spacing:.07em;font-weight:700;
  background:var(--warn-bg);color:var(--warn-ink);border:1px solid var(--warn-bd);
  padding:3px 8px;border-radius:999px;
}

.testimonial{
  background:var(--surface-2);border:1px solid var(--border);border-radius:var(--radius-xl);
  padding:48px;max-width:880px;margin:0 auto;
}
.testimonial blockquote{
  margin:0;font-size:24px;line-height:1.4;letter-spacing:-.01em;
  font-weight:500;color:var(--ink);text-wrap:balance;
}
.testimonial .by{
  margin-top:24px;padding-top:24px;border-top:1px solid var(--border);
  display:flex;align-items:center;gap:12px;
}
.testimonial .by .a{
  width:42px;height:42px;border-radius:50%;background:#e7e5e4;color:var(--ink-2);
  display:flex;align-items:center;justify-content:center;font-weight:600;
}
.testimonial .by .nm{font-weight:600;font-size:14px}
.testimonial .by .ro{color:var(--ink-3);font-size:13px;margin-top:1px}
@media (max-width:700px){
  .testimonial{padding:30px 24px}
  .testimonial blockquote{font-size:18px}
}

.faq{display:grid;grid-template-columns:280px 1fr;gap:48px}
@media (max-width:900px){.faq{grid-template-columns:1fr;gap:24px}}
.faq-list{
  background:#fff;border:1px solid var(--border);border-radius:var(--radius-lg);overflow:hidden;
}
.faq-intro .label{font-size:12px;text-transform:uppercase;letter-spacing:.08em;color:var(--ink-4);font-weight:600;margin-bottom:10px}
.faq-intro h2{font-size:28px;line-height:1.15;letter-spacing:-.02em;margin:0 0 12px;font-weight:700}
.faq-intro p{color:var(--ink-3);font-size:15px;line-height:1.55;margin:0}
.faq-intro a{color:var(--ink);text-decoration:underline;text-underline-offset:3px}
.faq-item{border-bottom:1px solid var(--border)}
.faq-item:last-child{border-bottom:0}
.faq-item summary{
  list-style:none;cursor:pointer;
  padding:18px 22px;font-size:15px;font-weight:600;
  display:flex;align-items:center;gap:12px;
}
.faq-item summary::-webkit-details-marker{display:none}
.faq-item summary::after{
  content:"+";margin-left:auto;font-size:20px;color:var(--ink-3);font-weight:400;
  transition:transform .15s;
}
.faq-item[open] summary::after{content:"–"}
.faq-item .ans{padding:0 22px 20px;font-size:14.5px;color:var(--ink-3);line-height:1.6}

.cta{
  background:var(--ink);color:#fff;border-radius:24px;
  padding:64px 56px;
  display:grid;grid-template-columns:1.4fr 1fr;gap:48px;align-items:center;
  position:relative;overflow:hidden;
}
.cta::before{
  content:"";position:absolute;inset:0;
  background:
    radial-gradient(800px 400px at 100% 0%, rgba(255,255,255,.06), transparent 60%),
    radial-gradient(600px 300px at 0% 100%, rgba(255,255,255,.04), transparent 60%);
  pointer-events:none;
}
.cta h3{
  font-size:36px;line-height:1.1;letter-spacing:-.02em;font-weight:700;margin:0 0 14px;
  text-wrap:balance;
}
.cta p{font-size:16px;color:#d4d4d8;margin:0 0 24px;line-height:1.55;max-width:480px}
.cta .actions{display:flex;gap:10px;align-items:center;flex-wrap:wrap}
.cta .btn{background:#fff;color:var(--ink);border-color:#fff}
.cta .btn.outline{background:transparent;color:#fff;border-color:#3f3f46}
.cta .btn.outline:hover{background:#1c1c1c}
.cta .right{position:relative}
.cta .signoff-box{
  background:#1c1c1c;border:1px solid #2a2a2a;border-radius:14px;padding:18px;
  font-family:var(--font-mono);font-size:12px;color:#d4d4d8;line-height:1.7;
}
.cta .signoff-box .ln{display:flex;gap:10px}
.cta .signoff-box .ln--sp{margin-top:8px}
.cta .signoff-box .gt{color:#71717a}
.cta .signoff-box .gn{color:#86efac}
.cta .signoff-box .or{color:#fcd34d}
.cta .signoff-box .ws{color:#fff}
@media (max-width:900px){
  .cta{grid-template-columns:1fr;padding:40px 28px}
  .cta h3{font-size:28px}
}
