:root{
--bg:#0B1414;
--bg-2:#0E1818;
--surface:#121C1D;
--surface-2:#1A2526;
--border:#1F2D2E;
--border-2:#2A3C3D;
--mint:#5EEAD4;
--ink:#E8ECEB;
--ink-dim:#9CA3AF;
--ink-faint:#6B7778;
--radius-pill:999px;
--radius-card:18px;
--radius-btn:12px;
--max:1200px;
}
*{box-sizing:border-box}
html,body{margin:0;padding:0}
body{
background:var(--bg);
color:var(--ink);
font-family:'Manrope',system-ui,-apple-system,sans-serif;
font-feature-settings:"ss01","cv11";
-webkit-font-smoothing:antialiased;
text-rendering:optimizeLegibility;
overflow-x:hidden;
}
.screen{position:relative;min-height:100vh;display:flex;flex-direction:column;padding:clamp(24px,4vw,56px) clamp(20px,4vw,64px);isolation:isolate;overflow:hidden}
.screen::before{content:"";position:absolute;inset:0;background-image:linear-gradient(to right, rgba(232,236,235,0.035) 1px, transparent 1px),linear-gradient(to bottom, rgba(232,236,235,0.035) 1px, transparent 1px);background-size:56px 56px;mask-image:radial-gradient(ellipse 90% 80% at 50% 50%, #000 30%, transparent 85%);-webkit-mask-image:radial-gradient(ellipse 90% 80% at 50% 50%, #000 30%, transparent 85%);z-index:-2}
.screen::after{content:"";position:absolute;inset:0;background-image:radial-gradient(rgba(94,234,212,0.06) 1px, transparent 1px);background-size:28px 28px;opacity:.5;z-index:-2}
.glow{position:absolute;width:720px;height:720px;border-radius:50%;filter:blur(80px);opacity:.55;z-index:-3;pointer-events:none}
.glow.tl{top:-280px;left:-240px;background:radial-gradient(circle, #1A3A36 0%, transparent 65%)}
.glow.br{bottom:-320px;right:-260px;background:radial-gradient(circle, #143028 0%, transparent 65%)}
.glow.tr{top:-300px;right:-220px;background:radial-gradient(circle, #1A3A36 0%, transparent 65%)}
.glow.bl{bottom:-340px;left:-280px;background:radial-gradient(circle, #143028 0%, transparent 65%)}
.glow.c{top:50%;left:50%;transform:translate(-50%,-50%);width:900px;height:900px;background:radial-gradient(circle, #103028 0%, transparent 60%);opacity:.45}
.nav{display:flex;align-items:center;justify-content:space-between;max-width:var(--max);width:100%;margin:0 auto}
.nav__logo{height:28px;opacity:.95}
.nav__right{display:flex;align-items:center;gap:22px;color:var(--ink-dim);font-size:14px;font-weight:500;letter-spacing:.01em}
.nav__dot{width:6px;height:6px;border-radius:50%;background:var(--mint);box-shadow:0 0 10px var(--mint)}
.nav__status{display:flex;align-items:center;gap:8px;font-family:'JetBrains Mono',monospace;font-size:11px;letter-spacing:.08em;text-transform:uppercase;color:var(--ink-faint)}
.pill{display:inline-flex;align-items:center;gap:10px;padding:8px 16px;border-radius:var(--radius-pill);background:rgba(94,234,212,0.08);border:1px solid rgba(94,234,212,0.25);color:var(--mint);font-family:'JetBrains Mono',monospace;font-size:11px;font-weight:500;letter-spacing:.14em;text-transform:uppercase}
.pill .dot{width:6px;height:6px;border-radius:50%;background:var(--mint);box-shadow:0 0 12px var(--mint);animation:pulse 2.4s ease-in-out infinite}
@keyframes pulse{0%,100%{opacity:1}50%{opacity:.45}}
.btn{display:inline-flex;align-items:center;gap:10px;border-radius:var(--radius-btn);font-family:inherit;font-size:15px;font-weight:600;letter-spacing:.005em;cursor:pointer;transition:transform .18s ease, background .2s, border-color .2s, box-shadow .2s;border:1px solid transparent;text-decoration:none;line-height:1}
.btn--primary{background:var(--mint);color:#0B1414;box-shadow:0 0 0 1px rgba(94,234,212,0.6), 0 18px 40px -18px rgba(94,234,212,0.65), inset 0 -2px 0 rgba(0,0,0,0.08)}
.btn--secondary{background:var(--surface-2);color:var(--ink);border-color:var(--border-2)}
.btn--lg{padding:20px 34px;font-size:16px}
.btn__arrow{width:16px;height:16px;display:inline-block}
.hero{justify-content:center}
.hero__inner{max-width:var(--max);width:100%;margin:0 auto;display:flex;flex-direction:column;align-items:center;text-align:center;gap:32px;padding:clamp(24px,6vh,80px) 0}
.hero h1{margin:0;font-size:clamp(40px,6.5vw,84px);font-weight:700;line-height:1.04;letter-spacing:-0.035em;max-width:14ch;text-wrap:balance}
.hero h1 .mint{color:var(--mint)}
.hero h1 .fade{color:var(--ink-dim)}
.hero__sub{margin:0;font-size:clamp(16px,1.35vw,19px);line-height:1.55;color:var(--ink-dim);max-width:56ch;text-wrap:pretty}
.hero__cta{display:flex;gap:14px;flex-wrap:wrap;justify-content:center;margin-top:8px}
.hero__meta{display:flex;align-items:center;gap:32px;flex-wrap:wrap;justify-content:center;color:var(--ink-faint);font-family:'JetBrains Mono',monospace;font-size:11px;letter-spacing:.14em;text-transform:uppercase;margin-top:16px}
.hero__meta .sep{width:4px;height:4px;border-radius:50%;background:var(--ink-faint);opacity:.5}
.engines{max-width:var(--max);width:100%;margin:0 auto;padding-top:28px;border-top:1px solid var(--border);display:flex;align-items:center;justify-content:space-between;gap:24px;flex-wrap:wrap}
.engines__label{font-family:'JetBrains Mono',monospace;font-size:11px;letter-spacing:.16em;text-transform:uppercase;color:var(--ink-faint);display:flex;align-items:center;gap:10px}
.engines__label::before{content:"";width:24px;height:1px;background:var(--border-2)}
.engines__list{display:flex;align-items:center;gap:36px;flex-wrap:wrap}
.engine{display:flex;align-items:center;gap:10px;color:var(--ink-dim);font-size:14px;font-weight:500;letter-spacing:-0.005em}
.engine__dot{width:7px;height:7px;border-radius:50%;background:var(--mint);opacity:.85;box-shadow:0 0 8px rgba(94,234,212,.6)}
.engine--muted .engine__dot{background:#3A4D4E;box-shadow:none}
.problem{justify-content:center}
.problem__inner{max-width:var(--max);width:100%;margin:0 auto;display:flex;flex-direction:column;gap:56px}
.stack-center{display:flex;flex-direction:column;gap:20px;align-items:center}
.eyebrow{display:flex;align-items:center;gap:12px;justify-content:center;font-family:'JetBrains Mono',monospace;font-size:11px;letter-spacing:.18em;text-transform:uppercase;color:var(--ink-faint)}
.eyebrow::before,.eyebrow::after{content:"";width:48px;height:1px;background:var(--border-2)}
.section-title{margin:0;text-align:center;font-size:clamp(32px,4.2vw,56px);font-weight:700;line-height:1.08;letter-spacing:-0.03em;text-wrap:balance}
.section-title .strike{position:relative;color:var(--ink-dim)}
.section-title .strike::after{content:"";position:absolute;left:-2%;right:-2%;top:54%;height:2px;background:var(--mint)}
.section-title em{font-style:normal;color:var(--mint)}
.stats{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}
.stat{position:relative;background:linear-gradient(180deg, rgba(26,37,38,0.6) 0%, rgba(18,28,29,0.4) 100%);border:1px solid var(--border);border-radius:var(--radius-card);padding:36px 32px 30px;min-height:260px;display:flex;flex-direction:column;justify-content:space-between;gap:24px;overflow:hidden;transition:border-color .25s, transform .25s}
.stat:hover{border-color:rgba(94,234,212,0.35);transform:translateY(-2px)}
.stat__tag{display:flex;align-items:center;justify-content:space-between;font-family:'JetBrains Mono',monospace;font-size:11px;letter-spacing:.16em;text-transform:uppercase;color:var(--ink-faint)}
.stat__tag .num{color:var(--mint)}
.stat__num{font-size:clamp(64px,8vw,108px);font-weight:700;line-height:0.95;letter-spacing:-0.05em;color:var(--mint);font-variant-numeric:tabular-nums}
.stat__num .unit{font-size:0.45em;color:var(--ink-dim);font-weight:500;margin-left:4px;letter-spacing:-0.02em}
.stat__caption{color:var(--ink-dim);font-size:15px;line-height:1.5;max-width:32ch;text-wrap:pretty}
.stat__viz{position:absolute;right:-20px;bottom:-20px;width:180px;height:120px;opacity:.5;pointer-events:none}
.problem__note{text-align:center;color:var(--ink);font-size:clamp(18px,1.6vw,22px);font-weight:500;line-height:1.5;max-width:62ch;margin:0 auto;text-wrap:balance}
.problem__note .hl{color:var(--mint)}
.solution{justify-content:center;gap:72px}
.solution__inner{max-width:var(--max);width:100%;margin:0 auto;display:flex;flex-direction:column;gap:56px}
.services{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}
.service{position:relative;background:var(--surface);border:1px solid var(--border);border-radius:var(--radius-card);padding:32px 28px;display:flex;flex-direction:column;gap:20px;min-height:260px;transition:border-color .25s, transform .25s, background .25s}
.service:hover{border-color:rgba(94,234,212,0.35);transform:translateY(-2px);background:#13201F}
.service__step{display:flex;align-items:center;justify-content:space-between;font-family:'JetBrains Mono',monospace;font-size:11px;letter-spacing:.16em;text-transform:uppercase;color:var(--ink-faint)}
.service__icon{width:48px;height:48px;display:flex;align-items:center;justify-content:center;border-radius:12px;background:rgba(94,234,212,0.08);border:1px solid rgba(94,234,212,0.22);color:var(--mint)}
.service__icon svg{width:24px;height:24px;display:block}
.service h3{margin:0;font-size:20px;font-weight:600;letter-spacing:-0.015em;color:var(--ink)}
.service p{margin:0;font-size:15px;line-height:1.5;color:var(--ink-dim);text-wrap:pretty}
.service__foot{margin-top:auto;display:flex;align-items:center;gap:8px;color:var(--mint);font-size:13px;font-weight:500;letter-spacing:-0.005em;opacity:.8;transition:opacity .25s, gap .25s}
.service:hover .service__foot{opacity:1;gap:12px}
.quote{display:flex;align-items:center;gap:20px;background:linear-gradient(90deg, rgba(94,234,212,0.06), rgba(94,234,212,0.02));border:1px solid rgba(94,234,212,0.18);border-radius:var(--radius-pill);padding:14px 22px 14px 18px;margin:0 auto;max-width:fit-content;flex-wrap:wrap;justify-content:center}
.quote__badge{display:inline-flex;align-items:center;gap:8px;padding:6px 10px;border-radius:var(--radius-pill);background:rgba(94,234,212,0.12);color:var(--mint);font-family:'JetBrains Mono',monospace;font-size:10px;letter-spacing:.16em;text-transform:uppercase}
.quote__text{color:var(--ink);font-size:15px;line-height:1.4;font-weight:500}
.quote__num{color:var(--mint);font-weight:700}
.final{position:relative;text-align:center;background:radial-gradient(ellipse at center top, rgba(94,234,212,0.07), transparent 60%);border-top:1px solid var(--border);padding:72px 24px 48px;display:flex;flex-direction:column;align-items:center;gap:24px}
.final h2{margin:0;font-size:clamp(36px,5vw,68px);font-weight:700;line-height:1.05;letter-spacing:-0.035em;text-wrap:balance}
.final h2 em{font-style:normal;color:var(--mint)}
.final__sub{color:var(--ink-dim);font-size:16px;max-width:50ch;text-wrap:pretty;margin:0}
.final__cta{display:flex;gap:14px;flex-wrap:wrap;justify-content:center;margin-top:12px}
.final__meta{display:flex;align-items:center;gap:24px;flex-wrap:wrap;justify-content:center;color:var(--ink-faint);font-family:'JetBrains Mono',monospace;font-size:11px;letter-spacing:.16em;text-transform:uppercase;margin-top:16px}
.final__meta .sep{width:4px;height:4px;border-radius:50%;background:var(--ink-faint);opacity:.5}
.foot{max-width:var(--max);width:100%;margin:0 auto;padding:28px 0 0;border-top:1px solid var(--border);display:flex;align-items:center;justify-content:space-between;gap:16px;flex-wrap:wrap;color:var(--ink-faint);font-family:'JetBrains Mono',monospace;font-size:11px;letter-spacing:.14em;text-transform:uppercase}
.foot__logo{height:16px;opacity:.65}
.foot a{color:var(--ink-dim);text-decoration:none;transition:color .2s}
.foot a:hover{color:var(--mint)}
.foot__right{display:flex;gap:24px;align-items:center}
.progress{position:fixed;top:0;left:0;right:0;height:2px;z-index:50;background:transparent;pointer-events:none}
.progress__bar{height:100%;background:var(--mint);width:0%;transition:width .1s linear;box-shadow:0 0 12px var(--mint)}
.rail{position:fixed;right:22px;top:50%;transform:translateY(-50%);display:flex;flex-direction:column;gap:14px;z-index:30}
.rail a{display:flex;align-items:center;gap:10px;color:var(--ink-faint);font-family:'JetBrains Mono',monospace;font-size:10px;letter-spacing:.18em;text-transform:uppercase;text-decoration:none;white-space:nowrap;transition:color .2s}
.rail a .mark{width:18px;height:1px;background:currentColor;transition:width .25s,background .25s}
.rail a.active{color:var(--mint)}
.rail a.active .mark{width:32px;background:var(--mint)}
.rail a:hover{color:var(--ink)}
@media (max-width:880px){.stats,.services{grid-template-columns:1fr}.rail{display:none}.nav__right{display:none}} .popup{
width:min(720px, calc(100vw - 24px));
border:1px solid #2A3C3D;
border-radius:16px;
padding:28px;
background:#121C1D;
color:#E8ECEB;
}
.popup::backdrop{background:rgba(0,0,0,.65)}
.popup__title{margin:0 0 14px;font-size:clamp(24px,3vw,36px);line-height:1.1}
.popup__form .wpcf7-form{display:grid;gap:12px}
.popup__form .wpcf7-form p{margin:0}
.popup__form .wpcf7-form-control-wrap{display:block;width:100%}
.popup__form input,.popup__form textarea{
width:100%;
background:#0E1818;
border:1px solid #2A3C3D;
border-radius:10px;
color:#E8ECEB;
padding:12px 14px;
font:inherit;
}
.popup__form input::placeholder,.popup__form textarea::placeholder{color:#9CA3AF}
.popup__form .wpcf7-form-control:not(.wpcf7-submit):not(.wpcf7-acceptance){width:100%}
.popup__form .wpcf7-submit{
background:#5EEAD4;
color:#0B1414;
border:0;
border-radius:12px;
padding:14px 18px;
font-weight:700;
cursor:pointer;
width:100%;
}
.popup__form .form__btn{width:100%}
.popup__form .form__submit{margin-top:16px;width:100%}
.popup__form .wpcf7-not-valid-tip{
margin-top:6px;
font-size:12px;
color:#FF3F3F;
}
.popup__form .wpcf7-response-output{
display:none !important;
} .f-button.is-close-button {
--f-close-button-width: 2rem;
--f-close-button-height: 2rem;
--f-close-button-svg-stroke-width: 0.3125rem;
--f-close-button-svg-width: 1.25rem;
--f-close-button-svg-height: 1.25rem;
--f-close-border-radius: 0;
--f-close-button-color: #7c8698;
--f-close-button-hover-color: #000;
top: 1.875rem;
right: 2rem;
}
.f-button.is-close-button path { stroke-linecap: square; }
.popup {
display: none;
flex-direction: column;
background-color: #fff;
color: #192A3F;
border-radius: 1rem;
max-width: 100%;
width: 100%;
max-width: 32.3125rem;
padding: 2rem;
cursor: default;
}
.popup__form { margin-top: 2rem; }
.gradient-text {
background: linear-gradient(105deg, #272727 25.41%, #2CDACC 221.5%);
background-clip: text;
-webkit-background-clip: text;
-webkit-text-fill-color: transparent;
width: fit-content;
padding-block: 0.125rem;
}
.title-sm { font-weight: 800; line-height: 100%; font-size: 1.75rem; }
.form__fields { display: flex; flex-direction: column; gap: 1rem; }
.form__field { display: flex; flex-direction: column; align-items: flex-start; gap: 0.375rem; position: relative; }
.form__field-label { font-size: 0.875rem; font-weight: 600; line-height: 100%; display: block; }
.form__field .wpcf7-form-control-wrap { width: 100%; display: block; }
.form__field .wpcf7-form-control-wrap .iti { width: 100%; }
.form__control {
transition: border-color .3s ease, color .3s ease, box-shadow .3s ease, background-color .3s ease;
width: 100%;
border-radius: .5rem;
border: .0625rem solid #E8E8E8;
background: #FFF;
color: #000;
font-size: 1rem;
padding: 1rem;
caret-color: #16eedc;
}
.form__control::placeholder { color: #7C8698; opacity: 1; }
.form__control:focus { border-color: #16eedc; box-shadow: inset 0 0 0 .0625rem #16eedc; }
.form__control.wpcf7-not-valid { border-color: #FF3F3F; }
.form__control:is(textarea) { resize: none; height: 7.5rem; font-size: 1rem; }
.form__submit { position: relative; margin-top: 2.5rem; cursor: pointer; width: 100%; }
.form__submit input {
background: transparent;
color: inherit;
cursor: pointer;
width: 100%;
font-weight: 700;
font-size: 1.125rem;
font-family: "SFProDisplay", "Manrope", sans-serif;
}
.form__submit .wpcf7-spinner { display: none; }
.form__checkbox .wpcf7-list-item { margin-left: 0; }
.form__checkbox .wpcf7-list-item-label {
line-height: 1.5625;
display: flex;
align-items: center;
gap: 1em;
user-select: none;
cursor: pointer;
font-size: .75rem;
}
.form__checkbox .wpcf7-list-item-label::before {
content: "";
border-radius: .25rem;
border: .0625rem solid #E8E8E8;
background: #FFF;
width: 1.5625rem;
height: 1.5625rem;
flex-shrink: 0;
align-self: flex-start;
display: flex;
justify-content: center;
align-items: center;
}
.wpcf7-response-output { display: none !important; }
.wpcf7-not-valid-tip { margin-top: .25em; text-align: left; color: #FF3F3F; } .popup .popup__title.title-sm{
font-family:"SFProDisplay","Manrope",sans-serif;
font-size:1.75rem;
font-weight:800;
line-height:1;
letter-spacing:-0.02em;
margin-bottom:0;
}
.popup .form__field-label{
font-size:0.875rem;
line-height:1;
color:#27354B;
font-weight:700;
}
.popup .form__control{
border-color:#D6D6D6;
color:#27354B;
}
.popup .form__control::placeholder{ color:#7C8698; }
.popup .form__checkbox-input.hidden{
position:absolute !important;
opacity:0 !important;
width:1px !important;
height:1px !important;
margin:0 !important;
pointer-events:none !important;
}
.popup .form__checkbox .wpcf7-list-item-label{
align-items:center;
gap:1rem;
color:#27354B;
font-size:.75rem;
}
.popup .form__submit.btn.btn-secondary{
background:#9BB1CF;
color:#fff;
border:0;
border-radius:.625rem;
}
.popup .form__submit.btn.btn-secondary .wpcf7-submit{
color:#fff;
font-family:"SFProDisplay","Manrope",sans-serif;
}
.popup .form__submit:has(.wpcf7-submit[disabled]){
opacity:1;
cursor:not-allowed;
}
.popup .form__submit.btn.btn-secondary:not(:has(.wpcf7-submit[disabled])) {
background:#16EEDC;
color:#192A3F;
}
.popup .form__submit.btn.btn-secondary:not(:has(.wpcf7-submit[disabled])) .wpcf7-submit{
color:#192A3F;
} #get-proposal .popup__form input,
#get-proposal .popup__form textarea,
#get-proposal .popup__form .form__control{
background:#FFF !important;
color:#27354B !important;
border:.0625rem solid #D6D6D6 !important;
box-shadow:none !important;
}
#get-proposal .popup__form .form__control:focus{
border-color:#D6D6D6 !important;
box-shadow:none !important;
}
#get-proposal .form__submit.btn.btn-secondary{
background:#9BB1CF !important;
color:#FFF !important;
}
#get-proposal .form__submit.btn.btn-secondary .wpcf7-submit{
background:#9BB1CF !important;
color:#FFF !important;
border:0 !important;
box-shadow:none !important;
border-radius:.625rem !important;
min-height:4.25rem !important;
}
#get-proposal .form__submit.btn.btn-secondary:not(:has(.wpcf7-submit[disabled])){
background:transparent !important;
color:inherit !important;
}
#get-proposal .form__submit.btn.btn-secondary:not(:has(.wpcf7-submit[disabled])) .wpcf7-submit{
background:#16EEDC !important;
color:#192A3F !important;
}
#get-proposal .form__checkbox .wpcf7-list-item input:checked + .wpcf7-list-item-label::before{
background:#16EEDC !important;
border-color:#16EEDC !important;
box-shadow:inset 0 0 0 2px #fff !important;
}
.grecaptcha-badge {
display: none !important;
}