/* ============================================================
   LEADSIRE DESIGN SYSTEM — shared across all pages
   Palette: Ink #101720 · Bone #F5F6F2 · Marigold #F2A33C
   Type: Bricolage Grotesque (display) · Instrument Sans (body) · IBM Plex Mono (labels)
   ============================================================ */
:root{
  --ink:#101720;--ink-2:#18212e;--bone:#F5F6F2;--white:#FFFFFF;
  --marigold:#F2A33C;--marigold-deep:#D98718;--gold-btn:#B4690F;--gold-btn-hover:#9E5C0C;--signal:#5FA8FF;--grow:#3ECF8E;
  --text-dark:#1E2733;--text-mute:#5B6878;--text-on-ink:#E8EDF4;--text-on-ink-mute:#9AA7B8;
  --line-dark:#26313f;--line-light:#DFE3DA;
  --radius:14px;--max:1180px;
  --display:'Bricolage Grotesque',sans-serif;
  --body:'Instrument Sans',sans-serif;
  --mono:'IBM Plex Mono',monospace;
}
*{margin:0;padding:0;box-sizing:border-box}
html{scroll-behavior:smooth}
body{font-family:var(--body);color:var(--text-dark);background:var(--bone);line-height:1.6;font-size:16.5px}
img{max-width:100%;display:block}
a{color:inherit;text-decoration:none}
.wrap{max-width:var(--max);margin:0 auto;padding:0 24px}
section{padding:88px 0}
h1,h2,h3{font-family:var(--display);line-height:1.08;letter-spacing:-0.015em}
h2{font-size:clamp(1.9rem,3.4vw,2.7rem);font-weight:700}
h3{font-size:1.16rem;font-weight:600;line-height:1.3}
.eyebrow{font-family:var(--mono);font-size:.74rem;letter-spacing:.14em;text-transform:uppercase;color:var(--marigold-deep);display:block;margin-bottom:14px}
.dark .eyebrow{color:var(--marigold)}
.lede{font-size:1.12rem;color:var(--text-mute);max-width:640px;margin-top:16px}
.dark{background:var(--ink);color:var(--text-on-ink)}
.dark .lede{color:var(--text-on-ink-mute)}
.dark h2{color:var(--white)}

/* Buttons */
.btn{display:inline-flex;align-items:center;gap:9px;font-weight:600;font-size:.98rem;padding:14px 26px;border-radius:999px;transition:transform .15s ease,box-shadow .15s ease;cursor:pointer;border:0;font-family:var(--body)}
.btn:hover{transform:translateY(-2px)}
.btn-gold{background:var(--gold-btn);color:#fff;box-shadow:0 6px 20px rgba(180,105,15,.32)}
.btn-gold:hover{background:var(--gold-btn-hover);color:#fff;box-shadow:0 10px 26px rgba(180,105,15,.45)}
.btn-ghost{border:1.5px solid var(--line-dark);color:var(--text-on-ink)}
.btn-ghost-light{border:1.5px solid var(--text-dark);color:var(--text-dark)}
.btn-wa{background:#0f3b2a;color:#8FF0C4;border:1px solid #1d5c43}

/* Header */
header{position:sticky;top:0;z-index:60;background:rgba(16,23,32,.9);backdrop-filter:blur(12px);border-bottom:1px solid var(--line-dark)}
.nav{display:flex;align-items:center;justify-content:space-between;height:72px}
.logo{font-family:var(--display);font-weight:800;font-size:1.42rem;color:var(--white);letter-spacing:-.02em}
.logo span{color:var(--marigold)}
.nav-links{display:flex;gap:30px;align-items:center}
.nav-links a{color:var(--text-on-ink-mute);font-size:.94rem;font-weight:500;transition:color .15s}
.nav-links a:hover{color:var(--white)}
.nav .btn{padding:10px 20px;font-size:.9rem}
.nav-links a.btn-gold{color:#fff}
.nav-links a.btn-gold:hover{color:#fff}
@media(max-width:860px){.nav-links a:not(.btn){display:none}}

/* Homepage hero */
.hero{padding:96px 0 110px;position:relative;overflow:hidden}
.hero .wrap{display:grid;grid-template-columns:1.05fr .95fr;gap:64px;align-items:center}
.hero h1{font-size:clamp(2.5rem,5vw,3.9rem);font-weight:800;color:var(--white)}
.hero h1 em{font-style:normal;color:var(--marigold)}
.hero p.sub{margin:22px 0 34px;font-size:1.13rem;color:var(--text-on-ink-mute);max-width:520px}
.hero-ctas{display:flex;gap:14px;flex-wrap:wrap}
.hero-note{margin-top:22px;font-family:var(--mono);font-size:.78rem;color:var(--text-on-ink-mute);letter-spacing:.04em}
.hero-note b{color:var(--grow);font-weight:500}

/* Inner page hero */
.page-hero{padding:80px 0 72px}
.page-hero h1{font-size:clamp(2.2rem,4.2vw,3.2rem);font-weight:800;color:var(--white);max-width:820px}
.page-hero h1 em{font-style:normal;color:var(--marigold)}
.page-hero p.sub{margin:20px 0 32px;font-size:1.1rem;color:var(--text-on-ink-mute);max-width:640px}

/* Sequence rail (homepage signature) */
.rail{position:relative;padding-left:26px}
.rail::before{content:"";position:absolute;left:7px;top:8px;bottom:8px;width:2px;background:linear-gradient(180deg,var(--signal),var(--marigold) 55%,var(--grow));opacity:.55;border-radius:2px}
.rail-item{position:relative;background:var(--ink-2);border:1px solid var(--line-dark);border-radius:var(--radius);padding:18px 20px;margin-bottom:16px;opacity:0;transform:translateY(14px);animation:railIn .6s ease forwards}
.rail-item::before{content:"";position:absolute;left:-26px;top:24px;width:14px;height:14px;border-radius:50%;background:var(--ink);border:3px solid var(--signal)}
.rail-item:nth-child(2){animation-delay:.5s}
.rail-item:nth-child(3){animation-delay:1s}
.rail-item:nth-child(3)::before{border-color:var(--marigold)}
.rail-item:nth-child(4){animation-delay:1.5s}
.rail-item:nth-child(4)::before{border-color:var(--grow)}
@keyframes railIn{to{opacity:1;transform:translateY(0)}}
@media(prefers-reduced-motion:reduce){.rail-item{animation:none;opacity:1;transform:none}}
.tag{font-family:var(--mono);font-size:.68rem;letter-spacing:.12em;text-transform:uppercase;padding:4px 10px;border-radius:6px;display:inline-block;margin-bottom:9px}
.tag-signal{background:rgba(95,168,255,.12);color:var(--signal)}
.tag-li,.tag-reply{background:rgba(242,163,60,.12);color:var(--marigold)}
.tag-booked{background:rgba(62,207,142,.12);color:var(--grow)}
.rail-item p{font-size:.92rem;color:var(--text-on-ink);line-height:1.5}
.rail-item p.meta{font-family:var(--mono);font-size:.72rem;color:var(--text-on-ink-mute);margin-top:8px}

/* Trust strip */
.strip{border-top:1px solid var(--line-dark);border-bottom:1px solid var(--line-dark);background:var(--ink-2);padding:20px 0}
.strip .wrap{display:flex;justify-content:space-between;gap:18px;flex-wrap:wrap}
.strip span{font-family:var(--mono);font-size:.78rem;letter-spacing:.05em;color:var(--text-on-ink-mute)}
.strip b{color:var(--marigold);font-weight:500}

/* Service cards */
.svc-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:22px;margin-top:48px}
.svc{background:var(--white);border:1px solid var(--line-light);border-radius:var(--radius);padding:30px 28px;transition:transform .18s ease,box-shadow .18s ease}
.svc:hover{transform:translateY(-4px);box-shadow:0 16px 34px rgba(16,23,32,.09)}
.svc .ico{width:44px;height:44px;border-radius:11px;background:var(--ink);color:var(--marigold);display:flex;align-items:center;justify-content:center;font-family:var(--mono);font-size:.8rem;margin-bottom:18px}
.svc h3{margin-bottom:10px}
.svc p{font-size:.95rem;color:var(--text-mute)}
.svc a{display:inline-block;margin-top:16px;font-weight:600;font-size:.92rem;color:var(--marigold-deep)}
.svc a:hover{text-decoration:underline}
.svc-mini{display:flex;gap:14px;margin-top:26px;flex-wrap:wrap}
.svc-mini a{font-family:var(--mono);font-size:.78rem;letter-spacing:.03em;border:1px solid var(--line-light);background:var(--white);padding:9px 16px;border-radius:999px;color:var(--text-mute);transition:border-color .15s,color .15s}
.svc-mini a:hover{border-color:var(--marigold);color:var(--marigold-deep)}
@media(max-width:900px){.svc-grid{grid-template-columns:1fr}}

/* Numbered steps */
.steps{display:grid;grid-template-columns:repeat(3,1fr);gap:22px;margin-top:48px;counter-reset:step}
.steps.two{grid-template-columns:repeat(2,1fr)}
.step{background:var(--ink-2);border:1px solid var(--line-dark);border-radius:var(--radius);padding:28px 26px;counter-increment:step}
.step::before{content:counter(step,decimal-leading-zero);font-family:var(--mono);color:var(--marigold);font-size:.82rem;letter-spacing:.1em;display:block;margin-bottom:14px}
.step h3{color:var(--white);margin-bottom:9px}
.step p{font-size:.93rem;color:var(--text-on-ink-mute)}
@media(max-width:900px){.steps,.steps.two{grid-template-columns:1fr}}

/* Included list (light sections) */
.inc-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:20px;margin-top:44px}
.inc{background:var(--white);border:1px solid var(--line-light);border-radius:var(--radius);padding:24px 26px}
.inc h3{margin-bottom:8px;font-size:1.05rem}
.inc h3::before{content:"— ";color:var(--marigold-deep)}
.inc p{font-size:.94rem;color:var(--text-mute)}
@media(max-width:800px){.inc-grid{grid-template-columns:1fr}}

/* Prose block (long-form sections) */
.prose{max-width:780px;margin-top:36px}
.prose p{margin-bottom:18px;color:var(--text-mute);font-size:1.02rem}
.prose strong{color:var(--text-dark)}
.dark .prose p{color:var(--text-on-ink-mute)}
.dark .prose strong{color:var(--text-on-ink)}

/* Comparison table */
.cmp{margin-top:48px;overflow-x:auto}
table{width:100%;border-collapse:collapse;background:var(--white);border-radius:var(--radius);overflow:hidden;border:1px solid var(--line-light)}
th,td{padding:16px 20px;text-align:left;font-size:.93rem;border-bottom:1px solid var(--line-light)}
thead th{font-family:var(--mono);font-size:.72rem;letter-spacing:.1em;text-transform:uppercase;color:var(--text-mute);background:var(--bone)}
th.lead-col,td.lead-col{background:rgba(242,163,60,.08);font-weight:600}
tbody tr:last-child td{border-bottom:0}
td .yes{color:#1c7c4e;font-weight:600}
td .no{color:#b04a3a}

/* Pricing */
.plans{display:grid;grid-template-columns:repeat(3,1fr);gap:22px;margin-top:48px}
.plan{background:var(--white);border:1px solid var(--line-light);border-radius:var(--radius);padding:32px 28px;display:flex;flex-direction:column}
.plan.hot{border:2px solid var(--marigold);position:relative;box-shadow:0 18px 44px rgba(242,163,60,.16)}
.plan.hot::after{content:"RECOMMENDED";position:absolute;top:-12px;left:26px;background:var(--marigold);color:#221503;font-family:var(--mono);font-size:.66rem;letter-spacing:.12em;padding:5px 12px;border-radius:999px;font-weight:500}
.plan h3{margin-bottom:6px}
.plan .price{font-family:var(--display);font-size:1.9rem;font-weight:700;margin:10px 0 2px}
.plan .price small{font-family:var(--body);font-size:.85rem;color:var(--text-mute);font-weight:400}
.plan ul{list-style:none;margin:20px 0 26px;flex:1}
.plan li{font-size:.92rem;color:var(--text-mute);padding:7px 0 7px 26px;position:relative}
.plan li::before{content:"—";position:absolute;left:0;color:var(--marigold-deep)}
.founding{margin-top:34px;background:var(--ink);color:var(--text-on-ink);border-radius:var(--radius);padding:28px 32px;display:flex;gap:24px;align-items:center;justify-content:space-between;flex-wrap:wrap}
.founding p{max-width:640px;font-size:.97rem}
.founding b{color:var(--marigold)}
@media(max-width:900px){.plans{grid-template-columns:1fr}}

/* Founder quote (no photo) */
.founder-quote{max-width:860px;margin:48px auto 0;text-align:center}
.founder-quote blockquote{font-family:var(--display);font-size:clamp(1.3rem,2.6vw,1.7rem);font-weight:600;line-height:1.4;color:var(--white)}
.founder-quote blockquote::before{content:"“";color:var(--marigold);font-size:1.4em}
.founder-quote .who{margin-top:20px;font-size:.92rem;color:var(--text-on-ink-mute)}
.founder-quote .who a{color:var(--signal)}

/* FAQ */
.faq{max-width:820px;margin:48px auto 0}
details{background:var(--white);border:1px solid var(--line-light);border-radius:var(--radius);margin-bottom:12px;overflow:hidden}
summary{cursor:pointer;padding:20px 24px;font-weight:600;font-size:1.02rem;list-style:none;display:flex;justify-content:space-between;align-items:center;gap:16px}
summary::-webkit-details-marker{display:none}
summary::after{content:"+";font-family:var(--mono);color:var(--marigold-deep);font-size:1.2rem;transition:transform .2s}
details[open] summary::after{transform:rotate(45deg)}
details p{padding:0 24px 22px;color:var(--text-mute);font-size:.96rem}

/* Final CTA */
.final{text-align:center}
.final h2{font-size:clamp(2rem,4vw,3rem);color:var(--white);max-width:760px;margin:0 auto}
.final .lede{margin:18px auto 34px;text-align:center}
.final .hero-ctas{justify-content:center}

/* Forms */
.form-card{background:var(--white);border:1px solid var(--line-light);border-radius:var(--radius);padding:40px;max-width:720px;margin:48px auto 0}
.form-row{display:grid;grid-template-columns:1fr 1fr;gap:18px}
@media(max-width:640px){.form-row{grid-template-columns:1fr}}
label{display:block;font-weight:600;font-size:.9rem;margin:18px 0 7px}
input,textarea,select{width:100%;padding:13px 16px;border:1.5px solid var(--line-light);border-radius:10px;font-family:var(--body);font-size:.97rem;background:var(--bone);color:var(--text-dark)}
input:focus,textarea:focus,select:focus{outline:none;border-color:var(--marigold)}
.check-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:8px}
.check-grid label{display:flex;align-items:center;gap:10px;font-weight:500;margin:0;font-size:.92rem;cursor:pointer}
.check-grid input{width:18px;height:18px;padding:0;accent-color:var(--marigold-deep)}
.form-card .btn{margin-top:28px;width:100%;justify-content:center}
.form-note{font-family:var(--mono);font-size:.74rem;color:var(--text-mute);margin-top:16px;text-align:center;letter-spacing:.03em}

/* Footer */
footer{background:var(--ink);color:var(--text-on-ink-mute);border-top:1px solid var(--line-dark);padding:64px 0 36px;font-size:.9rem}
.foot-grid{display:grid;grid-template-columns:1.4fr 1fr 1fr 1fr;gap:40px;margin-bottom:44px}
.foot-grid h4{font-family:var(--mono);font-size:.72rem;letter-spacing:.14em;text-transform:uppercase;color:var(--text-on-ink);margin-bottom:16px}
.foot-grid a{display:block;padding:5px 0;transition:color .15s}
.foot-grid a:hover{color:var(--marigold)}
.foot-desc{max-width:340px;line-height:1.65;margin-top:14px}
.foot-bottom{border-top:1px solid var(--line-dark);padding-top:26px;display:flex;justify-content:space-between;gap:16px;flex-wrap:wrap;font-family:var(--mono);font-size:.74rem;letter-spacing:.04em}
@media(max-width:900px){.foot-grid{grid-template-columns:1fr 1fr}}

/* Floating WhatsApp */
.wa-float{position:fixed;right:22px;bottom:22px;z-index:70;width:56px;height:56px;border-radius:50%;background:#25D366;display:flex;align-items:center;justify-content:center;box-shadow:0 8px 24px rgba(0,0,0,.28);transition:transform .15s}
.wa-float:hover{transform:scale(1.08)}
.wa-float svg{width:30px;height:30px;fill:#fff}

a:focus-visible,button:focus-visible,summary:focus-visible{outline:3px solid var(--signal);outline-offset:2px;border-radius:6px}

@media(max-width:960px){
  .hero .wrap{grid-template-columns:1fr}
  .hero{padding:64px 0 80px}
  section{padding:64px 0}
}
