header{position:relative}header:before{content:"";pointer-events:none;background-image:radial-gradient(circle,#eeeeff29 1px,#0000 1.6px);background-size:22px 22px;position:absolute;inset:0;-webkit-mask-image:radial-gradient(60% 70% at 66% 58%,#000 20%,#0000 100%);mask-image:radial-gradient(60% 70% at 66% 58%,#000 20%,#0000 100%)}header .container{max-width:1800px;margin:auto;position:relative}#header-content{justify-content:space-between;margin:5rem auto;position:relative}#header-text{z-index:1;margin:auto;position:relative}#header-text h1{font-weight:400}#header-text .s{color:#fd6584}.header-line{width:min-content}.header-line,.slider{animation-duration:.4s;animation-timing-function:cubic-bezier(0,0,.2,1)}.header-line{color:#fff;white-space:nowrap;animation-name:text-clip;position:relative}.slider{content:"";z-index:999;pointer-events:none;background-color:#fff;height:100%;animation-name:text-hide-show;animation-fill-mode:forwards;position:absolute;inset:0}@keyframes text-clip{0%{clip-path:inset(0 100% 0 0)}to{clip-path:inset(0)}}@keyframes text-hide-show{0%,50%{transform-origin:0}60%,to{transform-origin:100%}60%{transform:scaleX(1)}to{transform:scaleX(0)}}@keyframes text-hide{0%{transform:scaleX(0)}to{transform:scaleX(1)}}@keyframes text-show{0%{transform:scaleX(1)}to{transform:scaleX(0)}}#header-progress{transform-origin:0;background-color:#686868;width:90%;height:2px;margin-top:.5rem;transition-property:transform;transition-duration:6s;transition-timing-function:linear;position:relative;transform:scaleX(0)}#header-text b{font-weight:700}#header-text p{color:#d4d4d4;margin-bottom:2rem}div#header-img{width:min(640px,50%);min-width:380px;margin:auto;position:relative}.hero-sketch{overflow:visible}#hero-sketch{width:100%;height:auto;display:block;position:relative;transform:translate(2.5rem,-2.5rem)}.hero-sketch path{fill:none;stroke-linecap:round;stroke-linejoin:round}.hero-sketch .ink{stroke:#eef}.hero-sketch .blue{stroke:#0038ff}.hero-sketch .pink{stroke:#fd6584}.hero-sketch .red{stroke:red}.hero-sketch .green{stroke:#2e7d32}.hero-sketch .hatch{stroke-opacity:.75}.hero-sketch .hatch.shade{stroke:#eef;stroke-opacity:.14}.hero-sketch .none,.hero-sketch .solid{stroke:none}.hero-sketch .solid.paper{fill:#111113}.hero-sketch .solid.ink{fill:#eef}.hero-sketch .solid.blue{fill:#0038ff}.hero-sketch .solid.pink{fill:#fd6584}.hero-sketch .solid.green{fill:#2e7d32}.hero-sketch text{fill:#eef;font-family:Roboto Mono,monospace}.hero-sketch .scene{transition:opacity .24s;display:none}.hero-sketch .scene.on{display:inline}.hero-sketch .scene.out{opacity:0}.hero-sketch path:not(.solid){stroke-dasharray:1;animation:.7s cubic-bezier(.3,0,.2,1) backwards sketch-draw;animation-delay:calc(var(--i) * 55ms)}.hero-sketch .solid,.hero-sketch text{animation:.3s backwards sketch-fade;animation-delay:calc(var(--i) * 55ms)}@keyframes sketch-draw{0%{stroke-dashoffset:1px}to{stroke-dashoffset:0}}@keyframes sketch-fade{0%{opacity:0}}@media (prefers-reduced-motion:reduce){.hero-sketch,.hero-sketch *{transition:none!important;animation:none!important}}#companies{z-index:1;border-top:1px solid #fff;justify-content:space-between;align-items:baseline;width:70%;min-width:650px;max-width:1200px;height:6rem;margin:auto;padding:2rem 5rem;display:flex;position:relative}#companies img{height:75%}h1,h2{margin:0;font-family:Roboto Mono,monospace;line-height:130%}h2{text-align:center;margin-top:1.5rem}section{padding:5rem 5% 4rem}section>*{width:85%;max-width:1000px;margin:auto}#services-head{text-align:center;text-align:center}#services{align-items:baseline;gap:5rem;display:flex}.service{flex:1}#model-sm{color:#fff;background:#111113;overflow:hidden}#model-sm .container{justify-content:space-between;align-items:center;max-width:800px;display:flex}#model-sm p{color:#fff}#model-sm sup{color:#000;background-color:#fff;padding:0 .2rem;font-size:1.2rem;line-height:1.2rem;position:absolute}#model-sm img{width:35%;min-width:200px;max-width:300px;height:100%;margin-top:-2.5rem;margin-bottom:-200px;animation:1s fadein;position:relative}#profile{align-items:center;margin-left:7%;display:flex}#quote{display:flex}#quote svg{width:20%}#quote p{color:#000;margin:2rem}#inside-img{width:35%}#contact{text-align:center}#contact-content{background-color:#fff;border-radius:5px;justify-content:space-evenly;align-items:center;gap:2rem;padding:5rem 0;display:flex;box-shadow:0 10px 10px #0000000a}#contact-head{grid-column:1/3}#contact-form{width:50%;max-width:400px}#contact-content #vr{height:20rem}#testimonial{max-width:20rem}#testimonial .splide__container{flex-direction:column;align-items:center;display:flex}#testimonial .splide__container>*{max-width:90%}#testimonial .splide__container p{margin:0}#testimonial .main-img{aspect-ratio:1;border:1px solid #cdcdcd;border-radius:50%;width:fit-content;height:10rem;padding:10px}#testimonial p{width:100%}.splide__arrow{background:0 0}.splide__arrow--prev{left:-1rem}.splide__arrow--next{right:-1rem}.button{width:fit-content;display:inline-block}.button.primary{color:#fff;background-color:#000;border-color:#000}.button.light{color:#000;background-color:#fff;border-color:#fff;margin-bottom:.5rem;padding:.75rem 2rem}.button.secondary{color:#000;border-color:#cfcfcf}@keyframes fadein{0%{opacity:0}to{opacity:1}}@media screen and (width<=1400px){#contact-form{width:40%}}@media screen and (width<=1000px){#header-content{flex-direction:column;gap:2rem;width:100%;margin-top:2rem;margin-bottom:0}#header-text{max-width:550px;width:unset;padding:0}#header-text p{max-width:unset}#header-progress{width:100%}#hero-sketch{margin-top:-14.7%;transform:none}div#header-img{min-width:unset;width:100%;max-width:450px;margin-bottom:3rem}#companies{display:none}p{margin-top:1rem}#services{text-align:center;flex-direction:column;max-width:300px}#model-sm .container{text-align:center;flex-direction:column;gap:2rem;max-width:400px}#model-sm img{width:90%;margin-top:0;margin-bottom:-200px}#inside-img{width:90%;max-width:350px}#quote svg{min-width:30px}#quote p{margin:0 0 0 1rem}#profile{flex-direction:column;margin:0}#inside-head{text-align:center}#contact-content{flex-direction:column;gap:5rem}#contact-content #vr{display:none}#contact-content>*{width:80%;max-width:80%}.button.primary{text-align:center;margin:auto;display:block}}@media screen and (width<=600px){#header-text h1{font-size:2.2rem}#contact-content{width:100%}}
