.elementor-290 .elementor-element.elementor-element-d2b62f2{--display:flex;}@media(min-width:768px){.elementor-290 .elementor-element.elementor-element-d2b62f2{--content-width:1600px;}}/* Start custom CSS for html, class: .elementor-element-708f30a */.webdev-hero{

background:#04111d;

padding:140px 7%;

position:relative;

overflow:hidden;

min-height:100vh;

}

.hero-grid{

display:grid;

grid-template-columns:1fr 1fr;

gap:80px;

align-items:center;

}

/* TAG */

.hero-tag{

display:inline-block;

padding:12px 22px;

border-radius:50px;

background:rgba(255,86,86,.08);

border:1px solid rgba(255,86,86,.15);

color:#ff5656;

font-size:12px;

font-weight:700;

letter-spacing:2px;

margin-bottom:25px;

}

/* TITLE */

.hero-title{

display:flex;

flex-direction:column;

font-size:84px;

font-weight:800;

line-height:.95;

margin-bottom:30px;

}

.hero-title span{

color:white;

opacity:0;

transform:translateY(50px);

animation:titleReveal .8s forwards;

}

.hero-title span:nth-child(2){

animation-delay:.2s;

}

.hero-title span:nth-child(3){

animation-delay:.4s;

}

.hero-title span:nth-child(4){

animation-delay:.6s;

}

.gradient-text{

background:linear-gradient(
135deg,
#ff5656,
#ff3f84
);

-webkit-background-clip:text;

-webkit-text-fill-color:transparent;

}

.hero-desc{

font-size:18px;

line-height:1.9;

color:#cfd8e3;

margin-bottom:40px;

max-width:650px;

}

/* BUTTONS */

.hero-buttons{

display:flex;

gap:18px;

flex-wrap:wrap;

}

.hero-btn{

padding:18px 34px;

border-radius:60px;

font-weight:700;

text-decoration:none;

transition:.4s;

}

.primary-btn{

background:linear-gradient(
135deg,
#ff5656,
#ff3f84
);

color:#fff !important;

}

.secondary-btn{

border:1px solid rgba(255,255,255,.15);

color:#fff;

}

.primary-btn:hover{

transform:translateY(-5px);

}

.secondary-btn:hover{

background:rgba(255,255,255,.05);

}

/* BLUEPRINT */

.blueprint-area{

position:relative;

height:650px;

display:flex;

align-items:center;

justify-content:center;

}

.blueprint-grid{

position:absolute;

inset:0;

background-image:

linear-gradient(
rgba(255,255,255,.05) 1px,
transparent 1px
),

linear-gradient(
90deg,
rgba(255,255,255,.05) 1px,
transparent 1px
);

background-size:40px 40px;

animation:gridMove 12s linear infinite;

}

.website-frame{

width:420px;

height:520px;

border:2px solid rgba(255,255,255,.15);

padding:20px;

display:flex;

flex-direction:column;

gap:14px;

position:relative;

z-index:2;

}

.section{

background:rgba(255,255,255,.08);

border-radius:10px;

opacity:0;

animation:buildSite 6s infinite;

}

.hero-block{

height:100px;

animation-delay:.5s;

}

.content-block{

height:70px;

animation-delay:1.5s;

}

.footer-block{

height:50px;

animation-delay:3s;

}

/* FLOATING LABELS */

.floating-tag{

position:absolute;

padding:12px 18px;

background:rgba(255,255,255,.05);

border:1px solid rgba(255,255,255,.08);

border-radius:50px;

font-size:12px;

color:white;

backdrop-filter:blur(20px);

}

.tag-1{top:10%;left:0;animation:floatTag 6s infinite;}
.tag-2{top:20%;right:0;animation:floatTag 7s infinite;}
.tag-3{top:55%;left:-20px;animation:floatTag 8s infinite;}
.tag-4{top:70%;right:-10px;animation:floatTag 6s infinite;}
.tag-5{bottom:10%;left:20%;animation:floatTag 7s infinite;}
.tag-6{bottom:5%;right:20%;animation:floatTag 8s infinite;}

/* ANIMATIONS */

@keyframes titleReveal{

to{

opacity:1;

transform:translateY(0);

}

}

@keyframes buildSite{

0%{

opacity:0;

transform:scaleX(0);

}

20%,100%{

opacity:1;

transform:scaleX(1);

}

}

@keyframes floatTag{

50%{

transform:translateY(-12px);

}

}

@keyframes gridMove{

100%{

transform:translateY(40px);

}

}

/* TABLET */

@media(max-width:991px){

.hero-grid{

grid-template-columns:1fr;

gap:60px;

}

.hero-title{

font-size:52px;

}

.blueprint-area{

height:500px;

}

}

/* MOBILE */

@media(max-width:576px){

.webdev-hero{

padding:90px 20px;

}

.hero-title{

font-size:40px;

}

.hero-buttons{

flex-direction:column;

}

.hero-btn{

width:100%;

text-align:center;

}

.blueprint-area{

height:350px;

}

.website-frame{

max-width:280px;

height:320px;

margin:auto;

}

padding:12px;

gap:8px;

}

.hero-block{

height:60px;

}

.content-block{

height:40px;

}

.footer-block{

height:30px;

}

@media(max-width:767px){

.floating-tag{

display:none !important;

}

}/* End custom CSS */
/* Start custom CSS for html, class: .elementor-element-3a659c6 */.architecture-lab{

padding:160px 7%;

background:#05111d;

position:relative;

overflow:hidden;

}

/* HEADER */

.arch-header{

max-width:850px;

margin:auto;

text-align:center;

margin-bottom:100px;

}

.arch-tag{

display:inline-block;

padding:12px 20px;

border-radius:50px;

background:rgba(255,86,86,.08);

border:1px solid rgba(255,86,86,.15);

color:#ff5656;

font-size:12px;

letter-spacing:2px;

font-weight:700;

margin-bottom:25px;

}

.arch-header h2{

font-size:72px;

line-height:1;

color:#fff;

margin-bottom:25px;

}

.arch-header p{

font-size:18px;

line-height:1.9;

color:#cfd8e3;

}

/* SYSTEM */

.architecture-system{

position:relative;

height:800px;

max-width:900px;

margin:auto;

}

/* CORE */

.architecture-core{

position:absolute;

left:50%;

top:50%;

transform:translate(-50%,-50%);

width:260px;

height:260px;

border-radius:50%;

display:flex;

align-items:center;

justify-content:center;

}

.core-pulse{

position:absolute;

inset:0;

border-radius:50%;

background:linear-gradient(
135deg,
#ff5656,
#ff3f84
);

animation:pulseCore 4s infinite;

filter:blur(15px);

opacity:.6;

}

.core-content{

position:relative;

z-index:2;

width:200px;

height:200px;

border-radius:50%;

background:#081420;

display:flex;

align-items:center;

justify-content:center;

text-align:center;

font-size:24px;

font-weight:800;

color:white;

line-height:1.2;

border:1px solid rgba(255,255,255,.1);

}

/* LAYERS */

.layer{

position:absolute;

padding:18px 24px;

background:rgba(255,255,255,.04);

border:1px solid rgba(255,255,255,.08);

border-radius:50px;

color:white;

font-size:14px;

font-weight:700;

backdrop-filter:blur(20px);

animation:floatLayer 6s infinite ease-in-out;

}

.ux{

top:10%;

left:10%;

}

.ui{

top:15%;

right:10%;

animation-delay:1s;

}

.dev{

top:50%;

left:0;

animation-delay:2s;

}

.speed{

top:50%;

right:0;

animation-delay:3s;

}

.seo{

bottom:15%;

left:15%;

animation-delay:4s;

}

.conv{

bottom:10%;

right:15%;

animation-delay:5s;

}

/* CONNECTING LINES */

.layer:before{

content:'';

position:absolute;

width:120px;

height:1px;

background:linear-gradient(
90deg,
transparent,
rgba(255,86,86,.5)
);

top:50%;

}

.ux:before{

right:-120px;

}

.ui:before{

left:-120px;

}

.dev:before{

right:-120px;

}

.speed:before{

left:-120px;

}

.seo:before{

right:-120px;

}

.conv:before{

left:-120px;

}

/* SCAN */

.scan-line{

position:absolute;

left:0;

width:100%;

height:2px;

background:linear-gradient(
90deg,
transparent,
#ff5656,
transparent
);

box-shadow:0 0 20px #ff5656;

animation:scanMove 6s linear infinite;

}

/* ANIMATION */

@keyframes pulseCore{

50%{

transform:scale(1.15);

opacity:.9;

}

}

@keyframes floatLayer{

50%{

transform:translateY(-15px);

}

}

@keyframes scanMove{

0%{

top:0;

}

100%{

top:100%;

}

}

/* TABLET */

@media(max-width:991px){

.arch-header h2{

font-size:50px;

}

.architecture-system{

height:700px;

}

}

/* MOBILE */

@media(max-width:767px){

.architecture-lab{

padding:90px 20px;

}

.arch-header h2{

font-size:38px;

}

.arch-header p{

font-size:16px;

}

.architecture-system{

height:auto;

display:flex;

flex-direction:column;

gap:20px;

}

.architecture-core{

position:relative;

left:auto;

top:auto;

transform:none;

margin:auto;

width:220px;

height:220px;

}

.layer{

position:relative;

top:auto !important;

left:auto !important;

right:auto !important;

bottom:auto !important;

width:100%;

text-align:center;

animation:none;

}

.layer:before{

display:none;

}

.scan-line{

display:none;

}

}/* End custom CSS */
/* Start custom CSS for html, class: .elementor-element-7d185d2 */.journey-simulator{

padding:160px 7%;

background:#04111d;

position:relative;

overflow:hidden;

}

/* HEADER */

.journey-header{

max-width:850px;

margin:auto;

text-align:center;

margin-bottom:100px;

}

.journey-tag{

display:inline-block;

padding:12px 20px;

border-radius:50px;

background:rgba(255,86,86,.08);

border:1px solid rgba(255,86,86,.15);

color:#ff5656;

font-size:12px;

font-weight:700;

letter-spacing:2px;

margin-bottom:25px;

}

.journey-header h2{

font-size:72px;

line-height:1;

color:#fff;

margin-bottom:25px;

}

.journey-header p{

font-size:18px;

line-height:1.9;

color:#cfd8e3;

}

/* JOURNEY MAP */

.journey-map{

position:relative;

display:grid;

grid-template-columns:repeat(6,1fr);

gap:25px;

align-items:center;

margin-bottom:100px;

}

.journey-line{

position:absolute;

left:5%;

right:5%;

top:50%;

height:4px;

background:rgba(255,255,255,.08);

transform:translateY(-50%);

}

.visitor-dot{

position:absolute;

width:28px;

height:28px;

border-radius:50%;

background:linear-gradient(
135deg,
#ff5656,
#ff3f84
);

box-shadow:
0 0 30px rgba(255,86,86,.7);

animation:travelVisitor 12s linear infinite;

}

/* NODES */

.journey-node{

position:relative;

z-index:2;

padding:40px 25px;

background:rgba(255,255,255,.04);

border:1px solid rgba(255,255,255,.08);

border-radius:24px;

text-align:center;

backdrop-filter:blur(15px);

transition:.4s;

}

.journey-node:hover{

transform:translateY(-10px);

border-color:rgba(255,86,86,.4);

}

.journey-node span{

display:block;

font-size:14px;

font-weight:700;

color:#ff5656;

margin-bottom:15px;

}

.journey-node h3{

font-size:24px;

color:white;

margin-bottom:12px;

}

.journey-node p{

font-size:15px;

line-height:1.8;

color:#cfd8e3;

}

.conversion{

background:
linear-gradient(
135deg,
rgba(255,86,86,.12),
rgba(255,63,132,.08)
);

}

/* RESULTS */

.journey-results{

display:grid;

grid-template-columns:repeat(4,1fr);

gap:20px;

}

.result-item{

padding:25px;

text-align:center;

font-size:22px;

font-weight:700;

color:white;

border-radius:20px;

background:rgba(255,255,255,.03);

border:1px solid rgba(255,255,255,.08);

animation:metricPulse 6s infinite;

}

.result-item:nth-child(2){

animation-delay:1s;

}

.result-item:nth-child(3){

animation-delay:2s;

}

.result-item:nth-child(4){

animation-delay:3s;

}

/* ANIMATIONS */

@keyframes travelVisitor{

0%{

left:0;

}

100%{

left:95%;

}

}

@keyframes metricPulse{

50%{

background:
rgba(255,86,86,.12);

border-color:
rgba(255,86,86,.4);

}

}

/* TABLET */

@media(max-width:991px){

.journey-header h2{

font-size:48px;

}

.journey-map{

grid-template-columns:1fr 1fr;

}

.journey-results{

grid-template-columns:1fr 1fr;

}

}

/* MOBILE */

@media(max-width:767px){

.journey-simulator{

padding:90px 20px;

}

.journey-header h2{

font-size:38px;

}

.journey-header p{

font-size:16px;

}

.journey-map{

grid-template-columns:1fr;

gap:18px;

}

.journey-line,
.visitor-dot{

display:none;

}

.journey-node{

padding:25px;

}

.journey-results{

grid-template-columns:1fr;

}

}/* End custom CSS */
/* Start custom CSS for container, class: .elementor-element-d2b62f2 */.performance-engine{

padding:160px 7%;

background:#04111d;

position:relative;

overflow:hidden;

}

/* HEADER */

.engine-header{

max-width:850px;

margin:auto;

text-align:center;

margin-bottom:120px;

}

.engine-tag{

display:inline-block;

padding:12px 20px;

border-radius:50px;

background:rgba(255,86,86,.08);

border:1px solid rgba(255,86,86,.15);

color:#ff5656;

font-size:12px;

letter-spacing:2px;

font-weight:700;

margin-bottom:25px;

}

.engine-header h2{

font-size:72px;

line-height:1;

color:white;

margin-bottom:25px;

}

.engine-header p{

font-size:18px;

line-height:1.9;

color:#cfd8e3;

}

/* SYSTEM */

.engine-system{

position:relative;

height:900px;

max-width:1000px;

margin:auto;

}

/* CORE */

.engine-core{

position:absolute;

left:50%;

top:50%;

transform:translate(-50%,-50%);

width:260px;

height:260px;

border-radius:50%;

display:flex;

align-items:center;

justify-content:center;

z-index:10;

}

.core-inner{

width:180px;

height:180px;

border-radius:50%;

background:linear-gradient(
135deg,
#ff5656,
#ff3f84
);

display:flex;

align-items:center;

justify-content:center;

text-align:center;

font-size:22px;

font-weight:800;

color:white;

line-height:1.3;

box-shadow:
0 0 60px rgba(255,86,86,.5);

animation:corePulse 4s infinite;

}

/* ENERGY RINGS */

.energy-ring{

position:absolute;

left:50%;

top:50%;

transform:translate(-50%,-50%);

border-radius:50%;

border:1px solid rgba(255,86,86,.15);

}

.ring-1{

width:350px;

height:350px;

animation:rotateRing 18s linear infinite;

}

.ring-2{

width:500px;

height:500px;

animation:rotateRingReverse 25s linear infinite;

}

.ring-3{

width:650px;

height:650px;

animation:rotateRing 35s linear infinite;

}

/* MODULES */

.engine-module{

position:absolute;

width:220px;

padding:28px;

background:rgba(255,255,255,.04);

border:1px solid rgba(255,255,255,.08);

border-radius:24px;

backdrop-filter:blur(20px);

transition:.4s;

}

.engine-module:hover{

transform:translateY(-10px);

border-color:rgba(255,86,86,.4);

}

.engine-module h3{

font-size:22px;

color:white;

margin-bottom:12px;

}

.engine-module p{

color:#cfd8e3;

line-height:1.8;

font-size:15px;

}

/* POSITIONS */

.module-1{

top:0;

left:50%;

transform:translateX(-50%);

}

.module-2{

top:20%;

right:0;

}

.module-3{

bottom:20%;

right:0;

}

.module-4{

bottom:0;

left:50%;

transform:translateX(-50%);

}

.module-5{

bottom:20%;

left:0;

}

.module-6{

top:20%;

left:0;

}

/* ANIMATIONS */

@keyframes corePulse{

50%{

transform:scale(1.1);

box-shadow:
0 0 90px rgba(255,86,86,.8);

}

}

@keyframes rotateRing{

100%{

transform:
translate(-50%,-50%)
rotate(360deg);

}

}

@keyframes rotateRingReverse{

100%{

transform:
translate(-50%,-50%)
rotate(-360deg);

}

}

/* TABLET */

@media(max-width:991px){

.engine-header h2{

font-size:52px;

}

.engine-system{

height:auto;

display:flex;

flex-direction:column;

align-items:center;

gap:25px;

}

.energy-ring{

display:none;

}

.engine-core{

position:relative;

left:auto;

top:auto;

transform:none;

margin-bottom:20px;

}

.engine-module{

position:relative;

width:100%;

max-width:600px;

top:auto !important;

left:auto !important;

right:auto !important;

bottom:auto !important;

transform:none !important;

}

}

/* MOBILE */

@media(max-width:576px){

.performance-engine{

padding:90px 20px;

}

.engine-header h2{

font-size:38px;

}

.engine-header p{

font-size:16px;

}

.core-inner{

width:140px;

height:140px;

font-size:18px;

}

.engine-module{

padding:22px;

}

.engine-module h3{

font-size:18px;

}

}/* End custom CSS */
/* Start custom CSS for html, class: .elementor-element-fda7674 */.launch-chamber{

padding:160px 7%;

background:#030c15;

position:relative;

overflow:hidden;

}

/* GRID */

.launch-grid{

display:grid;

grid-template-columns:1.1fr .9fr;

gap:80px;

align-items:center;

}

/* FAQ SIDE */

.mission-header{

margin-bottom:40px;

}

.mission-tag{

display:inline-block;

padding:12px 20px;

border-radius:50px;

background:rgba(255,86,86,.08);

border:1px solid rgba(255,86,86,.15);

color:#ff5656;

font-size:12px;

font-weight:700;

letter-spacing:2px;

margin-bottom:20px;

}

.mission-header h2{

font-size:58px;

color:white;

}

.log-container{

display:flex;

flex-direction:column;

gap:25px;

}

.log-item{

padding:28px;

background:rgba(255,255,255,.03);

border:1px solid rgba(255,255,255,.08);

border-radius:24px;

backdrop-filter:blur(20px);

opacity:0;

transform:translateX(-50px);

animation:logReveal .8s forwards;

}

.log-item:nth-child(1){animation-delay:.1s;}
.log-item:nth-child(2){animation-delay:.3s;}
.log-item:nth-child(3){animation-delay:.5s;}
.log-item:nth-child(4){animation-delay:.7s;}
.log-item:nth-child(5){animation-delay:.9s;}

.log-query{

font-size:12px;

color:#7CFF93;

letter-spacing:2px;

margin-bottom:15px;

font-family:monospace;

}

.log-item h3{

color:white;

font-size:22px;

margin-bottom:12px;

}

.log-item p{

color:#cfd8e3;

line-height:1.8;

}

/* CTA SIDE */

.launch-side{

text-align:center;

}

.launch-reactor{

position:relative;

width:320px;

height:320px;

margin:auto;

margin-bottom:50px;

}

.reactor-ring{

position:absolute;

border-radius:50%;

border:1px solid rgba(255,86,86,.2);

left:50%;

top:50%;

transform:translate(-50%,-50%);

}

.ring-one{

width:220px;

height:220px;

animation:rotateClock 12s linear infinite;

}

.ring-two{

width:280px;

height:280px;

animation:rotateAnti 18s linear infinite;

}

.ring-three{

width:340px;

height:340px;

animation:rotateClock 24s linear infinite;

}

.reactor-core{

position:absolute;

left:50%;

top:50%;

transform:translate(-50%,-50%);

width:180px;

height:180px;

border-radius:50%;

background:linear-gradient(
135deg,
#ff5656,
#ff3f84
);

display:flex;

flex-direction:column;

align-items:center;

justify-content:center;

box-shadow:
0 0 60px rgba(255,86,86,.6);

animation:corePulse 4s infinite;

}

.status-number{

font-size:42px;

font-weight:800;

color:white;

}

.status-text{

font-size:13px;

font-weight:700;

letter-spacing:2px;

color:white;

}

.deployment-status{

display:flex;

flex-direction:column;

gap:12px;

margin-bottom:40px;

}

.status-item{

color:#7CFF93;

font-size:15px;

font-family:monospace;

}

.launch-side h2{

font-size:72px;

line-height:.95;

color:white;

margin-bottom:25px;

}

.launch-side p{

font-size:18px;

line-height:1.9;

color:#cfd8e3;

margin-bottom:35px;

}

.launch-btn{

display:inline-flex;

align-items:center;

justify-content:center;

padding:20px 40px;

border-radius:60px;

background:linear-gradient(
135deg,
#ff5656,
#ff3f84
);

color:white !important;

font-weight:700;

text-decoration:none;

transition:.4s;

}

.launch-btn:hover{

transform:translateY(-6px);

}

/* ANIMATIONS */

@keyframes rotateClock{

100%{

transform:
translate(-50%,-50%)
rotate(360deg);

}

}

@keyframes rotateAnti{

100%{

transform:
translate(-50%,-50%)
rotate(-360deg);

}

}

@keyframes corePulse{

50%{

transform:
translate(-50%,-50%)
scale(1.08);

}

}

@keyframes logReveal{

to{

opacity:1;

transform:translateX(0);

}

}

/* TABLET */

@media(max-width:991px){

.launch-grid{

grid-template-columns:1fr;

gap:60px;

}

.launch-side h2{

font-size:52px;

}

}

/* MOBILE */

@media(max-width:576px){

.launch-chamber{

padding:90px 20px;

}

.mission-header h2{

font-size:38px;

}

.launch-side h2{

font-size:40px;

}

.launch-reactor{

width:240px;

height:240px;

}

.reactor-core{

width:140px;

height:140px;

}

.status-number{

font-size:30px;

}

.log-item{

padding:22px;

}

.launch-btn{

width:100%;

}

}/* End custom CSS */