/* Draft D: editorial theme, Tiri.Tese colours */
:root{
  --paper:#FFFFFF; --paper-2:#EEF2FA; --surface:#FFFFFF; --field:#FFFFFF;
  --ink:#0A0A0A; --muted:#4B5563; --line:#CFD6E3;
  --action:#2563EB; --action-hover:#1D4ED8; --action-ink:#FFFFFF; --action-soft:#E3ECFD;
  --ok:#15803D; --ok-soft:#DCF3E4; --warn:#9A5B00; --warn-soft:#FDEFD2; --bad:#B42318; --bad-soft:#FDE4E1;
  --font-display:'Young Serif',Georgia,'Times New Roman',serif;
  --font-body:'Instrument Sans',system-ui,-apple-system,'Segoe UI',sans-serif;
  --radius:2px; --radius-lg:4px; --display-weight:400;
  --backdrop:rgba(10,10,10,.62); --modal-shadow:9px 9px 0 var(--ink);
}
*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
body{margin:0;background:var(--paper);color:var(--ink);font:400 1.0625rem/1.62 var(--font-body);-webkit-font-smoothing:antialiased}
img{max-width:100%;height:auto}
a{color:inherit}
h1,h2,h3,h4{font-family:var(--font-display);font-weight:400;margin:0}
p{margin:0 0 1em}
.wrap{max-width:1180px;margin-inline:auto;padding-inline:clamp(20px,5vw,56px)}
.skip{position:absolute;left:12px;top:-60px;background:var(--ink);color:#fff;padding:10px 14px;z-index:100;transition:top .15s}
.skip:focus{top:12px}
:focus-visible{outline:3px solid var(--ink);outline-offset:3px}

/* header */
.top{position:sticky;top:0;z-index:20;background:#fff;border-bottom:1px solid var(--ink)}
.top-in{display:grid;grid-template-columns:auto minmax(0,1fr) auto;grid-template-areas:"logo nav cta";align-items:center;gap:8px 32px;padding-block:12px}
.logo{grid-area:logo;display:flex;align-items:center;gap:10px;text-decoration:none}
.logo b{font-family:var(--font-display);font-weight:400;font-size:1.45rem;letter-spacing:-.01em}
.logo span{font-size:.7rem;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:var(--action);border:1px solid var(--action);padding:2px 7px}
.nav{grid-area:nav;display:flex;gap:22px;justify-content:center;white-space:nowrap;min-width:0}
.nav::-webkit-scrollbar{display:none}
.nav a{font-size:.95rem;font-weight:500;text-decoration:none;padding:6px 0;border-bottom:2px solid transparent;transition:border-color .18s}
.nav a:hover{border-bottom-color:var(--line)}
.nav a[aria-current="page"]{border-bottom-color:var(--action)}
.top-cta{grid-area:cta;display:flex;align-items:center;gap:20px}
.phone{font-weight:600;text-decoration:none;white-space:nowrap}
.phone:hover{text-decoration:underline;text-underline-offset:3px}
@media (max-width:1240px){
  .nav{overflow-x:auto;scrollbar-width:none}
  .top-in{grid-template-columns:1fr auto;grid-template-areas:"logo cta" "nav nav"}
  .nav{justify-content:flex-start;margin-inline:-4px;padding-bottom:2px}
  .phone{display:none}
}

/* buttons */
.btn{display:inline-block;padding:12px 20px;background:var(--action);color:var(--action-ink);border:1px solid var(--action);border-radius:var(--radius);font:inherit;font-weight:700;text-decoration:none;cursor:pointer;transition:transform .18s ease,box-shadow .18s ease,background-color .18s}
.btn:hover{background:var(--action-hover);transform:translate(-2px,-2px);box-shadow:3px 3px 0 var(--ink)}
.btn:active{transform:none;box-shadow:none}
.btn-lg{padding:16px 26px;font-size:1.05rem}
.tel-link{font-weight:600;text-underline-offset:4px}
.cta-row{display:flex;flex-wrap:wrap;align-items:center;gap:14px 24px;margin:0 0 18px}

/* hero */
.hero{display:grid;grid-template-columns:minmax(0,1.3fr) minmax(0,.85fr);gap:clamp(36px,6vw,88px);align-items:center;padding-block:clamp(44px,8vw,92px) clamp(44px,6vw,76px)}
.kicker{display:flex;align-items:center;gap:12px;margin:0 0 20px;font-size:.8rem;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:var(--muted)}
.kicker::before{content:"";flex:none;width:30px;height:2px;background:var(--action)}
h1{font-size:clamp(2.15rem,5vw,4.05rem);line-height:1.04;letter-spacing:-.02em;margin-bottom:24px;text-wrap:balance}
.lede{font-size:clamp(1.08rem,1.6vw,1.28rem);line-height:1.5;max-width:46ch;margin-bottom:30px}
.call-line{font-size:.95rem;color:var(--muted);max-width:52ch;margin:0}
.hero-side{min-width:0;padding:6px 10px 14px 4px}
@media (max-width:900px){.hero{grid-template-columns:1fr}}


/* sections */
.sec{padding-block:clamp(60px,9vw,112px)}
.grid-2{display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.4fr);gap:clamp(32px,6vw,92px);align-items:start}
.sec-head{position:static}
.sec-head-wide{position:static;max-width:60ch;margin-bottom:8px}
h2{font-size:clamp(1.75rem,3.3vw,2.75rem);line-height:1.1;letter-spacing:-.015em;margin:10px 0 16px;text-wrap:balance}
.intro{color:var(--muted);max-width:48ch;margin:0}
@media (max-width:900px){.grid-2{grid-template-columns:1fr}}


.example-box{display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.3fr);gap:clamp(24px,5vw,64px);background:var(--surface);border:1px solid var(--ink);border-left:10px solid var(--action);padding:clamp(24px,4vw,52px)}
.example-box h2{margin-bottom:0}
.example-text p{max-width:60ch}
.sources{font-size:.88rem;color:var(--muted)}
@media (max-width:860px){.example-box{grid-template-columns:1fr}}

/* sign-off band */
.signoff{background:var(--ink);color:#fff;padding-block:clamp(60px,9vw,108px)}
.signoff h2{color:#fff;margin-top:22px;max-width:18ch}
.signoff-body p{color:#D5DBE7;max-width:56ch}
.signoff-body p:first-child{font-size:1.22rem;line-height:1.5;color:#fff}
.stamp{display:inline-block;border:2px solid #6FD39A;color:#6FD39A;padding:8px 14px;font-size:.78rem;font-weight:700;letter-spacing:.16em;text-transform:uppercase;line-height:1.35;transform:rotate(-4deg)}
.js .stamp:not(.in){opacity:0}
.stamp.in{animation:stamp .55s cubic-bezier(.2,1.5,.4,1) both}
@keyframes stamp{from{opacity:0;transform:scale(1.7) rotate(-12deg)}to{opacity:1;transform:rotate(-4deg)}}


/* trust */
.trust{background:var(--paper-2);border-top:1px solid var(--ink)}
.trust-in{padding-block:30px;display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.4fr);gap:20px clamp(32px,6vw,92px);align-items:center}
.trust-lead{margin:0;font-family:var(--font-display);font-size:1.15rem;line-height:1.35}
.trust ul{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:6px 22px;font-size:.92rem}
.trust li{display:flex;align-items:center;gap:8px}
.trust li::before{content:"";flex:none;width:6px;height:6px;background:var(--action)}
@media (max-width:900px){.trust-in{grid-template-columns:1fr}}

/* cta */
.cta{border-top:1px solid var(--ink)}
.cta-in{display:grid;grid-template-columns:minmax(0,1.3fr) minmax(0,1fr);gap:clamp(28px,6vw,80px);align-items:end;padding-block:clamp(64px,10vw,124px)}
.cta h2{font-size:clamp(2rem,4.8vw,3.9rem);line-height:1.04;margin:0;max-width:16ch}
.cta p{max-width:44ch;margin-bottom:22px}
@media (max-width:860px){.cta-in{grid-template-columns:1fr}}

/* footer */
.foot{background:var(--ink);color:#C4CAD6}
.foot a{color:#FFFFFF;text-underline-offset:3px}
.foot :focus-visible{outline-color:#FFFFFF}
.foot-grid{display:grid;grid-template-columns:1.4fr 1fr 1fr;gap:36px;padding-block:56px 36px}
.foot-grid>div:empty{display:none}
.logo-foot{color:#fff;display:inline-block;margin-bottom:12px}
.logo-foot span{color:#7FA8FF;border-color:#7FA8FF}
.foot-line{max-width:38ch;margin:0;font-size:.95rem}
.foot-h{font-family:var(--font-body);font-size:.76rem;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:#9AA3B5;margin:0 0 12px}
.foot-list{list-style:none;margin:0;padding:0;display:grid;gap:7px;font-size:.96rem}
.belt{display:flex;flex-wrap:wrap;align-items:center;gap:18px 28px;padding-block:24px;border-top:1px solid #2C3340}
.badges{display:flex;gap:12px;align-items:center}
.badges img{height:56px;width:auto;background:#fff;padding:5px 9px;border-radius:2px}
.belt-text{margin:0;font-size:.85rem;color:#9AA3B5;max-width:60ch}
.legal{display:flex;flex-wrap:wrap;justify-content:space-between;gap:8px 24px;padding-block:20px 36px;border-top:1px solid #2C3340;font-size:.84rem;color:#9AA3B5}
.legal p{margin:0}
@media (max-width:760px){.foot-grid{grid-template-columns:1fr}}

/* specimens: the real artefact, drawn in HTML, never a stock photo */
.spec{margin:0;background:var(--surface);border:1px solid var(--ink);padding:20px 22px 18px;box-shadow:8px 8px 0 var(--ink);transform:rotate(-.8deg);font-size:.95rem;line-height:1.45}
.js .hero .spec{animation:settle .7s cubic-bezier(.2,.8,.2,1) both}
@keyframes settle{from{opacity:0;transform:translateY(18px) rotate(1.6deg)}to{opacity:1;transform:rotate(-.8deg)}}
.spec-head{display:flex;justify-content:space-between;align-items:center;gap:12px;padding-bottom:12px;margin-bottom:10px;border-bottom:1px solid var(--ink)}
.spec-head b{font-family:var(--font-display);font-weight:400;font-size:1.08rem}
.spec-tag{font-size:.68rem;font-weight:700;letter-spacing:.14em;text-transform:uppercase;border:1px solid var(--muted);color:var(--muted);padding:2px 7px;white-space:nowrap}
.spec-table{width:100%;border-collapse:collapse}
.spec-table th{text-align:left;font-size:.7rem;letter-spacing:.12em;text-transform:uppercase;color:var(--muted);font-weight:700;padding:4px 0}
.spec-table td{padding:9px 0;border-top:1px dotted var(--line)}
.spec-row{display:flex;justify-content:space-between;align-items:center;gap:12px;padding:10px 0;border-top:1px dotted var(--line)}
.spec-head+.spec-row{border-top:0}
.spec-meta{margin:0 0 12px}
.spec-meta div{display:grid;grid-template-columns:64px 1fr;gap:10px;padding:5px 0}
.spec-meta dt{color:var(--muted);font-size:.82rem}
.spec-meta dd{margin:0}
.spec-body{margin:0 0 14px;padding-left:12px;border-left:3px solid var(--line)}
.spec-actions{display:flex;gap:10px}
.fake{display:inline-block;padding:7px 13px;border:1px solid var(--ink);font-size:.85rem;font-weight:600}
.fake.primary{background:var(--action);border-color:var(--action);color:#fff}
.bubble{margin:4px 0 10px;padding:12px 14px;max-width:92%;background:var(--paper-2);border-radius:14px 14px 14px 2px}
.spec-sep{display:flex;align-items:center;gap:10px;margin:10px 0;font-size:.78rem;color:var(--muted)}
.spec-sep::before,.spec-sep::after{content:"";flex:1;height:1px;background:var(--line)}
.spec-cap{margin-top:14px;padding-top:10px;border-top:1px solid var(--line);font-size:.78rem;color:var(--muted)}
.pill{display:inline-block;padding:2px 9px;font-size:.76rem;font-weight:700;border-radius:2px;white-space:nowrap}
.pill.ok{background:var(--ok-soft);color:var(--ok)}
.pill.warn{background:var(--warn-soft);color:var(--warn)}
.pill.bad{background:var(--bad-soft);color:var(--bad)}
.offer .offer-h{font-family:var(--font-display);font-size:1.5rem;line-height:1.15;margin:0 0 10px}
.offer p{margin-bottom:16px}


/* in practice: B's panel, in A's ink-and-shadow language */
.bench{background:var(--paper-2);border-block:1px solid var(--ink)}
.bench-in{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:clamp(32px,6vw,88px);align-items:center;padding-block:clamp(44px,7vw,84px)}
.bench-p{font-family:var(--font-display);font-size:clamp(1.3rem,2.3vw,1.85rem);line-height:1.28;max-width:32ch;margin:0;text-wrap:balance}
.flow{list-style:none;margin:0;padding:0;display:grid;gap:14px}
.flow li{position:relative;display:grid;grid-template-columns:36px 1fr;gap:14px;align-items:center;padding:15px 18px;background:#fff;border:1px solid var(--ink)}
.flow li+li::before{content:"";position:absolute;left:35px;top:-15px;height:15px;width:2px;background:var(--ink)}
.flow-n{display:grid;place-items:center;width:34px;height:34px;background:var(--paper-2);border:1px solid var(--ink);font-family:var(--font-display)}
.flow li em{grid-column:2;font-style:normal;font-size:.72rem;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:var(--ok)}
.flow-human{background:var(--ok-soft)!important;box-shadow:5px 5px 0 var(--ok)}
.flow-human .flow-n{background:var(--ok);border-color:var(--ok);color:#fff}
@media (max-width:860px){.bench-in{grid-template-columns:1fr}}

/* leak ledger (B's menu) */
.sec,.hero{scroll-margin-top:84px}
.ledger-row>*,.leader>*,.timeline li>*,.flow li>*{min-width:0;overflow-wrap:break-word}
.ledger-table{margin-top:40px;border-top:2px solid var(--ink)}
.ledger-head,.ledger-row{display:grid;grid-template-columns:120px minmax(0,.95fr) minmax(0,1.3fr);gap:8px clamp(20px,4vw,56px)}
.ledger-head{padding:12px 16px;font-size:.72rem;font-weight:700;text-transform:uppercase;letter-spacing:.14em;color:var(--muted);border-bottom:1px solid var(--ink)}
.ledger-row{padding:28px 16px;border-bottom:1px solid var(--ink);border-left:4px solid transparent;transition:background-color .18s,border-color .18s}
.ledger-row:hover{background:var(--paper-2);border-left-color:var(--action)}
.tag{margin:6px 0 0;font-size:.74rem;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:var(--warn)}
.ledger-row h3{font-size:clamp(1.25rem,2vw,1.55rem);line-height:1.15}
.ledger-row p{margin:0;color:var(--muted);max-width:56ch}
.leaks-close{margin:34px 0 0;font-family:var(--font-display);font-size:1.4rem;line-height:1.35;max-width:34ch}
@media (max-width:1000px){.ledger-head{display:none}.ledger-row{grid-template-columns:1fr;padding:24px 8px;gap:6px}.ledger-row .tag{margin:0}}

/* how it works: B's timeline that fills on scroll */
.timeline{--p:0;position:relative;list-style:none;margin:0;padding:0}
.timeline::before,.timeline::after{content:"";position:absolute;left:23px;top:8px;width:3px;background:var(--line)}
.timeline::before{bottom:8px}
.timeline::after{background:var(--action);height:calc((100% - 16px) * var(--p));transition:height .12s linear}
.timeline li{position:relative;display:grid;grid-template-columns:48px 1fr;gap:24px;padding-bottom:44px}
.timeline li:last-child{padding-bottom:0}
.t-n{position:relative;z-index:1;display:grid;place-items:center;width:48px;height:36px;background:#fff;border:1px solid var(--ink);font-family:var(--font-display);color:var(--action)}
.timeline h3{font-size:1.45rem;line-height:1.2;margin:8px 0 10px}
.timeline p{margin:0;color:var(--muted);max-width:54ch}
.chip{display:inline-block;padding:3px 9px;background:var(--ok-soft);color:var(--ok);font-size:.74rem;font-weight:700;letter-spacing:.1em;text-transform:uppercase}
.chip-paid{background:var(--warn-soft);color:var(--warn)}
.after{margin:44px 0 0 72px;padding-left:20px;border-left:4px solid var(--action);max-width:60ch}
@media (max-width:560px){.after{margin-left:0}}

.why{background:var(--paper-2);border-block:1px solid var(--ink)}
.why-1{font-family:var(--font-display);font-size:clamp(1.6rem,3.2vw,2.5rem);line-height:1.15;letter-spacing:-.01em;max-width:24ch}
.why-2{max-width:54ch;color:var(--muted);font-size:1.1rem}
.where-p{font-size:1.2rem;line-height:1.55;max-width:52ch;margin:0}
.grid-2>.sec-head{position:static}
@media (max-width:900px){.grid-2>.sec-head{position:static}}

/* sector directory */
.dir{list-style:none;margin:36px 0 0;padding:0;border-top:2px solid var(--ink)}
.dir li{border-bottom:1px solid var(--ink)}
.dir a{display:grid;grid-template-columns:44px minmax(0,1fr);gap:2px 16px;padding:22px 8px;text-decoration:none;transition:background-color .18s}
.dir a:hover{background:var(--paper-2)}
.dir-n{grid-row:1/3;padding-top:.8em;font-size:.82rem;font-weight:700;color:var(--action)}
.dir-name{font-family:var(--font-display);font-size:clamp(1.5rem,3vw,2.3rem);line-height:1.1;transition:color .15s,transform .2s}
.dir-line{color:var(--muted)}
.dir a:hover .dir-name{color:var(--action);transform:translateX(8px)}

/* example block */
.label{display:block;margin:0 0 6px;font-size:.76rem;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:var(--action)}
.example-box{display:block!important;background:var(--surface);border:1px solid var(--ink);border-left:10px solid var(--action);padding:clamp(24px,4vw,52px)}
.example-box h2{max-width:22ch}
.example-text{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:0 clamp(28px,5vw,64px);margin-top:14px}
.example-text p{color:var(--muted);margin:0 0 1em}
.sources{grid-column:1/-1;font-size:.85rem;line-height:1.7}
.sources a{display:inline-block;margin-right:6px;overflow-wrap:anywhere}
@media (max-width:860px){.example-text{grid-template-columns:1fr}}

/* pricing: dotted-leader rate card */
.rate-h{margin:0 0 4px;font-family:var(--font-body);font-size:.76rem;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:var(--action)}
.rate-h2{margin-top:56px}
.rate-intro{max-width:56ch;margin:8px 0;color:var(--muted)}
.rate{list-style:none;margin:0;padding:0}
.leader{display:grid;grid-template-columns:auto 1fr auto;align-items:baseline;gap:0 12px;padding:20px 0;border-bottom:1px solid var(--line)}
.l-name{font-family:var(--font-display);font-size:1.4rem}
.l-dots{border-bottom:2px dotted #9AA3B5;transform:translateY(-.3em)}
.l-price{font-family:var(--font-display);font-size:1.8rem;color:var(--action);white-space:nowrap}
.l-note{grid-column:1/-1;margin:6px 0 0;color:var(--muted);max-width:56ch;font-size:.96rem}
.rate-small .leader{padding:14px 0}
.rate-small .l-name{font-size:1.15rem}
.rate-small .l-price{font-size:1.3rem}
.cta{background:var(--action);color:#fff;border-top:1px solid var(--ink)}
.cta h2{color:#fff}
.cta :focus-visible{outline-color:#fff}
.btn-light{background:#fff;border-color:#fff;color:var(--action)}
.btn-light:hover{background:#fff;border-color:#fff}
@media (prefers-reduced-motion:reduce){.timeline::after,.ledger-row,.dir-name{transition:none}}
@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  .btn,.sector-list a,.sector-go,.nav a{transition:none}
  .js .hero .spec,.stamp.in{animation:none}
  .js .stamp:not(.in){opacity:1}
}

/* legal pages */
.legal-top{grid-template-columns:1fr auto!important;grid-template-areas:"logo cta"!important}
.legal-top .logo{grid-area:logo}
.legal-back{grid-area:cta}
.legal-doc{max-width:760px;padding-block:clamp(40px,7vw,88px) clamp(64px,9vw,120px)}
.legal-doc h1{font-size:clamp(2rem,4.5vw,3.2rem);margin-bottom:12px}
.legal-doc .policy-meta{font-size:.85rem;color:var(--muted);margin-bottom:32px;padding-bottom:24px;border-bottom:1px solid var(--ink)}
.legal-doc h2{font-size:1.45rem;margin:40px 0 10px}
.legal-doc h3{font-family:var(--font-body);font-size:1rem;font-weight:700;margin:22px 0 8px}
.legal-doc p,.legal-doc li{max-width:68ch}
.legal-doc ul{padding-left:1.2em;margin:0 0 1em}
.legal-doc li{margin-bottom:.5em}
.legal-doc a{color:var(--action)}
.policy-contact{margin-top:48px;padding:22px 24px;background:var(--paper-2);border:1px solid var(--ink)}
.policy-contact p{margin:0 0 .3em}