@import"https://fonts.googleapis.com/css2?family=Manrope:wght@400;500;600&display=swap";*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:#fbfaf8;color:#18181c;font-family:Manrope}a{color:inherit;text-decoration:none}header{height:76px;display:flex;align-items:center;gap:38px;padding:0 4%;border-bottom:1px solid #ddd;position:sticky;top:0;background:#fbfaf8ee;z-index:9}.logo{width:115px;height:68px;object-fit:contain}nav{display:flex;gap:30px;margin:auto;font-size:11px}.book{background:#18181c;color:#fff;border-radius:22px;padding:13px 17px;font-size:10px}header button{display:none}.hero{text-align:center;padding:80px 4% 0;overflow:hidden}.hero>small,.intro small,.title small,.firm small,.tools>small,.contact small{font-size:9px;letter-spacing:.15em}.hero h1{font-size:clamp(48px,6vw,86px);line-height:.98;letter-spacing:-.065em;margin:24px 0}.hero h1 em{font-style:normal}.hero h1 em:after{content:"";display:block;height:5px;background:linear-gradient(90deg,#6928fb,#0072fd,#00caee,#01d38c);width:50%;margin:10px auto}.hero>p{color:#777;font-size:13px}.actions{display:flex;justify-content:center;gap:8px;margin:25px}.actions a{border:1px solid #bbb;border-radius:22px;padding:12px 18px;font-size:10px}.actions a:first-child{background:#18181c;color:#fff}.stage{height:560px;max-width:1050px;margin:45px auto 0;position:relative}.stage>i,.stage>b{position:absolute;height:75px;width:70%;background:linear-gradient(90deg,#6928fb,#0072fd,#00caee,#01d38c);border-radius:60px;transform:rotate(-18deg);top:230px;left:10%}.stage>b{transform:rotate(25deg);left:32%;top:310px}.photo{position:absolute;z-index:2;left:50%;transform:translate(-50%);width:290px;height:500px;background:#fff;padding:8px;border-radius:26px;box-shadow:0 20px 60px #2223}.photo img{width:100%;height:445px;object-fit:cover;border-radius:20px}.photo small{font-size:8px}.dark,.mark{position:absolute;z-index:1;width:210px;height:270px;border-radius:20px;top:120px;padding:25px}.dark{left:3%;background:#19191e;color:#fff;text-align:left;font-size:25px}.dark span{color:#01d38c}.mark{right:3%;background:#fff}.mark .logo{width:100%;height:100%}.intro,.services,.firm,.tools,.contact{padding:120px max(5%,calc((100% - 1160px)/2))}.intro h2,.title h2,.firm h2,.tools h2,.contact h2{font-size:clamp(38px,5vw,67px);line-height:1.08;letter-spacing:-.055em}.intro p{max-width:500px;margin-left:auto;color:#666;line-height:1.8}.services{background:#fff}.title{display:flex;justify-content:space-between;align-items:start}.title h2{text-align:right;margin-top:0}.services>a{display:grid;grid-template-columns:60px 1fr 1fr 30px;align-items:center;border-top:1px solid #ddd;min-height:110px}.services h3{font-size:24px}.services p{font-size:12px;color:#777}.firm{margin:100px 4%;background:#6928fb;color:#fff;border-radius:30px;display:grid;grid-template-columns:1fr 1fr;gap:60px}.firm p{line-height:1.8}.mock{background:#fff;color:#18181c;padding:70px;text-align:center;border-radius:18px}.mock h3{font-size:42px}.tools{background:#18181c;color:#fff}.tools article{margin-left:45%;padding:25px;border-top:1px solid #444;position:relative}.tools article span{position:absolute;left:-50px}.tools article p{color:#999;font-size:11px}.tools article b{font-size:8px}.contact{display:grid;grid-template-columns:1fr 1fr;gap:80px}.contact form{display:grid;gap:20px;background:#fff;padding:40px}.contact input,.contact textarea{border:0;border-bottom:1px solid #bbb;padding:14px}.contact button{background:#18181c;color:#fff;padding:15px;border:0}footer{background:#18181c;color:#fff;padding:60px 5%;display:flex;align-items:center;gap:40px}footer .logo{background:#fff;border-radius:5px}footer small{margin-left:auto}@media (max-width:700px){header{padding:0 15px}nav{display:none;position:absolute;top:76px;left:0;right:0;background:#fff;padding:25px;flex-direction:column}nav.open{display:flex}.book{display:none}header button{display:block;margin-left:auto;border:0;background:none}.hero{padding-top:55px}.stage{height:450px}.photo{width:230px;height:410px}.photo img{height:355px}.dark,.mark{width:140px;height:190px;padding:15px}.dark{left:-35px;font-size:16px}.mark{right:-35px}.title{display:block}.title h2{text-align:left}.services>a{grid-template-columns:40px 1fr 20px}.services p{display:none}.firm,.contact{grid-template-columns:1fr;margin:50px 15px;padding:55px 25px}.mock{padding:40px 15px}.tools article{margin-left:0}.intro,.services,.tools{padding:80px 20px}footer{flex-direction:column;align-items:flex-start}footer small{margin:0}}.package-intro{align-self:start;position:sticky;top:116px}.package-intro h2{max-width:480px;margin-bottom:24px}.package-intro p{max-width:440px;color:#b9b9c1;font-size:14px}.package-intro>a{display:inline-flex;align-items:center;gap:8px;margin-top:22px;padding-bottom:6px;border-bottom:1px solid #5f5f68;font-size:11px}.package-intro>a svg{width:14px}.package-list{display:grid;grid-template-columns:1fr 1fr;gap:12px;color:#18181c}.package-list>a{min-height:250px;padding:24px;background:#fff;border:1px solid #ffffff1c;border-radius:14px;display:flex;flex-direction:column;transition:transform .2s ease,background .2s ease}.package-list>a:hover{transform:translateY(-4px);background:#f6f2ff}.package-top{display:flex;align-items:center;justify-content:space-between}.package-list b{display:inline-flex;padding:6px 9px;border-radius:99px;background:#eee8ff;color:#6928fb;font-size:9px;letter-spacing:.12em}.package-list .package-top small{color:#999;font-size:8px}.package-list h3{font-size:20px;line-height:1.2;letter-spacing:-.035em;margin:34px 0 10px}.package-list p{color:#6f6f75;font-size:11px;line-height:1.65;margin:0 0 24px}.package-cta{display:flex;align-items:center;justify-content:space-between;margin-top:auto;padding-top:14px;border-top:1px solid #e5e5e5;font-size:9px;font-weight:600}.package-cta svg{width:14px;transition:transform .2s}.package-list>a:hover .package-cta svg{transform:translate(3px,-3px)}.individual{display:grid;grid-template-columns:repeat(4,1fr);margin-top:55px;border-top:1px solid #444}.individual a{min-height:120px;border-right:1px solid #444;border-bottom:1px solid #444;padding:22px;font-size:12px;display:flex;flex-direction:column;justify-content:space-between}.individual span{font-size:8px;color:#00caee}.process{display:grid;grid-template-columns:repeat(4,1fr);margin:55px 0;border-top:1px solid #ccc}.process div{padding:25px;border-right:1px solid #ccc}.process h3{font-size:20px}.contact select{border:0;border-bottom:1px solid #bbb;padding:14px;background:#fff}@media (max-width:900px){.firm{grid-template-columns:1fr}.package-intro{position:static}.package-list>a{min-height:230px}}@media (max-width:700px){.package-list{grid-template-columns:1fr}.package-list>a{min-height:220px}.individual,.process{grid-template-columns:1fr 1fr}}.stage{height:570px!important;max-width:1180px!important;border-radius:28px;background:url(/team-collaboration.png) center/cover no-repeat!important;overflow:hidden}.stage>i,.stage>b,.stage>.photo{display:none!important}.stage>.dark{left:34px!important;top:auto!important;bottom:34px!important;width:270px!important;height:auto!important;background:#18181cee!important;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);font-size:29px!important}.stage>.mark{right:34px!important;top:34px!important;width:150px!important;height:150px!important;border-radius:50%!important}.people-wide{display:block;width:72%;height:430px;object-fit:cover;margin:55px 0 25px auto;border-radius:3px}.services>a,.package-list a,.individual a{cursor:pointer}.services>a:hover h3,.package-list a:hover b,.individual a:hover{color:#6928fb}.services>a svg{transition:.2s}.services>a:hover svg{transform:translate(3px,-3px)}@media (max-width:700px){.stage{height:430px!important;border-radius:18px}.stage>.dark{left:15px!important;bottom:15px!important;width:190px!important;font-size:20px!important}.stage>.mark{right:15px!important;top:15px!important;width:95px!important;height:95px!important}.people-wide{width:100%;height:280px;margin-top:35px}}body{background:#fff}.hero{background:radial-gradient(circle at 18% 18%,#e9f4ff 0,transparent 25%),radial-gradient(circle at 82% 22%,#fff0cb 0,transparent 28%),#fffdf7;padding-top:72px}.hero h1{font-size:clamp(54px,6.4vw,91px);max-width:900px;margin:25px auto 20px}.hero h1 em{position:relative;z-index:1}.hero h1 em:after{position:absolute;z-index:-1;bottom:5px;left:-8px;right:-8px;width:auto;height:34%;margin:0;background:#ffd84d;transform:rotate(-1deg);border-radius:3px}.hero>p{max-width:640px;margin:0 auto;font-size:14px;line-height:1.7}.stage{height:410px!important;max-width:820px!important;background:none!important;border-radius:0!important;overflow:visible!important;margin-top:45px!important}.stage:before,.stage:after{content:"";position:absolute;border:1.5px dashed #1d1d20;border-radius:50%;width:260px;height:215px;top:35px;z-index:0}.stage:before{left:55px;transform:rotate(-23deg)}.stage:after{right:55px;transform:rotate(24deg)}.stage>.dark,.stage>.photo,.stage>.mark{display:block!important;position:absolute!important;width:205px!important;height:255px!important;top:45px!important;border-radius:9px!important;overflow:hidden!important;padding:0!important;box-shadow:0 13px 30px #29271717;transform:none!important}.stage>.dark{left:70px!important;bottom:auto!important;background:url(/team-collaboration.png) 66% center/cover!important;font-size:0!important}.stage>.photo{left:50%!important}.stage>.photo img{width:100%;height:100%;object-fit:cover;object-position:center 20%;border-radius:0}.stage>.photo small{display:none}.stage>.mark{right:70px!important;left:auto!important;background:url(/legal-branding-session.png) 72% center/cover!important}.stage>.mark img{display:none}.stage>.photo:after{content:"WAKILI WA TECH";position:absolute;left:50%;bottom:-28px;transform:translate(-50%);background:#18181c;color:#fff;border-radius:50%;width:62px;height:62px;display:grid;place-items:center;text-align:center;font-size:7px;line-height:1.35;letter-spacing:.08em;border:5px solid #fff}.stage>i,.stage>b{display:block!important;position:absolute;width:9px;height:9px;border-radius:50%;background:#6928fb!important;z-index:4}.stage>i{left:25px;top:65px}.stage>b{right:24px;left:auto;top:240px;background:#01d38c!important}.intro{padding-top:105px}.intro h2{max-width:1020px}.people-wide{border-radius:12px;box-shadow:none}.services{background:linear-gradient(145deg,#fff 15%,#fff8dd 55%,#eef1ff)}.services>a{background:#ffffffb8;padding:0 22px}.services>a:hover{background:#fff}.firm{background:#18181c;border-radius:18px}.tools{background:linear-gradient(145deg,#19191d,#272234)}.actions a:first-child,.book{background:#18181c}.actions a:hover,.book:hover{background:#6928fb}.title h2{max-width:720px}@media (max-width:700px){.hero{padding-top:48px}.hero h1{font-size:51px}.stage{height:325px!important}.stage:before,.stage:after{width:180px;height:150px}.stage>.dark,.stage>.photo,.stage>.mark{width:145px!important;height:195px!important;top:45px!important}.stage>.dark{left:-4px!important}.stage>.mark{right:-4px!important}.stage>.photo:after{width:49px;height:49px;bottom:-22px}.hero h1 em:after{height:28%}}.stage>.dark,.stage>.photo,.stage>.mark{width:184px!important;height:225px!important;border-radius:8px!important;border:7px solid transparent!important;box-shadow:0 12px 24px #1c1c2112!important}.stage>.dark{left:105px!important;top:35px!important;background:linear-gradient(#ffc928,#ffc928) padding-box,url(/advocate-woman-standing.png) center 24%/cover!important;background-image:url(/advocate-woman-standing.png)!important;border-color:#ffc928!important}.stage>.photo{left:50%!important;top:78px!important;transform:translate(-50%)!important;background:url(/advocate-man.png) center 22%/cover!important;border-color:#9a78cb!important}.stage>.photo>img{display:none!important}.stage>.mark{left:auto!important;right:105px!important;top:35px!important;background:url(/advocate-woman-tablet.png) center 24%/cover!important;border-color:#39afc5!important}.stage>.photo:after{bottom:-36px!important}.stage:before,.stage:after{z-index:0!important}.stage>.dark,.stage>.photo,.stage>.mark{z-index:2!important}@media (max-width:700px){.stage>.dark,.stage>.photo,.stage>.mark{width:125px!important;height:168px!important;border-width:5px!important}.stage>.dark{left:0!important;top:38px!important}.stage>.photo{left:50%!important;top:72px!important}.stage>.mark{right:0!important;top:38px!important}.stage>.photo:after{bottom:-29px!important}}.stage{height:480px!important;max-width:1000px!important;background:url(/advocate-hero-composition.png) center top/contain no-repeat!important;margin-top:32px!important;position:relative!important}.stage>.dark,.stage>.photo,.stage>.mark,.stage>i,.stage>b{display:none!important}.stage:before{content:""!important;display:block!important;position:absolute!important;width:58px!important;height:58px!important;left:50%!important;top:286px!important;transform:translate(-50%)!important;border-radius:50%!important;border:5px solid #fff!important;background:#17171b url(/wakili-logo.png) center/78% no-repeat!important;z-index:4!important}.stage:after{content:"DESIGN\a Brand & graphics        DEVELOP\aWebsites & software        SUPPORT\a Digital assistance        KENYA\a Built for legal practice"!important;white-space:pre!important;position:absolute!important;left:50%!important;bottom:8px!important;transform:translate(-50%)!important;width:80%!important;height:auto!important;border:0!important;border-radius:0!important;text-align:center!important;font-size:10px!important;line-height:1.55!important;font-weight:600!important;letter-spacing:.02em!important;color:#18181c!important;z-index:5!important}.stage{margin-bottom:15px!important}@media (max-width:700px){.stage{height:310px!important;background-size:cover!important;background-position:center top!important}.stage:before{width:43px!important;height:43px!important;top:179px!important;border-width:4px!important}.stage:after{bottom:0!important;width:100%!important;font-size:7px!important;line-height:1.35!important;letter-spacing:-.01em!important}}.stage{height:625px!important;background-size:900px auto!important;background-position:center top!important}.stage:before{display:none!important;content:none!important}.stage:after{display:block!important;content:""!important;position:absolute!important;left:50%!important;top:475px!important;bottom:auto!important;transform:translate(-50%)!important;width:900px!important;height:110px!important;border:0!important;border-radius:0!important;background:url(/hero-stats.svg) center/contain no-repeat!important;z-index:5!important}@media (max-width:700px){.stage{height:405px!important;background-size:590px auto!important}.stage:after{top:296px!important;width:115%!important;height:82px!important}}header>.logo{width:190px;height:64px;object-fit:contain;object-position:left center;mix-blend-mode:multiply}.brand-film{margin:0 4% 100px;background:#fff;border:1px solid #e9e7e2;border-radius:20px;overflow:hidden;position:relative}.brand-film-copy{display:flex;align-items:center;justify-content:space-between;padding:22px 28px;border-bottom:1px solid #eceae6}.brand-film-copy small{font-size:9px;letter-spacing:.15em;color:#6928fb}.brand-film-copy p{margin:0;font-size:12px;color:#777}.brand-animation{height:clamp(280px,42vw,540px);overflow:hidden;display:grid;place-items:center;background:#fff}.brand-animation img{grid-area:1/1;width:100%;height:100%;object-fit:cover}.brand-still{display:none}footer>.logo{width:min(280px,100%);height:100px;object-fit:contain;background:#fff;border-radius:8px;padding:4px}@media (max-width:900px){header>.logo{width:155px}.brand-film{margin:0 20px 70px}.brand-film-copy{padding:18px 20px}.brand-animation{height:43vw;min-height:230px}}@media (max-width:700px){header>.logo{width:145px;height:58px}.brand-film-copy{display:block}.brand-film-copy p{margin-top:7px}.brand-animation{height:58vw;min-height:220px}.brand-animation img{width:140%;max-width:none}.brand-film{border-radius:14px}}@media (prefers-reduced-motion:reduce){.brand-gif{display:none}.brand-still{display:block!important;width:90%!important;height:auto!important;object-fit:contain!important}}.brand-animation{height:auto!important;min-height:0!important;overflow:hidden!important;display:grid!important;place-items:center!important;background:#fff!important}.brand-animation .brand-gif,.brand-animation img{grid-area:1/1!important;width:100%!important;max-width:100%!important;height:auto!important;object-fit:contain!important;object-position:center center!important;transform:none!important}.brand-film{max-width:92%!important}html,body,#root{max-width:100%;overflow-x:hidden}@media (max-width:900px){.brand-film{max-width:none!important;margin-left:20px!important;margin-right:20px!important}.brand-animation{height:auto!important;min-height:0!important}.brand-animation img{width:100%!important;max-width:100%!important;height:auto!important}}@media (max-width:700px){header{max-width:100%!important}.hero,.intro,.services,.tools,.contact,.firm{max-width:100%!important}.brand-film{margin:0 12px 56px!important;border-radius:14px!important}.brand-film-copy{padding:16px!important}.brand-film-copy p{margin-top:7px!important}.brand-animation{width:100%!important;height:auto!important;min-height:0!important}.brand-animation .brand-gif,.brand-animation img{width:100%!important;max-width:100%!important;height:auto!important;object-fit:contain!important}.services>a{min-width:0!important;overflow:hidden!important}.services h3{min-width:0!important;overflow-wrap:anywhere!important}.actions{flex-wrap:wrap!important}.actions a{flex:1 1 150px!important;text-align:center!important}}