/* Web application design service page (/web-app-design/). Tokens from tokens.css, chrome and form helpers from site.css.
   Interactive state lives on [data-vt-root] as data-pr / data-faq (js/site.js sets it); js/webappdesign.js only clears the project-type error. */
@keyframes vsIn{from{opacity:0;transform:translateY(18px)}}
@keyframes vtFloat{0%,100%{transform:translateY(0)}50%{transform:translateY(-10px)}}
@keyframes marq{to{transform:translateX(50%)}}
@keyframes ftBar{from{width:0}to{width:100%}}

.wa{position:relative;font-family:var(--font);background:var(--cream);color:var(--navy);overflow-x:clip;min-height:100vh}
.wa-bg{position:fixed;inset:0;z-index:0;pointer-events:none;overflow:hidden}
.wa-orb{position:absolute;border-radius:50%;filter:blur(110px)}
.wa-orb--1{top:-12vw;left:-8vw;width:46vw;height:46vw;background:#03A1FB;opacity:.385}
.wa-orb--2{top:30vh;right:-14vw;width:40vw;height:40vw;background:#F0C3A2;opacity:.245}
.wa-orb--3{bottom:-18vw;left:25vw;width:38vw;height:38vw;background:#F7DCCB;opacity:.175}
.wa-grid{position:absolute;inset:0;background-image:linear-gradient(#0E1B2E0D 1px,transparent 1px),linear-gradient(90deg,#0E1B2E0D 1px,transparent 1px);background-size:64px 64px;-webkit-mask-image:radial-gradient(ellipse at 50% 30%,#000 20%,transparent 75%);mask-image:radial-gradient(ellipse at 50% 30%,#000 20%,transparent 75%)}
.wa-body{position:relative;z-index:1}

/* ---- layout primitives ---- */
.wa-sec{padding:0 16px clamp(128px,16vw,240px);scroll-margin-top:96px}
.wa-sec--hero{padding:clamp(40px,6vw,80px) 16px clamp(96px,12vw,180px)}
.wa-wrap{max-width:1120px;margin:0 auto}
.wa-wrap--w{max-width:1240px}
.wa-wrap--n{max-width:820px}
.wa-stack{display:flex;flex-direction:column;gap:28px}
.wa-head{display:flex;flex-direction:column;gap:14px;max-width:780px}
.wa-head--wide{max-width:860px}
.wa-head--c{align-items:center;text-align:center;max-width:none}
.wa-head--c .wa-lead{max-width:780px}
.wa-h1{margin:0;font-size:clamp(34px,4.6vw,58px);line-height:1.35;font-weight:900;text-wrap:balance}
.wa-h2{margin:0;font-size:clamp(26px,3vw,40px);line-height:1.5;font-weight:900;text-wrap:balance}
.wa-h2--wide{max-width:820px}
.wa-h2--c{text-align:center}
.wa-h2--faq{margin:0 auto;max-width:760px;font-size:clamp(24px,3vw,40px)}
.wa-grad{background:linear-gradient(90deg,#0288D8,#D98A5C);-webkit-background-clip:text;background-clip:text;color:transparent}
.wa-blue{color:#0391E6}
.wa-lead{margin:0;font-size:15.5px;line-height:2.1;color:#0E1B2EA6;text-wrap:pretty}
.wa-lead--c{margin-top:12px;text-align:center;color:#0E1B2EB3}
.wa-link{font-size:14.5px;font-weight:800;color:#0369AD;transition:color .2s}
.wa-link:hover{color:var(--navy)}
.wa-link--c{align-self:center;text-align:center}
.wa-glass{border-radius:26px;background:#FFFFFF80;border:1px solid #FFFFFFD9;backdrop-filter:blur(20px) saturate(1.5);-webkit-backdrop-filter:blur(20px) saturate(1.5);box-shadow:inset 0 1px 0 #FFFFFF,0 20px 50px -34px #1E3A5F66}
.wa-dark{position:relative;overflow:hidden;border-radius:30px;background:linear-gradient(165deg,#15294A,#0B1726);box-shadow:0 40px 80px -40px #0B1726;color:#fff}
.wa-glow{position:absolute;border-radius:50%;pointer-events:none}
.wa-glow--a{top:-30%;left:-20%;width:70%;aspect-ratio:1;background:#03A1FB;filter:blur(120px);opacity:.35}
.wa-glow--b{bottom:-40%;right:-20%;width:60%;aspect-ratio:1;background:#F2894A;filter:blur(130px);opacity:.2}
.wa-glow--c{top:-40%;left:-20%;width:70%;aspect-ratio:1;background:#03A1FB;filter:blur(110px);opacity:.35}
.wa-glow--d{top:-50%;right:-10%;width:50%;aspect-ratio:1;background:#03A1FB;filter:blur(120px);opacity:.35}
.wa-glow--e{bottom:-55%;left:-5%;width:45%;aspect-ratio:1;background:#F2894A;filter:blur(130px);opacity:.22}
.wa-glow--f{top:-140px;left:-110px;width:360px;height:360px;background:#03A1FB;filter:blur(120px);opacity:.45}
.wa-g-blue{background:linear-gradient(160deg,#2BB3FF,#0391E6)}
.wa-g-orange{background:linear-gradient(160deg,#FFB27E,#F2894A)}
.wa-g-navy{background:var(--navy)}
.wa-ic{flex:none;width:48px;height:48px;border-radius:15px;color:#fff;display:grid;place-items:center}
.wa-ic--sm{width:44px;height:44px;border-radius:14px}
.wa-pill{align-self:flex-start;padding:6px 14px;border-radius:999px;background:#FFFFFF14;border:1px solid #FFFFFF26;color:#7CCBFF;font-size:13px;font-weight:900}
.wa-in{animation:vsIn .6s cubic-bezier(.2,.7,.2,1) both}
.wa-in--2{animation-duration:.8s;animation-delay:.08s}
.wa-in--3{animation-duration:.9s;animation-delay:.16s}
.wa-in--4{animation-duration:.8s;animation-delay:.24s}
.wa-in--5{animation-duration:.8s;animation-delay:.3s}

/* ---- buttons and inputs ---- */
.wa-btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;height:50px;padding:0 22px;border:0;border-radius:14px;background:var(--grad-btn);color:#fff;font:inherit;font-size:15px;font-weight:800;cursor:pointer;text-align:center;box-shadow:inset 0 1px 0 #FFFFFF59,0 12px 28px -12px #0391E6;transition:transform .2s,filter .2s,background .25s,color .25s}
.vt-page .wa-btn:hover{color:#fff;filter:brightness(1.06)}
.wa-btn--lg{height:54px;font-size:15.5px}
.wa-btn--xl{height:56px;padding:0 26px;font-size:16px}
.wa-btn--wrap{height:auto;min-height:54px;padding:12px 24px;line-height:1.6}
.wa-btn--c{align-self:center}
.wa-btn--ghost{background:transparent;border:1.5px solid #0369AD;color:#0369AD;box-shadow:none;height:52px}
.vt-page .wa-btn--ghost:hover{background:#0391E6;color:#fff;filter:none}
.wa-btn--dark{border-color:var(--navy);color:var(--navy);height:50px}
.vt-page .wa-btn--dark:hover{background:var(--navy);color:#fff}
.wa-btn--outline-w{background:transparent;border:1.5px solid #fff;color:#fff;box-shadow:none;font-size:15.5px}
.vt-page .wa-btn--outline-w:hover{background:#fff;color:var(--navy);filter:none}
.wa-btn--submit{flex:1 1 260px;max-width:340px;height:56px}
.wa-input{width:100%;height:50px;padding:0 14px;border-radius:13px;background:#F7F9FC;border:1px solid #D3DEEA;font:inherit;font-size:14.5px;color:var(--navy);transition:border-color .2s,box-shadow .2s}
.wa-input--lg{height:54px;padding:0 16px;font-size:15px;border-radius:14px}
.wa-input--w{background:#fff}
.wa-input--ltr{text-align:left}
.vt-page .wa-input:focus{border-color:#03A1FB;box-shadow:0 0 0 4px #03A1FB26;outline:none}
.wa-form{display:flex;flex-direction:column;gap:12px}
.wa-form[hidden]{display:none}
.wa-form__title{font-size:15px;font-weight:800}
.wa-note{margin:0;font-size:12.5px;line-height:1.9;color:#0E1B2EA6}
.wa-note--c{text-align:center}
.wa-lbl{display:block;margin-bottom:8px;font-size:13.5px;font-weight:700}
.wa-req{color:var(--danger)}
.wa-field{display:flex;flex-direction:column;gap:7px}
.wa-field label,.wa-field__l{font-size:13px;font-weight:700}
.wa-sent{align-items:center;gap:14px;text-align:center}
.wa-sent:not([hidden]){display:flex}
.wa-sent--row{padding:8px 0;text-align:start;font-size:15px;line-height:1.9;font-weight:700}
.wa-sent--col{flex-direction:column;justify-content:center;min-height:240px;gap:12px}
.wa-sent--col b{font-size:18px}
.wa-sent--col>span:last-child{font-size:14px;line-height:1.9;color:#0E1B2EA6}
.wa-sent--final{min-height:220px}
.wa-sent--final h3{margin:0;font-size:22px;font-weight:800}
.wa-sent--final p{margin:0;font-size:15px;line-height:1.95;color:#3E4E64}
.wa-sent__tick{flex:none;width:44px;height:44px;border-radius:50%;background:#0FA9581F;color:#0A7A40;display:grid;place-items:center;font-size:20px;font-weight:900}
.wa-sent__tick--lg{width:56px;height:56px;font-size:24px}
.wa-sent__tick--blue{background:#D6ECFB;color:#0077C8}

/* ---- page overrides of the shared primitives ---- */
.wa-sec--hero{padding:clamp(40px,6vw,80px) 16px clamp(128px,16vw,240px)}
.wa-sec--last{padding-bottom:clamp(88px,11vw,160px)}
.wa-wrap--m{max-width:1000px}
.wa-stack--lg{gap:clamp(28px,3vw,40px)}
.wa-h1{font-size:clamp(30px,4vw,50px);line-height:1.45}
.wa-h2--w{color:#fff}
.wa-h2--s{font-size:clamp(24px,2.8vw,36px)}
.wa-h2--faq{margin:0 auto;max-width:760px;font-size:clamp(24px,3vw,40px)}
.wa-lead--d{font-size:15px;line-height:2.05;color:#0E1B2EB3}
.wa-link{color:#0369AD}
.wa-opt-l{font-weight:500;color:#0E1B2EA6}
.wa-glow--o{top:-30%;left:-20%;width:60%;aspect-ratio:1;background:#FFB27E;filter:blur(90px);opacity:.35}
.wa-btn--line{background:#FFFFFF66;border:1.5px solid #0E1B2E26;color:var(--navy);box-shadow:none}
.vt-page .wa-btn--line:hover{background:#FFFFFFB3;border-color:#0391E6;color:#0369AD;filter:none}
.wa-btn--white{background:#fff;border:1px solid #E3EBF3;color:var(--navy);box-shadow:none;height:48px;padding:0 20px;font-size:14.5px}
.vt-page .wa-btn--white:hover{background:#fff;border-color:#0391E6;color:#0369AD;filter:none}
.wa-btn--xl:hover{transform:translateY(-2px)}
.wa-btn--block{width:100%}
.wa-more{display:flex;justify-content:center}
.wa-sent__tick--ok{background:#0A7A40;color:#fff}
.wa-sent__tick--ok.wa-sent__tick--lg{width:64px;height:64px;font-size:28px;box-shadow:0 0 0 10px #0FA9581F}
.wa-hero{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,460px),1fr));gap:clamp(40px,5vw,72px);align-items:center}
.wa-hero__main{display:flex;flex-direction:column;align-items:flex-start;gap:20px;min-width:0}
.wa-crumb{margin:0;display:flex;flex-wrap:wrap;align-items:center;gap:8px;font-size:12.5px;color:#0E1B2EA6}
.wa-crumb a{color:#0E1B2EA6}
.wa-crumb a:hover{color:#0369AD}
.wa-crumb__cur{color:var(--navy)}
.wa-hero__lead{max-width:580px;color:#0E1B2EB3;line-height:2.05;font-size:16px}
.wa-in--vis{animation-duration:1s;animation-delay:.2s}
.wa-hero__vis{min-width:0}
/* ---- 02 trust ---- */
.wa-trust{display:flex;flex-direction:column;align-items:center;gap:20px}
.wa-trust__t{margin:0;font-size:16px;font-weight:800;color:#0E1B2EA6;text-align:center}
.wa-marq{width:100%;overflow:hidden;-webkit-mask-image:linear-gradient(90deg,transparent,#000 12%,#000 88%,transparent);mask-image:linear-gradient(90deg,transparent,#000 12%,#000 88%,transparent)}
.wa-marq__track{display:flex;gap:14px;width:max-content;animation:marq 56s linear infinite}
.wa-marq__it{flex:none;width:150px;height:84px;border-radius:20px;background:#FFFFFFB3;border:1px solid #fff;display:grid;place-items:center}
.wa-marq__it img{max-width:96px;max-height:48px;object-fit:contain;filter:brightness(0)}
.wa-sent--est{padding:clamp(28px,4vw,48px);min-height:380px;gap:14px}
.wa-sent--est h3{margin:0;font-size:24px;font-weight:900}
.wa-sent--est p{margin:0;font-size:15px;line-height:2;color:#0E1B2EA6}
.wa-sent--est p span{color:var(--navy);font-weight:700}
/* ---- 06 process ---- */
.wa-steps{margin:0;padding:0;list-style:none;display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,300px),1fr));gap:14px}
.wa-step-li{display:flex}
.wa-step{all:unset;box-sizing:border-box;cursor:pointer;position:relative;overflow:hidden;width:100%;display:flex;flex-direction:column;gap:12px;padding:24px;border-radius:24px;background:#FFFFFF66;border:1px solid #FFFFFFB3;transition:all .45s cubic-bezier(.2,.7,.2,1)}
.wa-step__n{width:42px;height:42px;border-radius:14px;background:#0E1B2E8C;color:#fff;display:grid;place-items:center;font-size:17px;font-weight:900;transition:background .45s}
.wa-step__t{font-size:17px;font-weight:900;color:#0E1B2EA6;transition:color .45s}
.wa-step__p{font-size:14.5px;line-height:2;color:#0E1B2EA6;text-wrap:pretty}
.wa-step-li:has(~ .wa-step-li .wa-step[aria-current="step"]) .wa-step__n{background:var(--navy)}
.wa-step-li:has(~ .wa-step-li .wa-step[aria-current="step"]) .wa-step__t{color:var(--navy)}
.wa-step[aria-current="step"]{background:#fff;border-color:#fff;box-shadow:0 30px 60px -32px #1E3A5F80}
.wa-step[aria-current="step"] .wa-step__n{background:linear-gradient(160deg,#0391E6,#0369AD)}
.wa-step[aria-current="step"] .wa-step__t{color:var(--navy)}
.wa-bar{position:absolute;bottom:0;right:0;width:0;height:3px;background:linear-gradient(90deg,#2BB3FF,#0391E6);pointer-events:none}
.wa-step[aria-current="step"] .wa-bar{animation:ftBar 3.4s linear both}
/* ---- 08 testimonials ---- */
.wa-ts{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,300px),1fr));gap:16px}
.wa-ts__card{margin:0;display:flex;flex-direction:column;gap:18px;padding:26px;background:#FFFFFF8C}
.wa-ts__q{font-size:44px;line-height:.6;font-weight:900;color:#03A1FB;font-family:Georgia,serif}
.wa-ts__card blockquote{margin:0;flex:1;display:flex;flex-direction:column;gap:10px;font-size:14.5px;line-height:2;color:#0E1B2ECC}
.wa-ts__card blockquote p{margin:0}
.wa-ts__card blockquote b{color:var(--navy)}
.wa-ts__card figcaption{display:flex;align-items:center;gap:12px;padding-top:16px;border-top:1px solid #0E1B2E0F}
.wa-ts__av{flex:none;width:44px;height:44px;border-radius:50%;overflow:hidden;box-shadow:0 0 0 3px #fff,0 8px 18px -8px #1E3A5F59}
.wa-ts__av svg{display:block}
.wa-ts__who{display:flex;flex-direction:column;font-size:12.5px;color:#0E1B2EA6}
.wa-ts__who b{font-size:14.5px;color:var(--navy)}
/* ---- 12 final form ---- */
.wa-fin{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,420px),1fr));gap:16px;align-items:stretch}
.wa-fin__form{display:flex;flex-direction:column;gap:22px;padding:clamp(24px,3vw,40px);border-radius:30px;background:#FFFFFFB3;border:1px solid #fff;backdrop-filter:blur(24px) saturate(1.4);-webkit-backdrop-filter:blur(24px) saturate(1.4);box-shadow:inset 0 1px 0 #fff,0 24px 60px -36px #1E3A5F59}
.wa-fin__hd{display:flex;flex-direction:column;gap:12px}
.wa-checks{margin:0;padding:0;list-style:none;display:flex;flex-wrap:wrap;gap:8px}
.wa-checks li{display:flex;align-items:center;gap:8px;padding:8px 12px;border-radius:12px;background:#0FA9581A;color:#0B7A40;font-size:13.5px;font-weight:800}
.wa-form--final{gap:14px}
.wa-fin__fields{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,200px),1fr));gap:12px}
.wa-sent--box{padding:18px;border-radius:18px;background:#0FA9581A}
.wa-sent--box p{margin:0}
.wa-fin__aside{display:flex;flex-direction:column;gap:24px;padding:clamp(24px,3vw,40px)}
.wa-fin__ah{position:relative;display:flex;flex-direction:column;gap:10px}
.wa-fin__ah span{font-size:14px;font-weight:700;color:#FFFFFFB3}
.wa-fin__ah h3{margin:0;font-size:clamp(20px,2.2vw,26px);line-height:1.6;font-weight:900;color:#fff}
.wa-fin__links{position:relative;flex:1;display:flex;flex-direction:column;justify-content:center;gap:10px}
.wa-ct{display:flex;align-items:center;gap:14px;padding:14px 16px;border-radius:18px;background:#FFFFFF0F;border:1px solid #FFFFFF1F;color:#fff;transition:all .25s}
.vt-page .wa-ct:hover{color:#fff;background:#FFFFFF1F;border-color:#5CC6FF66;transform:translateX(-3px)}
.wa-ct__ic{flex:none;width:44px;height:44px;border-radius:14px;display:grid;place-items:center}
.wa-ct__ic--wa{background:#25D366}
.wa-ct__tx{flex:1;min-width:0;display:flex;flex-direction:column;gap:2px}
.wa-ct__tx span{font-size:12.5px;font-weight:700;color:#FFFFFFB3}
.wa-ct__tx b{font-size:16px;font-weight:900;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.wa-ct__tx b[dir="ltr"]{text-align:right}
.wa-ct__ar{flex:none;color:#FFFFFF99}
/* ---- 13 faq ---- */
.wa-faq{margin:clamp(32px,4vw,52px) 0 0;padding:0;list-style:none;display:flex;flex-direction:column;gap:8px}
.wa-faq__li{border-radius:20px;background:#FFFFFF59;border:1px solid #FFFFFFB3;box-shadow:inset 0 1px 0 #FFFFFF80;transition:all .35s}
.wa-faq__li:has([aria-expanded="true"]){background:#FFFFFFB3;border-color:#fff;box-shadow:inset 0 1px 0 #fff,0 24px 48px -28px #1E3A5F59}
.wa-faq__q{margin:0}
.wa-faq__q button{all:unset;box-sizing:border-box;width:100%;cursor:pointer;display:grid;grid-template-columns:28px minmax(0,1fr) 32px;align-items:center;gap:10px;padding:16px;font-size:15px;line-height:1.7;font-weight:800;border-radius:20px}
.wa-faq__n{font-size:13px;font-weight:900;color:#0E1B2EA6}
.wa-faq__q [aria-expanded="true"] .wa-faq__n{color:#0369AD}
.wa-faq__chev{display:none}
.wa-faq__plus{width:32px;height:32px;border-radius:10px;background:#FFFFFF99;display:flex;align-items:center;justify-content:center;transition:all .35s}
.wa-faq__q [aria-expanded="true"] .wa-faq__plus{background:#0391E6;color:#fff;transform:rotate(45deg)}
.wa-faq__a{display:none;padding:0 54px 18px 16px;font-size:14.5px;line-height:2.05;color:#3E4E64}
.wa-faq__a p{margin:0}
.wa-faq__cnt,.wa-faq__at,.wa-faq__a .wa-glow{display:none}
.wa-faq__q:has([aria-expanded="true"])+.wa-faq__a{display:block;animation:vsIn .45s cubic-bezier(.2,.7,.2,1) both}

@media (min-width:900px){
  .wa-faq{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.1fr);gap:6px 20px;align-items:start}
  .wa-faq__li{display:contents}
  .wa-faq__q{grid-column:1;border-radius:18px;background:#FFFFFF59;transition:all .3s}
  .wa-faq__q:has([aria-expanded="true"]){background:#FFFFFFF2;box-shadow:inset 0 1px 0 #fff,0 18px 36px -24px #1E3A5F66}
  .wa-faq__q button{grid-template-columns:34px minmax(0,1fr) 20px;gap:12px;padding:15px 18px;font-weight:600;border-radius:18px}
  .wa-faq__q [aria-expanded="true"]{font-weight:800}
  .wa-faq__q [aria-expanded="true"] .wa-faq__n{color:#0369AD}
  .wa-faq__plus{display:none}
  .wa-faq__chev{display:block;opacity:0;color:#0369AD;transition:opacity .3s}
  .wa-faq__q [aria-expanded="true"] .wa-faq__chev{opacity:1}
  .wa-faq__a{grid-column:2;grid-row:1 / span 9;position:sticky;top:110px;overflow:hidden;border-radius:30px;background:linear-gradient(160deg,#15294A,#0B1726);box-shadow:0 40px 80px -40px #0B1726;padding:clamp(28px,3.4vw,48px);min-height:360px;color:#FFFFFFCC}
  .wa-faq__q:has([aria-expanded="true"])+.wa-faq__a{display:flex;flex-direction:column;gap:18px}
  .wa-faq__cnt,.wa-faq__at{display:block;position:relative}
  .wa-faq__a .wa-glow{display:block}
  .wa-faq__at{font-size:clamp(20px,2vw,26px);line-height:1.6;font-weight:900;color:#fff;text-wrap:balance}
  .wa-faq__a p{position:relative;font-size:16.5px;line-height:2.1;text-wrap:pretty}
}

/* ---- page additions and overrides ---- */
@keyframes grow{from{transform:scaleY(.12)}}
.wa-sr{position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.wa-h1{font-size:clamp(34px,5vw,60px);line-height:1.35}
.wa-h2--l{line-height:1.55}
.wa-link{align-self:flex-start}
.wa-note--m{margin:0 auto;max-width:760px}
.wa-btn--xl.wa-btn--white{height:56px;padding:0 26px;font-size:16px;font-weight:900;color:#0369AD}
.wa-tag{align-self:flex-start;padding:6px 14px;border-radius:999px;background:#03A1FB1A;color:#0369AD;font-size:13px;font-weight:800}

/* ---- 01 hero ---- */
.wa-hero__cta{width:100%;max-width:560px;display:flex;flex-direction:column;gap:14px}
.wa-hcard{padding:clamp(18px,2.4vw,24px);border-radius:24px;background:#fff;border:1px solid #E3EBF3;box-shadow:0 24px 60px -36px #1E3A5F73}
.wa-form__title{margin:0;font-size:15.5px;line-height:1.8}
.wa-hfields{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,180px),1fr));gap:10px}
.wa-perks{margin-top:clamp(40px,5vw,64px);display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,280px),1fr));gap:12px}
.wa-perk{display:flex;align-items:flex-start;gap:14px;padding:20px 22px;border-radius:22px}
.wa-perk .wa-ic{width:46px;height:46px}
.wa-perk>div{min-width:0}
.wa-perk__t{margin:0;font-size:16px;font-weight:900}
.wa-perk__d{margin:4px 0 0;font-size:14px;line-height:1.9;color:#0E1B2EA6;text-wrap:pretty}

.wa-hv{position:relative;max-width:560px;margin:0 auto;padding:28px 0 24px}
.wa-hv__lap{position:relative;width:88%;margin-right:0;margin-left:auto}
.wa-hv__scr{padding:7px;border-radius:16px 16px 4px 4px;background:var(--navy);box-shadow:0 40px 80px -40px #1E3A5F99}
.wa-hv__app{display:flex;aspect-ratio:16/10.5;border-radius:9px;overflow:hidden}
.wa-hv__side{width:22%;background:var(--navy);padding:12px 8px;display:flex;flex-direction:column;gap:6px}
.wa-hv__logo{height:9px;width:60%;margin-bottom:8px;border-radius:5px;background:#FFFFFFE6}
.wa-hv__nv{padding:5px 7px;border-radius:7px;font-size:8.5px;font-weight:700;color:#FFFFFF8C;white-space:nowrap}
.wa-hv__nv--on{background:#03A1FB;color:#fff}
.wa-hv__main{flex:1;min-width:0;padding:11px;display:flex;flex-direction:column;gap:8px;background:#F4F7FB}
.wa-hv__top{display:flex;justify-content:space-between;align-items:center;font-size:10.5px;color:var(--navy)}
.wa-hv__top b{font-weight:900}
.wa-hv__date{width:56px;height:13px;border-radius:7px;background:#fff;border:1px solid #E3EBF3}
.wa-hv__kpis{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:6px}
.wa-hv__kpi{min-width:0;padding:7px 9px;border-radius:9px;background:#fff;border:1px solid #E3EBF3;display:flex;flex-direction:column;gap:2px}
.wa-hv__kpi i{font-style:normal;font-size:8.5px;font-weight:700;color:#0E1B2E80;white-space:nowrap}
.wa-hv__kpi b{font-size:13px;font-weight:900;color:var(--navy)}
.wa-hv__kpi .wa-hv__b{color:#0391E6}
.wa-hv__chart{display:block;padding:9px;border-radius:9px;background:#fff;border:1px solid #E3EBF3}
.wa-bars{height:62px;display:flex;align-items:flex-end;gap:5px}
.wa-bars i{flex:1;border-radius:4px 4px 2px 2px;background:var(--grad-btn);transform-origin:bottom;animation:grow 1.2s cubic-bezier(.2,.7,.2,1) both}
.wa-bars i:nth-child(1){height:38%;animation-delay:.4s}.wa-bars i:nth-child(2){height:52%;animation-delay:.48s}.wa-bars i:nth-child(3){height:44%;animation-delay:.56s}.wa-bars i:nth-child(4){height:66%;animation-delay:.64s}
.wa-bars i:nth-child(5){height:58%;animation-delay:.72s}.wa-bars i:nth-child(6){height:80%;animation-delay:.8s}.wa-bars i:nth-child(7){height:72%;animation-delay:.88s}.wa-bars i:nth-child(8){height:92%;animation-delay:.96s;background:linear-gradient(180deg,#FFB27E,#F2894A)}
.wa-bars--p{height:100%;gap:3px}
.wa-bars--p i:nth-child(1){height:40%;animation-delay:.9s}.wa-bars--p i:nth-child(2){height:62%;animation-delay:.98s}.wa-bars--p i:nth-child(3){height:50%;animation-delay:1.06s}.wa-bars--p i:nth-child(4){height:78%;animation-delay:1.14s}
.wa-bars--p i:nth-child(5){height:90%;animation-delay:1.22s;background:linear-gradient(180deg,#FFB27E,#F2894A)}
.wa-hv__tbl,.wa-hv__pt{display:block;padding:3px 9px;border-radius:9px;background:#fff;border:1px solid #E3EBF3}
.wa-hv__row{display:grid;grid-template-columns:minmax(0,1fr) auto auto;gap:6px;align-items:center;padding:5px 0;border-top:1px solid #0E1B2E0F;font-size:9px;font-weight:700;color:#0E1B2ECC}
.wa-hv__row:first-child{border-top:0}
.wa-hv__row>span:first-child{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.wa-hv__t{color:#0E1B2E80}
.wa-hv__st{padding:1px 6px;border-radius:6px;background:#0FA9581F;color:#0B8A47;font-size:8px;white-space:nowrap}
.wa-hv__st--w{background:#F2894A1F;color:#9A5530}
.wa-hv__base{margin:0 -6%;height:12px;border-radius:0 0 14px 14px;background:linear-gradient(180deg,#DCE4EE,#AEBBCB)}
.wa-hv__ph{position:absolute;left:0;bottom:-6px;width:30%;min-width:120px;padding:5px;border-radius:24px;background:var(--navy);box-shadow:0 30px 60px -24px #0B1726;animation:vtFloat 6s ease-in-out infinite}
.wa-hv__pscr{aspect-ratio:9/18.5;border-radius:19px;overflow:hidden;background:#F4F7FB;display:flex;flex-direction:column;padding:14px 8px 0;gap:7px}
.wa-hv__notch{align-self:center;width:36px;height:5px;margin:-8px 0 2px;border-radius:3px;background:var(--navy)}
.wa-hv__hi{font-size:9.5px;font-weight:900;color:var(--navy)}
.wa-hv__pk{padding:8px 9px;border-radius:10px;background:linear-gradient(160deg,#2BB3FF,#0391E6);color:#fff;display:flex;flex-direction:column;gap:2px}
.wa-hv__pk i{font-style:normal;font-size:8px;font-weight:700;opacity:.85}
.wa-hv__pk b{font-size:14px;font-weight:900}
.wa-hv__pc{display:block;height:46px;padding:7px;border-radius:10px;background:#fff;border:1px solid #E3EBF3}
.wa-hv__pt{padding:2px 7px;border-radius:10px}
.wa-hv__pt .wa-hv__row{grid-template-columns:minmax(0,1fr) auto;gap:3px;font-size:8px}
.wa-hv__tab{margin:auto -8px 0;padding:8px 12px 10px;background:#fff;border-top:1px solid #E3EBF3;display:flex;justify-content:space-between}
.wa-hv__tab i{width:14px;height:14px;border-radius:5px;background:#D7E0EA}
.wa-hv__tab i.on{background:#0391E6}
.wa-hv__chip{position:absolute;top:-8px;left:4%;display:flex;align-items:center;gap:8px;padding:9px 14px;border-radius:16px;background:linear-gradient(160deg,#FFB27E,#F2894A);color:#fff;font-size:13px;font-weight:800;box-shadow:0 18px 36px -18px #F2894A;animation:vtFloat 5s -2s ease-in-out infinite}
.wa-hv__chip span{width:7px;height:7px;border-radius:50%;background:#fff}

/* ---- 02 trust ---- */
.wa-stats{display:flex;flex-wrap:wrap;justify-content:center;gap:12px}
.wa-stat{display:flex;align-items:center;gap:12px;padding:14px 22px;border-radius:20px;background:#FFFFFF80;border:1px solid #FFFFFFD9}
.wa-stat__n{font-size:26px;font-weight:900;color:var(--navy)}
.wa-stat__n--b{color:#0369AD}
.wa-stat__l{font-size:14px;font-weight:700;color:#0E1B2EA6}

/* ---- 03 applications ---- */
.wa-apps{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(100%,320px),1fr));gap:16px}
.wa-app{display:flex;flex-direction:column;gap:14px;padding:26px;border-radius:26px;background:#FFFFFF8C;transition:transform .35s cubic-bezier(.2,.7,.2,1),box-shadow .35s}
.wa-app:hover{transform:translateY(-6px);box-shadow:inset 0 1px 0 #fff,0 30px 60px -34px #1E3A5F80}
.wa-app h3{margin:0;font-size:18px;line-height:1.6;font-weight:900}
.wa-app p{margin:0;flex:1;font-size:14.5px;line-height:2;color:#0E1B2EB3;text-wrap:pretty}
.wa-app p.wa-app__ex{flex:none;padding-top:12px;border-top:1px solid #0E1B2E0F;font-size:13px;line-height:1.8;font-weight:600;color:#0E1B2EA6}

/* ---- 04 why ---- */
.wa-why{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,420px),1fr));gap:clamp(28px,4vw,56px);align-items:start}
.wa-why__side{position:sticky;top:110px;display:flex;flex-direction:column;gap:18px;min-width:0}
.wa-whys{margin:0;padding:0;list-style:none;display:flex;flex-direction:column;gap:12px;min-width:0}
.wa-whyc{display:flex;align-items:flex-start;gap:18px;padding:clamp(20px,2.4vw,28px);border-radius:26px}
.wa-whyc>div{min-width:0}
.wa-whyc__ic{flex:none;width:46px;height:46px;border-radius:15px;background:#03A1FB1A;color:#0369AD;display:grid;place-items:center}
.wa-whyc h3{margin:0;font-size:18px;line-height:1.6;font-weight:900}
.wa-whyc p{margin:6px 0 0;font-size:14.5px;line-height:2;color:#0E1B2EA6;text-wrap:pretty}
.wa-whyc--hl{background:var(--navy);border:1px solid var(--navy);box-shadow:0 30px 60px -34px #0B1726;color:#fff}
.wa-whyc--hl .wa-whyc__ic{background:var(--grad-btn);color:#fff}
.wa-whyc--hl p{color:#FFFFFFC7}

/* ---- 05 process ---- */
.wa-step__top{display:flex;align-items:center;justify-content:space-between;gap:10px}
.wa-step__time{flex:none;white-space:nowrap;display:inline-flex;align-items:center;gap:6px;padding:5px 11px;border-radius:999px;background:#0E1B2E0A;color:#0E1B2EA6;font-size:12.5px;font-weight:800}
.wa-step[aria-current="step"] .wa-step__time{background:#03A1FB1A;color:#0369AD}
.wa-step__p{flex:1}
.wa-step__out{display:flex;align-items:flex-start;gap:10px;padding:12px 14px;border-radius:14px;background:#0E1B2E08;font-size:13.5px;line-height:1.9;font-weight:700;color:var(--navy)}
.wa-step__out svg{flex:none;margin-top:4px;color:#0391E6}
.wa-step__ol{color:#0E1B2EA6;font-weight:600}

/* ---- 06 mid cta ---- */
.wa-cta{position:relative;overflow:hidden;padding:clamp(32px,5vw,64px);border-radius:32px;background:linear-gradient(165deg,#0378C6,#0270BA 55%,#025A9A);box-shadow:0 40px 80px -40px #0391E6;display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:28px;color:#fff}
.wa-cta__tx{position:relative;flex:1 1 460px;min-width:0;display:flex;flex-direction:column;gap:12px}
.wa-cta__t{margin:0;font-size:clamp(22px,2.6vw,32px);line-height:1.6;font-weight:900;text-wrap:balance}
.wa-cta__p{margin:0;font-size:15.5px;line-height:2.05;color:#FFFFFFE0;text-wrap:pretty}
.wa-cta__btns{position:relative;display:flex;flex-wrap:wrap;gap:10px}

/* ---- 07 compare ---- */
.wa-cmp{display:grid;grid-template-columns:minmax(0,1fr);gap:16px;align-items:center;padding-top:10px}
.wa-cmpc{position:relative;overflow:hidden;display:flex;flex-direction:column;gap:14px;padding:24px;border-radius:28px;background:#FFFFFF8C;transition:transform .35s cubic-bezier(.2,.7,.2,1)}
.wa-cmpc>:not(.wa-glow){position:relative}
.wa-cmpc__ic{width:46px;height:46px;border-radius:15px;background:var(--navy);color:#fff;display:grid;place-items:center}
.wa-cmpc h3{margin:0;font-size:18px;line-height:1.6;font-weight:900}
.wa-cmpc__fit{display:flex;flex-direction:column;gap:2px;padding:10px 12px;border-radius:14px;background:#03A1FB12}
.wa-cmpc__fit span{font-size:11.5px;font-weight:700;color:#0369AD}
.wa-cmpc__fit b{font-size:14px;line-height:1.8;text-wrap:pretty}
.wa-cmpc__rows{margin:0;display:flex;flex-direction:column}
.wa-cmpc__rows>div{display:flex;flex-direction:column;gap:6px;padding:12px 0;border-top:1px solid #0E1B2E0F}
.wa-cmpc dt{font-size:12px;font-weight:700;color:#0E1B2EA6}
.wa-cmpc dd{margin:0;font-size:14.5px;line-height:1.8;font-weight:700;text-wrap:pretty}
.wa-cmpc--hl{background:linear-gradient(165deg,#0378C6,#0270BA 55%,#025A9A);border:1px solid #FFFFFF59;box-shadow:0 40px 70px -34px #0391E6;color:#fff;backdrop-filter:none;-webkit-backdrop-filter:none}
.wa-cmpc--hl .wa-cmpc__ic{background:#FFFFFF2E}
.wa-cmpc--hl .wa-cmpc__fit{background:#FFFFFF24}
.wa-cmpc--hl .wa-cmpc__fit span,.wa-cmpc--hl dt{color:#FFFFFFDB}
.wa-cmpc--hl .wa-cmpc__rows>div{border-top-color:#FFFFFF26}

/* ---- 08 case studies (blurred under .vt-soon) ---- */
.wa-cases{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,320px),1fr));gap:16px}
.wa-case{display:flex;flex-direction:column;border-radius:26px;overflow:hidden;background:#FFFFFF8C;border:1px solid #FFFFFFD9;box-shadow:inset 0 1px 0 #fff,0 20px 50px -34px #1E3A5F66}
.wa-case__vis{padding:20px 20px 0;background:linear-gradient(160deg,#EAF6FF,#FDF1E8)}
.wa-dev{border-radius:12px 12px 0 0;overflow:hidden;background:#fff;box-shadow:0 -10px 30px -20px #1E3A5F66}
.wa-dev__bar{display:flex;gap:6px;padding:9px 12px;background:#F4F7FB;border-bottom:1px solid #E3EBF3}
.wa-dev__bar i{width:8px;height:8px;border-radius:50%;background:#FF6B5F}
.wa-dev__bar i:nth-child(2){background:#FDBC2E}
.wa-dev__bar i:nth-child(3){background:#28C840}
.wa-dev__scr{position:relative;aspect-ratio:16/10;background:#E8EEF5}
.wa-dev__ph{position:absolute;inset:10px;border:1.5px dashed #0E1B2E33;border-radius:6px;display:grid;place-items:center;text-align:center;color:#0E1B2EA6;font-size:12.5px;font-weight:700}
.wa-case__tx{display:flex;flex-direction:column;gap:12px;padding:22px}
.wa-case__tx h3{margin:0;font-size:17px;line-height:1.7;font-weight:900}
.wa-case__tx dl{margin:0;display:flex;flex-direction:column;gap:8px}
.wa-case__tx dl>div{display:grid;grid-template-columns:64px minmax(0,1fr);gap:10px;font-size:14px;line-height:1.9}
.wa-case__tx dt{font-weight:800}
.wa-case__tx dd{margin:0;color:#0E1B2EB3}
.wa-case__c{color:#9A5530}
.wa-case__s{color:#0369AD}
.wa-case__r{color:#0B7A40}

/* ---- 09 cost ---- */
.wa-cost{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,440px),1fr));gap:clamp(28px,4vw,56px);align-items:start}
.wa-cost__main{display:flex;flex-direction:column;gap:24px;min-width:0}
.wa-costs{margin:0;padding:0;list-style:none;display:flex;flex-direction:column;gap:8px}
.wa-costs li{display:flex;flex-direction:column;gap:6px;padding:16px 18px;border-radius:18px;background:#FFFFFF80;border:1px solid #FFFFFFD9}
.wa-costs__hd{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap}
.wa-costs__k{font-size:15.5px;font-weight:800}
.wa-costs p{margin:0;font-size:14px;line-height:1.9;color:#0E1B2EA6;text-wrap:pretty}
.wa-lv{--dot:#0391E6;flex:none;white-space:nowrap;display:inline-flex;align-items:center;gap:8px;padding:4px 11px;border-radius:999px;background:#03A1FB1A;color:#0369AD;font-size:12.5px;font-weight:800}
.wa-lv--hi{--dot:#F2894A;background:#F2894A26;color:#9A5530}
.wa-lv--mh{--dot:#F2894A;background:#F2894A1A;color:#9A5530}
.wa-lv--on{--dot:var(--navy);background:#0E1B2E0D;color:var(--navy)}
.wa-lv__d{display:flex;gap:2px}
.wa-lv__d i{width:5px;height:10px;border-radius:2px;background:var(--dot);opacity:.25}
.wa-lv__d i.on{opacity:1}
.wa-lv__d i.half{opacity:.5}
.wa-est{position:sticky;top:96px;min-width:0;border-radius:30px;background:#fff;border:1px solid #E3EBF3;box-shadow:0 30px 70px -36px #1E3A5F73;overflow:hidden}
.wa-eform{display:flex;flex-direction:column}
.wa-eform__hd{padding:clamp(22px,2.8vw,30px) clamp(22px,3vw,32px);background:#F7F9FC;border-bottom:1px solid #E3EBF3}
.wa-eform__hd p{margin:0;font-size:18px;line-height:1.7;font-weight:900;text-wrap:balance}
.wa-eform__body{padding:clamp(22px,3vw,32px);display:flex;flex-direction:column;gap:14px}
.wa-sel{position:relative}
.wa-select{appearance:none;-webkit-appearance:none;padding-left:40px;cursor:pointer}
.wa-sel svg{position:absolute;left:16px;top:19px;pointer-events:none;color:#0E1B2EA6}
.wa-nocommit{margin:0;display:flex;align-items:center;justify-content:center;gap:8px;font-size:13px;font-weight:700;color:#0B7A40}

/* ---- 10 technologies ---- */
.wa-tech{align-items:center}
.wa-techs{margin:0;padding:0;list-style:none;display:flex;flex-wrap:wrap;justify-content:center;gap:10px;max-width:900px}
.wa-techs li{display:flex;align-items:center;gap:10px;height:56px;padding:0 20px;border-radius:18px;background:#FFFFFFB3;border:1px solid #fff;box-shadow:0 14px 30px -24px #1E3A5F66;font-size:15px;font-weight:800}
.wa-techs__ab{width:26px;height:26px;border-radius:8px;color:#fff;display:grid;place-items:center;font-size:11px;font-weight:900;font-family:ui-monospace,monospace}
.wa-techs__ab--1{background:#0391E6}.wa-techs__ab--2{background:#0FA958}.wa-techs__ab--3{background:#E5533D}.wa-techs__ab--4{background:#3C873A}
.wa-techs__ab--5{background:#0C4B33}.wa-techs__ab--6{background:#336791}.wa-techs__ab--7{background:#1D63ED}.wa-techs__ab--8{background:#5A0FC8}

/* ---- breakpoints ---- */
@media (min-width:860px){
  .wa-cmp{grid-template-columns:repeat(3,minmax(0,1fr))}
  .wa-cmpc--hl{transform:translateY(-10px)}
}
@media (max-width:767px){.wa-bar{display:none}}

@media (prefers-reduced-motion:reduce){
  .wa *,.wa *::before,.wa *::after{animation:none!important;transition:none!important}
  .wa-bar{display:none}
  .wa-marq__track{flex-wrap:wrap;width:auto;justify-content:center}
  .wa-marq__it[aria-hidden="true"]{display:none}
}
