/* Landing page (/) — from the AutoLeads landing design, incl. hero motion. */
html{scroll-behavior:smooth}
body{margin:0;background:#eef0f2;-webkit-font-smoothing:antialiased}
a{color:#e6d3ad}a:hover{color:#ffffff}
.wide{font-variation-settings:"wdth" 125}
.navlinks{position:relative}
.navlinks a{position:relative;z-index:1;color:#c4cad1;text-decoration:none;font-size:14px;font-weight:500;padding:9px 15px;border-radius:999px;transition:color .35s ease}
.navlinks a:hover{color:#ffffff}
.navlinks a.is-active{color:#e6d3ad}
.nav-ind{position:absolute;top:50%;height:36px;margin-top:-18px;border-radius:999px;background:rgba(184,154,99,.13);border:1px solid rgba(184,154,99,.5);box-shadow:inset 0 0 16px rgba(184,154,99,.16),0 0 22px rgba(184,154,99,.12);pointer-events:none;transition:left .55s cubic-bezier(.3,1.35,.45,1),width .55s cubic-bezier(.3,1.35,.45,1),opacity .35s ease}
.nav-ind::after{content:"";position:absolute;left:50%;bottom:-10px;width:5px;height:5px;margin-left:-2.5px;border-radius:50%;background:#e6d3ad;box-shadow:0 0 10px 2px rgba(230,211,173,.7)}
.hdr{background:#1a1e23;transition:background .3s ease,box-shadow .3s ease}
.hdr.is-scrolled{background:rgba(26,30,35,.93);-webkit-backdrop-filter:blur(14px) saturate(1.2);backdrop-filter:blur(14px) saturate(1.2);box-shadow:0 10px 30px rgba(0,0,0,.35)}
.prog{transition:width .15s linear}
section[id]{scroll-margin-top:84px}
@media (prefers-reduced-motion: reduce){.nav-ind,.prog,.navlinks a{transition:none !important}}
.foot a{color:#9aa3ad;text-decoration:none}
.foot a:hover{color:#ffffff}
@media (max-width:760px){.navlinks{display:none !important}.hide-sm{display:none !important}}
@keyframes grow{from{transform:scaleX(0)}}
@keyframes sweep302{from{stroke-dasharray:0 302}}
@keyframes sweep289{from{stroke-dasharray:0 289}}
@keyframes reveal{from{clip-path:inset(0 100% 0 0)}}
.funnel>div>span:last-child{transform-origin:left center;animation:grow 1s cubic-bezier(.2,.8,.2,1) both}
.funnel>div:nth-child(2)>span:last-child{animation-delay:.12s}
.funnel>div:nth-child(3)>span:last-child{animation-delay:.24s}
.funnel>div:nth-child(4)>span:last-child{animation-delay:.36s}
.funnel>div:nth-child(5)>span:last-child{animation-delay:.48s}
.g302{animation:sweep302 1.6s cubic-bezier(.2,.8,.2,1) .3s both}
.g289{animation:sweep289 1.6s cubic-bezier(.2,.8,.2,1) .2s both}
.leds{animation:reveal 1.4s steps(20,end) .4s both}
@supports (animation-timeline: view()){
.funnel>div>span:last-child,.g289,.leds{animation-timeline:view();animation-delay:0s;animation-range:entry 10% cover 40%}
.funnel>div:nth-child(2)>span:last-child{animation-range:entry 15% cover 45%}
.funnel>div:nth-child(3)>span:last-child{animation-range:entry 20% cover 50%}
.funnel>div:nth-child(4)>span:last-child{animation-range:entry 25% cover 55%}
.funnel>div:nth-child(5)>span:last-child{animation-range:entry 30% cover 60%}
}
/* ── Hero motion ── */
@keyframes rise{from{opacity:0;transform:translateY(0.55em)}}
@keyframes fadeup{from{opacity:0;transform:translateY(16px)}}
@keyframes drawline{from{transform:scaleX(0)}}
@keyframes cardin{from{opacity:0;transform:translateY(40px) rotate(-1.5deg) scale(.97)}}
@keyframes floaty{50%{transform:translateY(-8px)}}
@keyframes spin{to{transform:rotate(360deg)}}
@keyframes needle{0%{transform:rotate(-135deg)}60%{transform:rotate(95deg)}100%{transform:rotate(70deg)}}
@keyframes chipin{0%{opacity:0;transform:translateY(14px) scale(.9)}100%{opacity:1;transform:none}}
@keyframes chipfloat{50%{transform:translateY(-6px)}}
@keyframes hl{from{background-color:#ffffff;box-shadow:inset 0 0 0 transparent}}
@keyframes tagpop{0%{opacity:0;transform:scale(.4)}70%{transform:scale(1.15)}100%{opacity:1;transform:none}}
@keyframes pulse{50%{opacity:.3}}
@keyframes glow{0%,100%{opacity:.35}50%{opacity:.7}}
@property --n{syntax:'<integer>';inherits:false;initial-value:0}
@keyframes count{from{--n:0}to{--n:94}}
.rise{display:inline-block;animation:rise .9s cubic-bezier(.2,.8,.2,1) both}
.fadeup{animation:fadeup .8s cubic-bezier(.2,.8,.2,1) both}
.drawline{transform-origin:left center;animation:drawline .8s cubic-bezier(.2,.8,.2,1) .1s both}
.cardin{animation:cardin 1.1s cubic-bezier(.2,.8,.2,1) .35s both}
.floaty{animation:floaty 6s ease-in-out 1.6s infinite}
.ring{animation:spin 90s linear infinite}
.ring2{animation:spin 140s linear infinite reverse}
.needle{transform-origin:50% 50%;animation:needle 2.2s cubic-bezier(.3,.7,.2,1) .4s both}
.glow{animation:glow 5s ease-in-out infinite}
.chip1{animation:chipin .7s cubic-bezier(.2,.8,.2,1) 1.5s both}
.chip2{animation:chipin .7s cubic-bezier(.2,.8,.2,1) 2.6s both}
.chip1>div{animation:chipfloat 5s ease-in-out 2.4s infinite}
.chip2>div{animation:chipfloat 5.5s ease-in-out 3.4s infinite}
.hl{animation:hl .6s ease-out 2.6s both}
.tagpop{display:inline-block;animation:tagpop .5s cubic-bezier(.2,.8,.2,1) 2.8s both}
.pulse{animation:pulse 1.2s ease-in-out infinite}
.count{animation:count 1.6s cubic-bezier(.2,.8,.2,1) .7s both;counter-reset:n var(--n)}
.count::after{content:counter(n)}
@media (prefers-reduced-motion: reduce){.funnel>div>span:last-child,.g302,.g289,.leds,.rise,.fadeup,.drawline,.cardin,.floaty,.ring,.ring2,.needle,.glow,.chip1,.chip2,.chip1>div,.chip2>div,.hl,.tagpop,.pulse,.count{animation:none !important}}

/* ── WhatsApp section ── */
@keyframes wpop{from{opacity:0;transform:translateY(14px) scale(.98)}}
@keyframes wsheen{from{background-position:200% 0}to{background-position:-200% 0}}
.wpop{animation:wpop .7s cubic-bezier(.2,.8,.2,1) both}
.wthread .wpop:nth-child(2){animation-delay:.25s}
.wthread .wpop:nth-child(3){animation-delay:.5s}
.wpanel>.wpop{animation-delay:.9s}
.ai-sheen{background:linear-gradient(90deg,#9a7f4d 0%,#c9ad78 50%,#9a7f4d 100%);background-size:200% 100%;-webkit-background-clip:text;background-clip:text;color:transparent;animation:wsheen 4s linear infinite}
@supports (animation-timeline: view()){
.wpop{animation-timeline:view();animation-delay:0s;animation-range:entry 5% cover 30%}
.wthread .wpop:nth-child(2){animation-range:entry 10% cover 35%}
.wthread .wpop:nth-child(3){animation-range:entry 15% cover 40%}
.wpanel>.wpop{animation-range:entry 20% cover 45%}
}
@media (max-width:1100px){.navlinks{display:none !important}}
@media (prefers-reduced-motion: reduce){.wpop,.ai-sheen{animation:none !important}}