:root{
  /* ---- palette: deep plum ink, mint signal, gold data ---- */
  --ink:#14101F;
  --ink-2:#1C1730;
  --ink-3:#241D3C;
  --paper:#EFEAF5;
  --dim:#9A93AB;
  --mint:#4FD8B0;
  --gold:#F2C14E;
  --line:rgba(239,234,245,.12);
  --line-2:rgba(239,234,245,.22);

  --display:'Bricolage Grotesque', system-ui, sans-serif;
  --body:'IBM Plex Sans', system-ui, sans-serif;
  --mono:'IBM Plex Mono', ui-monospace, monospace;
  --pad:clamp(20px, 5vw, 76px);
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0; background:var(--ink); color:var(--paper); font-family:var(--body);
  font-size:17px; line-height:1.65; -webkit-font-smoothing:antialiased}
a{color:inherit}
.wrap{max-width:1200px; margin:0 auto; padding-inline:var(--pad)}
.eyebrow{font-family:var(--mono); font-size:11.5px; letter-spacing:.14em;
  text-transform:uppercase; color:var(--mint); margin:0 0 18px}

/* strip */
.strip{background:var(--ink-2); border-bottom:1px solid var(--line); font-family:var(--mono);
  font-size:11.5px; letter-spacing:.09em; text-transform:uppercase; color:var(--dim)}
.strip-in{display:flex; justify-content:space-between; align-items:center; height:38px; gap:20px}
.strip b{color:var(--paper); font-weight:500}
.strip-r{display:flex; gap:24px}
@media (max-width:860px){.strip-r{display:none}}

/* nav */
.nav{position:sticky; top:0; z-index:60; background:rgba(20,16,31,.92);
  backdrop-filter:blur(12px); border-bottom:1px solid var(--line)}
.nav-in{display:flex; align-items:center; justify-content:space-between; height:74px}
.logo{font-family:var(--display); font-weight:800; font-size:21px; letter-spacing:-.025em; text-decoration:none}
.logo span{color:var(--mint)}
.nav-links{display:flex; gap:28px; align-items:center}
.nav-links a{font-size:15px; text-decoration:none; color:var(--dim); transition:color .2s}
.nav-links a:hover{color:var(--paper)}
.nav-cta{font-weight:600; background:var(--mint); color:var(--ink)!important; padding:11px 20px; border-radius:2px}
.burger{display:none; background:none; border:0; color:var(--paper); font-size:24px; cursor:pointer}

/* hero */
.hero{padding:clamp(56px,9vw,112px) 0 clamp(48px,7vw,88px)}
.hero-grid{display:grid; grid-template-columns:1.05fr .95fr; gap:clamp(32px,5vw,68px); align-items:start}
h1{font-family:var(--display); font-weight:800; font-size:clamp(37px,5.4vw,66px);
  line-height:1.03; letter-spacing:-.035em; margin:0 0 24px}
h1 em{font-style:normal; color:var(--mint)}
.hero>.wrap>div>p{color:var(--dim); font-size:clamp(17px,1.5vw,19px); max-width:48ch; margin:0 0 32px}
.btn-row{display:flex; gap:14px; flex-wrap:wrap}
.btn{display:inline-block; text-decoration:none; font-weight:600; font-size:16px;
  padding:14px 27px; border-radius:2px; transition:transform .15s, border-color .2s}
.btn-solid{background:var(--mint); color:var(--ink)}
.btn-solid:hover{transform:translateY(-2px)}
.btn-ghost{border:1px solid var(--line-2); color:var(--paper)}
.btn-ghost:hover{border-color:var(--paper)}

/* ledger */
.ledger{background:var(--ink-2); border:1px solid var(--line-2); border-radius:3px; overflow:hidden}
.ledger-head{display:flex; align-items:center; justify-content:space-between; padding:15px 19px;
  border-bottom:1px solid var(--line); font-family:var(--mono); font-size:11px;
  letter-spacing:.11em; text-transform:uppercase; color:var(--dim)}
.dot{display:inline-block; width:7px; height:7px; border-radius:50%; background:var(--mint);
  margin-right:9px; animation:pulse 2.4s ease-in-out infinite}
@keyframes pulse{0%,100%{opacity:1}50%{opacity:.3}}
.row{display:grid; grid-template-columns:1fr auto; gap:16px; padding:17px 19px;
  border-bottom:1px solid var(--line); opacity:0; transform:translateY(6px);
  animation:rowIn .55s ease forwards}
@keyframes rowIn{to{opacity:1; transform:none}}
.row:nth-child(2){animation-delay:.1s}.row:nth-child(3){animation-delay:.2s}
.row:nth-child(4){animation-delay:.3s}.row:nth-child(5){animation-delay:.4s}
.row-label{font-size:14px; color:var(--dim); line-height:1.4}
.row-label b{display:block; color:var(--paper); font-weight:500; font-size:15px; margin-bottom:2px}
.row-val{font-family:var(--mono); font-size:21px; color:var(--gold); white-space:nowrap; align-self:center}
.row-val.good{color:var(--mint)}
.ledger-foot{padding:14px 19px; font-family:var(--mono); font-size:11px; color:var(--dim);
  background:rgba(0,0,0,.22); letter-spacing:.04em; line-height:1.6}

/* sections */
.sec{padding:clamp(58px,8vw,104px) 0; border-top:1px solid var(--line)}
h2{font-family:var(--display); font-weight:600; font-size:clamp(28px,3.7vw,45px);
  line-height:1.1; letter-spacing:-.025em; margin:0 0 18px; max-width:22ch}
.lede{color:var(--dim); max-width:58ch; margin:0 0 clamp(32px,4vw,52px)}

/* ===== SIGNATURE 2: leak finder ===== */
.leak{display:grid; grid-template-columns:1.15fr .85fr; gap:clamp(28px,4vw,56px); align-items:start}
.leak-list{border-top:1px solid var(--line)}
.leak-item{display:flex; gap:16px; align-items:flex-start; padding:18px 4px;
  border-bottom:1px solid var(--line); cursor:pointer; transition:padding-left .2s, background .2s}
.leak-item:hover{padding-left:12px; background:rgba(239,234,245,.03)}
.box{flex:0 0 20px; width:20px; height:20px; margin-top:3px; border:1px solid var(--line-2);
  border-radius:2px; display:grid; place-items:center; font-family:var(--mono); font-size:13px;
  color:transparent; transition:.2s}
.leak-item.on .box{background:var(--mint); border-color:var(--mint); color:var(--ink)}
.leak-item.on .box::after{content:'✓'}
.leak-txt{font-size:16px; line-height:1.45}
.leak-txt small{display:block; color:var(--dim); font-size:14px; margin-top:4px}
.leak-panel{background:var(--ink-2); border:1px solid var(--line-2); border-radius:3px;
  padding:30px 28px; position:sticky; top:100px}
.score-num{font-family:var(--mono); font-size:56px; line-height:1; color:var(--mint); margin:6px 0 2px}
.score-lab{font-family:var(--mono); font-size:11px; letter-spacing:.12em; text-transform:uppercase; color:var(--dim)}
.bar{height:4px; background:rgba(239,234,245,.1); border-radius:2px; margin:22px 0 20px; overflow:hidden}
.bar span{display:block; height:100%; width:0; background:var(--mint); transition:width .45s cubic-bezier(.4,0,.2,1)}
.verdict{font-size:15.5px; color:var(--dim); min-height:78px; margin:0 0 22px}
.verdict b{color:var(--paper); font-weight:500}

/* markets */
.markets{display:grid; grid-template-columns:repeat(3,1fr); gap:1px; background:var(--line); border:1px solid var(--line)}
.market{background:var(--ink); padding:34px 28px}
.mono-tag{font-family:var(--mono); font-size:11px; letter-spacing:.12em; text-transform:uppercase; color:var(--mint)}
.market h3{font-family:var(--display); font-weight:600; font-size:22px; margin:13px 0 11px; letter-spacing:-.015em}
.market p{color:var(--dim); font-size:15px; margin:0 0 16px}
.market ul{list-style:none; padding:0; margin:0}
.market li{font-size:14.5px; color:var(--dim); padding:6px 0 6px 20px; position:relative}
.market li::before{content:'·'; position:absolute; left:5px; color:var(--gold); font-family:var(--mono)}

/* services */
.svc-list{border-top:1px solid var(--line)}
.svc{display:grid; grid-template-columns:56px 1fr auto; gap:24px; align-items:baseline; padding:27px 4px;
  border-bottom:1px solid var(--line); text-decoration:none; transition:padding-left .25s, background .25s}
.svc:hover{padding-left:16px; background:rgba(239,234,245,.03)}
.svc-num{font-family:var(--mono); font-size:12px; color:var(--mint); letter-spacing:.08em}
.svc-name{font-family:var(--display); font-weight:600; font-size:clamp(20px,2.4vw,28px); letter-spacing:-.018em}
.svc-desc{display:block; font-family:var(--body); font-weight:400; font-size:15px;
  color:var(--dim); margin-top:7px; max-width:62ch; letter-spacing:0}
.svc-arrow{color:var(--dim); font-size:20px; transition:color .2s, transform .2s}
.svc:hover .svc-arrow{color:var(--mint); transform:translateX(4px)}

/* why */
.why{display:grid; grid-template-columns:1fr 1fr; gap:clamp(32px,5vw,74px); align-items:start}
.why ul{list-style:none; padding:0; margin:26px 0 0}
.why li{padding:14px 0 14px 26px; border-bottom:1px solid var(--line); position:relative; font-size:16px; color:var(--dim)}
.why li::before{content:'—'; position:absolute; left:0; color:var(--mint); font-family:var(--mono)}
.quote{border-left:2px solid var(--mint); padding:6px 0 6px 26px; font-family:var(--display);
  font-weight:400; font-size:clamp(20px,2.4vw,29px); line-height:1.28; letter-spacing:-.015em}
.quote span{color:var(--dim); display:block; font-family:var(--mono); font-size:11.5px;
  letter-spacing:.11em; text-transform:uppercase; margin-top:18px}

/* ===== rate card (GMB + backlinks) ===== */
.rate{border:1px solid var(--line); border-radius:3px; overflow:hidden; background:var(--ink-2)}
.rate-head,.rate-row{display:grid; grid-template-columns:1.6fr .9fr .9fr; gap:18px; padding:15px 22px; align-items:center}
.rate-head{font-family:var(--mono); font-size:10.5px; letter-spacing:.12em; text-transform:uppercase;
  color:var(--dim); border-bottom:1px solid var(--line-2); background:rgba(0,0,0,.2)}
.rate-row{border-bottom:1px solid var(--line); transition:background .2s}
.rate-row:last-child{border-bottom:0}
.rate-row:hover{background:rgba(239,234,245,.03)}
.rate-name{font-size:15.5px; font-weight:500; line-height:1.35}
.rate-name small{display:block; color:var(--dim); font-size:13.5px; font-weight:400; margin-top:4px; line-height:1.5}
.rate-mkt{font-family:var(--mono); font-size:14px; color:var(--dim); text-align:right; white-space:nowrap}
.rate-ours{font-family:var(--mono); font-size:17px; color:var(--gold); text-align:right; white-space:nowrap}
.rate-ours.free{color:var(--mint)}
@media (max-width:720px){
  .rate-head{display:none}
  .rate-row{grid-template-columns:1fr auto; row-gap:6px; padding:18px 18px}
  .rate-name{grid-column:1 / -1}
  .rate-mkt{text-align:left; font-size:12.5px}
  .rate-mkt::before{content:'Market: '}
  .rate-ours{font-size:18px}
}
.rate-legend{font-family:var(--mono); font-size:12px; color:var(--dim); margin-top:20px; letter-spacing:.03em; line-height:1.8}
.rate-legend b{color:var(--paper); font-weight:500}
.warn{border-left:2px solid var(--gold); padding:4px 0 4px 20px; margin-top:30px; color:var(--dim); font-size:15px; max-width:70ch}
.warn b{color:var(--paper); font-weight:500}

/* pricing */
.price-head{display:flex; justify-content:space-between; align-items:flex-end; gap:24px; flex-wrap:wrap; margin-bottom:clamp(28px,4vw,42px)}
.cur-toggle{display:inline-flex; border:1px solid var(--line-2); border-radius:2px; overflow:hidden; flex-shrink:0}
.cur-toggle button{font-family:var(--mono); font-size:12px; letter-spacing:.09em; background:none;
  border:0; color:var(--dim); padding:10px 17px; cursor:pointer; transition:.2s}
.cur-toggle button.on{background:var(--mint); color:var(--ink)}
.prices{display:grid; grid-template-columns:repeat(3,1fr); gap:16px}
.price{border:1px solid var(--line); padding:32px 28px; border-radius:3px; display:flex; flex-direction:column}
.price.featured{border-color:var(--mint); background:var(--ink-2)}
.price .tag{font-family:var(--mono); font-size:11px; letter-spacing:.11em; text-transform:uppercase; color:var(--dim)}
.price.featured .tag{color:var(--mint)}
.price h3{font-family:var(--display); font-weight:600; font-size:24px; margin:13px 0 4px; letter-spacing:-.015em}
.price .amt{font-family:var(--mono); font-size:31px; margin:10px 0 4px; color:var(--gold)}
.price .per{font-size:13px; color:var(--dim); margin:0 0 22px}
.price ul{list-style:none; padding:0; margin:0 0 26px; flex:1}
.price li{font-size:15px; color:var(--dim); padding:7px 0 7px 20px; position:relative}
.price li::before{content:'+'; position:absolute; left:0; color:var(--mint); font-family:var(--mono)}
.note{font-family:var(--mono); font-size:12px; color:var(--dim); margin-top:26px; letter-spacing:.03em; line-height:1.7}

/* faq */
.faq details{border-bottom:1px solid var(--line); padding:20px 0}
.faq summary{cursor:pointer; list-style:none; font-family:var(--display); font-weight:500;
  font-size:19px; letter-spacing:-.01em; display:flex; justify-content:space-between; gap:20px}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:'+'; font-family:var(--mono); color:var(--mint); flex-shrink:0}
.faq details[open] summary::after{content:'−'}
.faq p{color:var(--dim); font-size:15.5px; margin:14px 0 0; max-width:70ch}

/* cta */
.cta{text-align:center; padding:clamp(66px,9vw,120px) 0}
.cta h2{margin-inline:auto; max-width:17ch}
.cta .lede{margin-inline:auto; text-align:center}
.contact-lines{font-family:var(--mono); font-size:13px; color:var(--dim); margin-top:32px; line-height:2; letter-spacing:.03em}
.contact-lines a{text-decoration:none; color:var(--paper); border-bottom:1px solid var(--line-2)}
.contact-lines a:hover{border-color:var(--mint); color:var(--mint)}

footer{border-top:1px solid var(--line); padding:44px 0 56px; font-size:14px; color:var(--dim)}
.foot-in{display:flex; justify-content:space-between; gap:24px; flex-wrap:wrap; align-items:center}
.foot-links{display:flex; gap:22px; flex-wrap:wrap}
.foot-links a{text-decoration:none}
.foot-links a:hover{color:var(--paper)}

@media (max-width:980px){ .markets{grid-template-columns:1fr} }
@media (max-width:900px){
  .hero-grid,.why,.leak{grid-template-columns:1fr}
  .probs,.prices{grid-template-columns:1fr}
  .leak-panel{position:static}
  .nav-links{display:none}
  .nav-links.open{display:flex; flex-direction:column; position:absolute; top:74px; left:0; right:0;
    background:var(--ink); padding:24px var(--pad) 30px; gap:18px; border-bottom:1px solid var(--line)}
  .burger{display:block}
  .svc{grid-template-columns:40px 1fr; gap:14px}
  .svc-arrow{display:none}
}
a:focus-visible,button:focus-visible,summary:focus-visible,.leak-item:focus-visible{outline:2px solid var(--mint); outline-offset:3px}
@media (prefers-reduced-motion:reduce){*{animation:none!important; transition:none!important} html{scroll-behavior:auto}}

/* ===== inner page additions ===== */
.page-hero{padding:clamp(48px,7vw,88px) 0 clamp(32px,4vw,52px)}
.page-hero h1{font-size:clamp(34px,4.6vw,56px); max-width:20ch}
.page-hero p.sub{color:var(--dim); font-size:clamp(17px,1.5vw,19px); max-width:60ch; margin:0 0 30px}
.crumb{font-family:var(--mono); font-size:11.5px; letter-spacing:.11em; text-transform:uppercase; color:var(--dim); margin:0 0 20px}
.crumb a{text-decoration:none; color:var(--mint)}
.prose{max-width:74ch}
.prose h3{font-family:var(--display); font-weight:600; font-size:clamp(21px,2.2vw,27px); letter-spacing:-.018em; margin:44px 0 14px}
.prose h3:first-child{margin-top:0}
.prose p{color:var(--dim); margin:0 0 18px}
.prose ul{list-style:none; padding:0; margin:0 0 22px}
.prose li{color:var(--dim); padding:8px 0 8px 26px; position:relative; border-bottom:1px solid var(--line)}
.prose li::before{content:'—'; position:absolute; left:0; color:var(--mint); font-family:var(--mono)}
.prose strong{color:var(--paper); font-weight:500}
.two-col{display:grid; grid-template-columns:1fr 1fr; gap:clamp(28px,4vw,60px); align-items:start}
.side-card{background:var(--ink-2); border:1px solid var(--line-2); border-radius:3px; padding:28px 26px; position:sticky; top:100px}
.side-card h4{font-family:var(--display); font-weight:600; font-size:19px; margin:0 0 14px}
.side-card p{color:var(--dim); font-size:15px; margin:0 0 20px}
.side-card .amt{font-family:var(--mono); font-size:28px; color:var(--gold); margin:0 0 4px}
.side-card .lab{font-family:var(--mono); font-size:11px; letter-spacing:.11em; text-transform:uppercase; color:var(--dim); margin:0 0 22px}
.form{display:grid; gap:16px; max-width:560px}
.form label{font-family:var(--mono); font-size:11.5px; letter-spacing:.11em; text-transform:uppercase; color:var(--dim); display:block; margin-bottom:7px}
.form input,.form textarea,.form select{width:100%; background:var(--ink-2); border:1px solid var(--line-2); color:var(--paper);
  font-family:var(--body); font-size:16px; padding:13px 15px; border-radius:2px}
.form textarea{min-height:130px; resize:vertical}
.form input:focus,.form textarea:focus,.form select:focus{outline:none; border-color:var(--mint)}
.form button{background:var(--mint); color:var(--ink); border:0; font-family:var(--body); font-weight:600;
  font-size:16px; padding:15px 28px; border-radius:2px; cursor:pointer; justify-self:start}
.form button:hover{transform:translateY(-2px)}
.related{display:grid; grid-template-columns:repeat(3,1fr); gap:1px; background:var(--line); border:1px solid var(--line)}
.related a{background:var(--ink); padding:26px 24px; text-decoration:none; transition:background .2s}
.related a:hover{background:var(--ink-2)}
.related .mono-tag{display:block; margin-bottom:10px}
.related b{font-family:var(--display); font-weight:600; font-size:19px; letter-spacing:-.015em; display:block; margin-bottom:8px}
.related span.d{color:var(--dim); font-size:14.5px}
@media (max-width:900px){ .two-col{grid-template-columns:1fr} .side-card{position:static} .related{grid-template-columns:1fr} }

/* founder block */
.founder{background:var(--ink-2); border:1px solid var(--line-2); border-radius:3px; padding:34px 32px; margin:34px 0 10px}
.founder .role{font-family:var(--mono); font-size:11px; letter-spacing:.13em; text-transform:uppercase; color:var(--mint); margin:0 0 10px}
.founder h3{font-family:var(--display); font-weight:600; font-size:clamp(24px,2.8vw,32px); letter-spacing:-.02em; margin:0 0 6px}
.founder .tag{color:var(--dim); font-size:15.5px; margin:0 0 24px}
.cred{display:grid; grid-template-columns:repeat(2,1fr); gap:1px; background:var(--line); border:1px solid var(--line); margin:0 0 24px}
.cred div{background:var(--ink-2); padding:18px 20px}
.cred .n{font-family:var(--mono); font-size:26px; color:var(--gold); line-height:1.1}
.cred .l{font-size:14px; color:var(--dim); margin-top:6px; line-height:1.45}
@media (max-width:620px){ .cred{grid-template-columns:1fr} }
.copy-mail{cursor:pointer}
