/* leads.lapingroup.uk: B2B lead generation by Roy Lapin.
   Lapin Group look (white, Apple gray, near-black, one yellow spice), big bold type,
   dark cards for contrast, motion that reveals rather than decorates. */
.ld{--r:22px;--ease:cubic-bezier(.23,1,.32,1);background:var(--wash);color:var(--ink);padding:0 16px 72px;overflow-x:clip}
.ld *{box-sizing:border-box}
.sub{border-bottom:1px solid var(--rule);background:var(--ground)}
.sub .hw{max-width:1100px;margin:0 auto;padding:0 16px;display:flex;align-items:center;justify-content:space-between;gap:12px;min-height:54px;flex-wrap:wrap}
.sub .name{display:inline-flex;align-items:flex-end;gap:0;font-family:"Space Grotesk",system-ui,sans-serif;font-weight:700;font-size:17px;letter-spacing:-.02em;text-decoration:none;color:var(--ink)}
.sub nav{display:flex;gap:16px}
.sub nav a{font-size:14px;color:var(--muted);text-decoration:none;padding:10px 0}
.sub nav a:hover{color:var(--ink)}
.ld-dot,.ld-pill i{display:inline-block;width:8px;height:8px;border-radius:50%;background:var(--accent)}
.ld-dot{margin:0 0 5px 3px}
.draft-tag{font-family:"IBM Plex Mono",monospace;font-size:10px;background:#FFD166;color:#1D1D1F;border-radius:4px;padding:1px 6px}

/* hero */
.ld-hero{max-width:1100px;margin:0 auto;padding:56px 0 40px;text-align:center;display:grid;justify-items:center;gap:22px}
.ld-pill{display:inline-flex;align-items:center;gap:8px;background:var(--ink);color:var(--ground);font:500 13px "IBM Plex Mono",monospace;border-radius:999px;padding:7px 14px}
.ld-pill i{width:7px;height:7px;box-shadow:0 0 0 0 rgba(255,214,10,.7);animation:ldPulse 2s var(--ease) infinite}
@keyframes ldPulse{to{box-shadow:0 0 0 9px rgba(255,214,10,0)}}
.ld-h1{margin:0;font:700 clamp(40px,9.4vw,96px)/1.02 "Space Grotesk",sans-serif;letter-spacing:-.035em;max-width:15ch;color:var(--ink)}
.ld-h1 .w{display:inline-block;animation:ldWord .9s var(--ease) both}
.ld-h1 .w:nth-of-type(2){animation-delay:.06s}.ld-h1 .w:nth-of-type(3){animation-delay:.12s}.ld-h1 .w:nth-of-type(4){animation-delay:.18s}
.ld-h1 .w:nth-of-type(5){animation-delay:.3s}.ld-h1 .w:nth-of-type(6){animation-delay:.36s}.ld-h1 .w:nth-of-type(7){animation-delay:.48s}
@keyframes ldWord{from{opacity:0;filter:blur(10px);transform:translateY(14px)}to{opacity:1;filter:none;transform:none}}
.chip{display:inline-grid;place-items:center;vertical-align:middle;width:1.5em;height:.92em;border-radius:999px;overflow:hidden;margin:0 .06em;transform:translateY(-.06em);animation:ldChip .9s var(--ease) .25s both}
.chip-photo img{width:100%;height:100%;object-fit:cover;object-position:50% 25%}
.chip-cal{background:var(--accent);color:#1D1D1F;width:1.1em}
.chip-cal svg{width:.55em;height:.55em}
@keyframes ldChip{from{opacity:0;transform:translateY(-.06em) scale(.6) rotate(-8deg)}to{opacity:1;transform:translateY(-.06em) scale(1)}}
.ld-lede{max-width:56ch;font:400 clamp(17px,2.1vw,20px)/1.55 "IBM Plex Sans",sans-serif;color:var(--muted);margin:0}
.ld-ctas{display:flex;flex-wrap:wrap;gap:14px;align-items:center;justify-content:center}
.ld-btn{display:inline-flex;align-items:center;gap:8px;background:var(--ink);color:var(--ground);text-decoration:none;font:600 16px "IBM Plex Sans",sans-serif;border-radius:999px;padding:14px 22px;transition:transform .16s var(--ease),background .2s,color .2s}
.ld-btn:active{transform:scale(.97)}
@media (hover:hover) and (pointer:fine){.ld-btn:hover{background:var(--accent);color:#1D1D1F}}
.ld-btn.ghost{background:transparent;color:var(--ink);box-shadow:inset 0 0 0 1.5px var(--ink)}
.ld-link{color:var(--ink);font:600 15px "IBM Plex Sans",sans-serif}

/* marquee */
.ld-marquee{margin:8px -16px 0;overflow:hidden;border-block:1px solid var(--rule);background:var(--ground)}
.ld-track{display:flex;gap:44px;width:max-content;padding:16px 0;animation:ldMarq 28s linear infinite}
.ld-track span{font:500 15px "IBM Plex Mono",monospace;color:var(--muted);white-space:nowrap}
.ld-track span::before{content:"";display:inline-block;width:7px;height:7px;border-radius:50%;background:var(--accent);margin-right:12px;vertical-align:middle}
@keyframes ldMarq{to{transform:translateX(-50%)}}

/* statement that lights up word by word as you scroll */
.ld-say{max-width:980px;margin:0 auto;padding:88px 0 56px}
.ld-reveal{margin:0;font:700 clamp(26px,4.4vw,48px)/1.18 "Space Grotesk",sans-serif;letter-spacing:-.02em;text-align:center}
.ld-reveal span{color:color-mix(in srgb,var(--ink) 18%,transparent);transition:color .35s var(--ease)}
.ld-reveal span.on{color:var(--ink)}

/* proof */
.ld-proof{max-width:1100px;margin:0 auto;display:grid;gap:12px}
@media (min-width:760px){.ld-proof{grid-template-columns:repeat(4,1fr)}}
.ld-stat{background:var(--ground);border:1px solid var(--rule);border-radius:var(--r);padding:22px;display:grid;gap:10px;align-content:space-between;min-height:170px}
.ld-stat b{font:700 clamp(30px,3.4vw,42px)/1 "Space Grotesk",sans-serif;letter-spacing:-.03em}
.ld-stat span{color:var(--muted);font-size:15px;line-height:1.45}
.ld-stat.dark{background:#1D1D1F;border-color:#1D1D1F;color:#F5F5F7}
.ld-stat.dark span{color:#A1A1A6}
.ld-stat.dark b{color:var(--accent)}

/* sections */
.ld-sec{max-width:1100px;margin:0 auto;padding:84px 0 0;display:grid;gap:18px}
.ld-kicker{font:500 13px "IBM Plex Mono",monospace;color:var(--muted)}
.ld-sec h2,.ld-end h2{margin:0;font:700 clamp(32px,5.4vw,60px)/1.02 "Space Grotesk",sans-serif;letter-spacing:-.03em}
.ld-sec h3{margin:0;font:700 21px/1.2 "Space Grotesk",sans-serif;letter-spacing:-.01em}
.ld-sec p{margin:0;color:var(--muted);line-height:1.55}

.ld-steps{display:grid;gap:12px;margin-top:8px}
@media (min-width:760px){.ld-steps{grid-template-columns:repeat(4,1fr)}}
.ld-step{background:#1D1D1F;color:#F5F5F7;border-radius:var(--r);padding:24px;display:grid;gap:12px;align-content:start;min-height:240px}
.ld-step .n{font:500 13px "IBM Plex Mono",monospace;color:var(--accent)}
.ld-step h3{color:#F5F5F7}
.ld-step p{color:#A1A1A6;font-size:15px}

.ld-services{display:grid;gap:12px;margin-top:8px}
@media (min-width:760px){.ld-services{grid-template-columns:1fr 1fr}}
.ld-svc{background:var(--ground);border:1px solid var(--rule);border-radius:var(--r);padding:24px;display:grid;gap:8px;transition:transform .3s var(--ease),border-color .3s}
.ld-svc.hot{border-color:var(--accent);box-shadow:inset 0 0 0 1px var(--accent)}
.ld-svc.hot h3::after{content:"Roy's specialty";margin-left:10px;font:500 11px "IBM Plex Mono",monospace;background:var(--accent);color:#1D1D1F;border-radius:999px;padding:2px 8px;vertical-align:middle}
@media (hover:hover) and (pointer:fine){.ld-svc:hover{transform:translateY(-3px)}}

.ld-about{grid-template-columns:1fr;align-items:center;gap:28px}
@media (min-width:860px){.ld-about{grid-template-columns:380px 1fr;gap:48px}}
.ld-roy{width:100%;height:auto;aspect-ratio:1;object-fit:cover;object-position:50% 20%;border-radius:28px}
.ld-about > div{display:grid;gap:14px}
.ld-timeline{list-style:none;margin:6px 0 0;padding:0;display:grid}
.ld-timeline li{display:grid;grid-template-columns:140px 1fr;gap:12px;padding:12px 0;border-top:1px solid var(--rule)}
.ld-timeline b{font:700 16px "Space Grotesk",sans-serif}
.ld-timeline span{color:var(--muted)}

.ld-tools{display:grid;gap:10px;margin-top:8px}
@media (min-width:760px){.ld-tools{grid-template-columns:repeat(5,1fr)}}
.ld-tool{background:var(--ground);border:1px solid var(--rule);border-radius:18px;padding:18px;display:grid;gap:6px}
.ld-tool b{font:700 18px "Space Grotesk",sans-serif}
.ld-tool span{color:var(--muted);font-size:14px;line-height:1.45}

.ld-plans{display:grid;gap:12px;margin-top:8px}
@media (min-width:860px){.ld-plans{grid-template-columns:repeat(3,1fr)}}
.ld-plan{background:var(--ground);border:1px solid var(--rule);border-radius:var(--r);padding:26px;display:grid;gap:14px;align-content:start}
.ld-plan .price{font:500 14px "IBM Plex Mono",monospace;color:var(--ink)}
.ld-plan .ld-btn{justify-self:start}
.ld-plan.dark{background:#1D1D1F;border-color:#1D1D1F;color:#F5F5F7}
.ld-plan.dark h3,.ld-plan.dark .price{color:#F5F5F7}
.ld-plan.dark p{color:#A1A1A6}
.ld-plan.dark .ld-btn{background:var(--accent);color:#1D1D1F}

.ld-faq{display:grid;margin-top:8px;border-top:1px solid var(--rule)}
.ld-faq details{border-bottom:1px solid var(--rule)}
.ld-faq summary{cursor:pointer;list-style:none;display:flex;justify-content:space-between;gap:16px;padding:18px 2px;font:600 18px "Space Grotesk",sans-serif}
.ld-faq summary::-webkit-details-marker{display:none}
.ld-faq summary::after{content:"+";font-family:"IBM Plex Mono",monospace;color:var(--muted)}
.ld-faq details[open] summary::after{content:"-"}
.ld-faq details p{padding:0 2px 18px;max-width:70ch}

.ld-end{max-width:1100px;margin:84px auto 0;background:#1D1D1F;color:#F5F5F7;border-radius:28px;padding:48px 24px;text-align:center;display:grid;justify-items:center;gap:16px}
.ld-end h2{color:#F5F5F7}
.ld-end p{margin:0;color:#A1A1A6}
.ld-end .ld-btn{background:var(--accent);color:#1D1D1F}

/* scroll reveal for cards */
.ld-in{opacity:0;transform:translateY(18px);transition:opacity .7s var(--ease),transform .7s var(--ease)}
.ld-in.seen{opacity:1;transform:none}

[data-theme="dark"] .ld-stat.dark,[data-theme="dark"] .ld-step,[data-theme="dark"] .ld-plan.dark,[data-theme="dark"] .ld-end{background:#2C2C2E;border-color:#3A3A3C}

@media (prefers-reduced-motion: reduce){
  .ld-h1 .w,.chip{animation:none}
  .ld-track{animation:none}
  .ld-pill i{animation:none}
  .ld-in{opacity:1;transform:none;transition:none}
  .ld-reveal span{color:var(--ink)}
}

/* lg-site.css puts a rule and padding on every section; this page sets its own spacing */
.ld section{border-top:0}
.ld-hero{padding:56px 0 40px}
.ld-say{padding:88px 0 56px}
.ld-proof{padding:0}
.ld-sec{padding:84px 0 0}
.ld-end{padding:48px 24px}

/* packages */
.ld-plan .price{font:500 14px "IBM Plex Mono",monospace;color:var(--muted)}
.ld-plan .price b{display:block;font:700 40px/1 "Space Grotesk",sans-serif;letter-spacing:-.03em;color:var(--ink);margin-bottom:6px}
.ld-plan.dark .price{color:#A1A1A6}
.ld-plan.dark .price b{color:#F5F5F7}
.ld-plan{position:relative}
.ld-tagline{position:absolute;top:18px;right:18px;font:500 11px "IBM Plex Mono",monospace;background:var(--accent);color:#1D1D1F;border-radius:999px;padding:3px 9px}
.ld-incl{list-style:none;margin:0;padding:0;display:grid;gap:8px}
.ld-incl li{position:relative;padding-left:22px;font-size:14.5px;line-height:1.45;color:var(--muted)}
.ld-incl li::before{content:"";position:absolute;left:3px;top:.5em;width:8px;height:8px;border-radius:50%;background:var(--accent)}
.ld-plan.dark .ld-incl li{color:#C7C7CC}
.ld-note{max-width:70ch;font-size:14px}

/* the low-price market check, above the three packages */
.ld-intro{display:grid;gap:18px;background:var(--accent-soft);border:1px solid var(--accent);border-radius:var(--r);padding:24px;margin-top:8px}
@media (min-width:860px){.ld-intro{grid-template-columns:1fr 300px;align-items:center;gap:36px;padding:28px 32px}}
.ld-intro > div:first-child{display:grid;gap:10px}
.ld-intro .ld-tagline.static{position:static;justify-self:start}
.ld-intro p{color:var(--ink);opacity:.8}
.ld-intro-buy{display:grid;gap:10px;justify-items:start}
.ld-intro-buy .price{font:500 14px "IBM Plex Mono",monospace;color:var(--muted)}
.ld-intro-buy .price b{display:block;font:700 40px/1 "Space Grotesk",sans-serif;letter-spacing:-.03em;color:var(--ink);margin-bottom:6px}
.ld-credit{font-size:14px;color:var(--ink)}
[data-theme="dark"] .ld-intro{background:#2A2610;border-color:#5C4F0A}
