:root{
  --paper:#F6F6F2;
  --panel:#FFFFFF;
  --ink:#151412;
  --muted:#6B6860;
  --line:#E2E0D8;
  --red:#E03123;
  --red-soft:#FCE9E7;
  --green:#177A46;
  --green-soft:#E4F2E9;
  --amber:#B26E06;
  --amber-soft:#FBF0DC;
  --radius:10px;
}
*{margin:0;padding:0;box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  background:var(--paper);
  color:var(--ink);
  font-family:'Archivo',system-ui,sans-serif;
  font-size:17px;
  line-height:1.6;
  -webkit-font-smoothing:antialiased;
}
.wrap{max-width:1100px;margin:0 auto;padding:0 24px}
a{color:inherit}
::selection{background:var(--ink);color:var(--paper)}

nav{display:flex;align-items:center;justify-content:space-between;padding:22px 0}
.logo{font-family:'Bricolage Grotesque',sans-serif;font-weight:800;font-size:20px;letter-spacing:-.02em;display:flex;align-items:center;gap:9px;text-decoration:none}
.logo .dot{width:11px;height:11px;border-radius:50%;background:var(--red);display:inline-block}
.nav-cta{font-size:14px;font-weight:600;text-decoration:none;border:1.5px solid var(--ink);border-radius:999px;padding:8px 18px;transition:background .15s,color .15s}
.nav-cta:hover{background:var(--ink);color:var(--paper)}
.nav-cta:focus-visible,button:focus-visible,input:focus-visible,a:focus-visible{outline:2.5px solid var(--red);outline-offset:2px}

.eyebrow{font-family:'JetBrains Mono',monospace;font-size:12.5px;letter-spacing:.08em;text-transform:uppercase;color:var(--muted);margin-bottom:18px}
h1{
  font-family:'Bricolage Grotesque',sans-serif;
  font-weight:800;
  font-size:clamp(34px,4.2vw,52px);
  line-height:1.06;
  letter-spacing:-.025em;
  margin-bottom:20px;
  max-width:24ch;
}
h1 .leak{color:var(--red)}
.sub{font-size:19px;color:var(--muted);max-width:52ch;margin-bottom:30px}
.sub strong{color:var(--ink);font-weight:600}

.capture-note{font-size:13.5px;color:var(--muted);margin-top:12px}
.cta-btn{
  display:inline-block;margin-top:12px;
  font-weight:600;font-size:15px;
  padding:11px 18px;border-radius:var(--radius);
  background:var(--ink);color:var(--paper);
  text-decoration:none;transition:background .15s;
}
.cta-btn:hover{background:#000}

section{padding:56px 0}
.sec-eyebrow{font-family:'JetBrains Mono',monospace;font-size:12.5px;letter-spacing:.08em;text-transform:uppercase;color:var(--muted);margin-bottom:14px}
h2{font-family:'Bricolage Grotesque',sans-serif;font-weight:800;font-size:clamp(26px,3.2vw,36px);letter-spacing:-.02em;line-height:1.1;margin-bottom:14px;max-width:24ch}
.sec-sub{color:var(--muted);max-width:58ch;margin-bottom:38px}
.leaks{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}
.leak-card{
  background:var(--panel);
  border:1.5px solid var(--line);
  border-radius:14px;
  padding:26px 24px;
}
.leak-card .tag{
  display:inline-block;
  font-family:'JetBrains Mono',monospace;font-size:11.5px;letter-spacing:.05em;
  color:var(--red);background:var(--red-soft);
  border-radius:999px;padding:4px 11px;margin-bottom:16px;
}
.leak-card h3{font-family:'Bricolage Grotesque',sans-serif;font-weight:700;font-size:21px;letter-spacing:-.01em;margin-bottom:10px}
.leak-card p{font-size:15.5px;color:var(--muted)}
.leak-card p b{color:var(--ink);font-weight:600}
.leak-card .fix{margin-top:18px;padding-top:16px;border-top:1.5px dashed var(--line);font-size:15px}
.leak-card .fix::before{content:"→ ";color:var(--green);font-weight:700}

.how{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;counter-reset:step}
.step{border-top:2.5px solid var(--ink);padding-top:18px}
.step::before{
  counter-increment:step;content:counter(step,decimal-leading-zero);
  font-family:'JetBrains Mono',monospace;font-size:13px;color:var(--muted);
  display:block;margin-bottom:10px;
}
.step h3{font-family:'Bricolage Grotesque',sans-serif;font-weight:700;font-size:19px;margin-bottom:8px}
.step p{font-size:15.5px;color:var(--muted)}

.cmp{width:100%;border-collapse:collapse;font-size:15px;background:var(--panel)}
.cmp th,.cmp td{padding:12px 14px;border:1.5px solid var(--line);text-align:left;vertical-align:top}
.cmp th{font-family:'JetBrains Mono',monospace;font-size:12px;letter-spacing:.05em;text-transform:uppercase;color:var(--muted);background:#FCFCFA;font-weight:500}
.cmp td:first-child{font-weight:600;font-size:14.5px}
.cmp .yes{color:var(--green);font-weight:600}
.cmp .no{color:var(--muted)}
.cmp-note{font-size:13px;color:var(--muted);margin-top:14px;max-width:70ch}
.cmp-scroll{overflow-x:auto}

.final{
  background:var(--ink);color:var(--paper);
  border-radius:20px;
  padding:56px 40px;
  text-align:center;
  margin-bottom:72px;
}
.final h2{color:var(--paper);margin-left:auto;margin-right:auto}
.final .price-line{font-size:17px;color:#B8B5AC;margin-bottom:26px}
.final .price-line b{color:var(--paper);font-weight:600}
.final .cta-btn{background:var(--red);color:#fff}
.final .cta-btn:hover{background:#C4271B}
.final .capture-note{color:#8A877E}

footer{padding:0 0 44px;display:flex;justify-content:space-between;align-items:center;gap:14px;flex-wrap:wrap;font-size:13.5px;color:var(--muted)}
footer a{text-decoration:none}
footer a:hover{text-decoration:underline}

@media (max-width:880px){
  .leaks,.how{grid-template-columns:1fr}
  .final{padding:44px 22px}
}