*{
margin:0;
padding:0;
box-sizing:border-box;
}

:root{
--bg:#03050a;
--panel:rgba(255,255,255,.055);
--panel-strong:rgba(255,255,255,.09);
--text:#ffffff;
--muted:#b9c2d3;
--blue:#1f6fff;
--blue2:#63a1ff;
--line:rgba(255,255,255,.1);
--shadow:0 30px 80px rgba(0,0,0,.45);
}

html{
scroll-behavior:smooth;
}

body{
background:var(--bg);
font-family:Montserrat,sans-serif;
color:var(--text);
overflow-x:hidden;
}

body::before{
content:"";
position:fixed;
inset:0;
background:
radial-gradient(circle at 20% 15%,rgba(31,111,255,.18),transparent 30%),
radial-gradient(circle at 80% 10%,rgba(99,161,255,.12),transparent 28%),
linear-gradient(135deg,rgba(255,255,255,.03) 0,transparent 35%);
pointer-events:none;
z-index:-3;
}

body::after{
content:"";
position:fixed;
inset:0;
background-image:linear-gradient(rgba(255,255,255,.035) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.035) 1px,transparent 1px);
background-size:70px 70px;
mask-image:linear-gradient(to bottom,rgba(0,0,0,.85),transparent 80%);
pointer-events:none;
z-index:-2;
}

::selection{
background:var(--blue);
color:white;
}

#particleCanvas{
position:fixed;
inset:0;
width:100%;
height:100%;
z-index:-1;
pointer-events:none;
opacity:.55;
}

.page-glow{
position:fixed;
width:420px;
height:420px;
border-radius:50%;
filter:blur(120px);
opacity:.18;
pointer-events:none;
z-index:-1;
animation:floatGlow 12s ease-in-out infinite alternate;
}

.page-glow-one{
background:var(--blue);
left:-120px;
top:25%;
}

.page-glow-two{
background:#ffffff;
right:-180px;
bottom:5%;
animation-delay:2s;
opacity:.08;
}

@keyframes floatGlow{
to{
transform:translate3d(80px,-60px,0) scale(1.2);
}
}

.preloader{
position:fixed;
inset:0;
background:#02050b;
z-index:5000;
display:flex;
flex-direction:column;
align-items:center;
justify-content:center;
transition:opacity .9s ease,visibility .9s ease;
}

.preloader.hide{
opacity:0;
visibility:hidden;
}

.loader-logo{
display:flex;
flex-direction:column;
align-items:center;
gap:18px;
animation:loaderPulse 1.6s infinite;
}

.loader-logo img{
width:130px;
max-height:130px;
object-fit:contain;
filter:drop-shadow(0 0 30px rgba(31,111,255,.85));
}

.loader-logo span{
font-weight:900;
letter-spacing:.22em;
font-size:13px;
color:var(--blue2);
}

.loader-line{
width:240px;
height:3px;
background:rgba(255,255,255,.1);
margin-top:32px;
border-radius:100px;
overflow:hidden;
}

.loader-line i{
display:block;
height:100%;
width:45%;
background:linear-gradient(90deg,transparent,var(--blue2),transparent);
animation:loaderMove 1.1s infinite;
}

@keyframes loaderMove{
from{transform:translateX(-100%)}
to{transform:translateX(260%)}
}

@keyframes loaderPulse{
50%{transform:scale(1.04)}
}

.cursor,
.cursor-dot{
position:fixed;
top:0;
left:0;
transform:translate(-50%,-50%);
pointer-events:none;
z-index:6000;
border-radius:50%;
display:none;
}

.cursor{
width:44px;
height:44px;
border:1px solid rgba(99,161,255,.75);
box-shadow:0 0 30px rgba(31,111,255,.35);
transition:width .2s,height .2s,background .2s;
}

.cursor-dot{
width:7px;
height:7px;
background:var(--blue2);
}

.cursor.active{
width:70px;
height:70px;
background:rgba(31,111,255,.12);
}

@media(pointer:fine){
.cursor,
.cursor-dot{
display:block;
}
}

header{
position:fixed;
top:0;
left:0;
width:100%;
display:flex;
justify-content:space-between;
align-items:center;
padding:20px 6%;
z-index:1000;
transition:.35s;
}

header.scrolled{
background:rgba(2,5,11,.72);
backdrop-filter:blur(24px);
border-bottom:1px solid var(--line);
padding:13px 6%;
}

.brand{
display:flex;
align-items:center;
gap:14px;
color:white;
text-decoration:none;
}

.brand img{
height:68px;
width:auto;
object-fit:contain;
filter:drop-shadow(0 0 18px rgba(31,111,255,.55));
transition:.35s;
}

header.scrolled .brand img{
height:52px;
}

.brand strong{
display:block;
font-size:17px;
letter-spacing:.04em;
text-transform:uppercase;
}

.brand span{
display:block;
font-size:11px;
color:var(--muted);
margin-top:4px;
}

nav{
display:flex;
align-items:center;
gap:24px;
}

nav a{
position:relative;
color:white;
text-decoration:none;
font-size:13px;
font-weight:700;
letter-spacing:.08em;
text-transform:uppercase;
opacity:.82;
transition:.3s;
}

nav a::after{
content:"";
position:absolute;
left:0;
bottom:-8px;
height:2px;
width:0;
background:linear-gradient(90deg,var(--blue),var(--blue2));
transition:.3s;
}

nav a:hover{
opacity:1;
color:var(--blue2);
}

nav a:hover::after{
width:100%;
}

.hotline{
padding:13px 22px;
border:1px solid rgba(99,161,255,.45);
background:linear-gradient(135deg,rgba(31,111,255,.95),rgba(1,35,90,.92));
color:white;
text-decoration:none;
border-radius:999px;
font-size:13px;
font-weight:800;
box-shadow:0 12px 40px rgba(31,111,255,.28);
}

.menu-toggle{
display:none;
background:none;
border:none;
width:42px;
height:42px;
cursor:pointer;
}

.menu-toggle span{
display:block;
height:2px;
background:white;
margin:7px 0;
transition:.3s;
}

.hero{
min-height:100vh;
position:relative;
overflow:hidden;
display:flex;
align-items:center;
padding:130px 8% 80px;
}

.hero-video,
.hero-backup{
position:absolute;
inset:0;
width:100%;
height:100%;
object-fit:cover;
z-index:-4;
}

.hero-backup{
background:
linear-gradient(120deg,rgba(1,4,10,.75),rgba(2,7,17,.8)),
url("https://images.unsplash.com/photo-1517457373958-b7bdd4587205?q=80&w=2400&auto=format&fit=crop") center/cover;
}

.overlay{
position:absolute;
inset:0;
background:
radial-gradient(circle at 75% 42%,rgba(31,111,255,.3),transparent 28%),
linear-gradient(90deg,rgba(0,0,0,.88) 0%,rgba(0,0,0,.62) 48%,rgba(0,0,0,.86) 100%);
z-index:-2;
}

.scanlines{
position:absolute;
inset:0;
background:repeating-linear-gradient(to bottom,rgba(255,255,255,.035) 0,rgba(255,255,255,.035) 1px,transparent 1px,transparent 7px);
opacity:.22;
mix-blend-mode:overlay;
pointer-events:none;
}

.hero-content{
position:relative;
z-index:2;
max-width:960px;
}

.eyebrow,
.section-kicker{
display:inline-flex;
align-items:center;
gap:10px;
padding:10px 16px;
border:1px solid rgba(99,161,255,.35);
border-radius:999px;
background:rgba(31,111,255,.09);
color:var(--blue2);
font-size:12px;
font-weight:900;
letter-spacing:.18em;
text-transform:uppercase;
}

.hero-title{
font-size:clamp(54px,9vw,134px);
font-weight:900;
line-height:.88;
letter-spacing:-.07em;
margin:28px 0;
text-transform:uppercase;
}

.hero-title .line{
display:block;
overflow:hidden;
animation:heroText 1.25s cubic-bezier(.2,.8,.2,1) both;
text-shadow:0 0 34px rgba(255,255,255,.12);
}

.hero-title .line.blue{
color:var(--blue2);
animation-delay:.16s;
text-shadow:
0 0 25px rgba(31,111,255,.9),
0 0 80px rgba(31,111,255,.4);
}

@keyframes heroText{
from{
opacity:0;
transform:translateY(110%) rotate(4deg);
filter:blur(14px);
}
to{
opacity:1;
transform:none;
filter:blur(0);
}
}

.hero-sub{
font-size:clamp(17px,2vw,23px);
line-height:1.75;
color:#e8edf7;
max-width:880px;
}

.hero-tags{
display:flex;
gap:12px;
flex-wrap:wrap;
margin-top:28px;
}

.hero-tags span,
.job-tags span,
.equipment-list span{
padding:10px 14px;
border:1px solid rgba(255,255,255,.13);
background:rgba(255,255,255,.055);
border-radius:999px;
color:#dce6f7;
font-size:13px;
font-weight:700;
}

.hero-buttons{
display:flex;
gap:16px;
flex-wrap:wrap;
margin-top:38px;
}

.btn{
display:inline-flex;
align-items:center;
justify-content:center;
min-height:56px;
padding:0 28px;
border-radius:999px;
font-weight:900;
text-decoration:none;
letter-spacing:.04em;
transition:.35s;
}

.btn.primary{
background:linear-gradient(135deg,var(--blue),#0b2f74);
color:white;
box-shadow:0 22px 55px rgba(31,111,255,.35);
}

.btn.ghost{
border:1px solid rgba(255,255,255,.22);
color:white;
background:rgba(255,255,255,.06);
backdrop-filter:blur(16px);
}

.btn:hover{
transform:translateY(-4px);
}

.hero-card{
position:absolute;
right:7%;
bottom:90px;
width:min(390px,30vw);
padding:28px;
border-radius:28px;
border:1px solid rgba(255,255,255,.14);
background:rgba(255,255,255,.06);
backdrop-filter:blur(22px);
box-shadow:var(--shadow);
z-index:2;
}

.hero-card span{
color:var(--blue2);
font-weight:900;
font-size:12px;
text-transform:uppercase;
letter-spacing:.16em;
}

.hero-card h3{
margin:12px 0;
font-size:26px;
}

.hero-card p{
color:var(--muted);
line-height:1.7;
}

.pulse-row{
display:flex;
align-items:center;
gap:10px;
margin-top:18px;
}

.pulse-row i{
width:11px;
height:11px;
background:#29ff8a;
border-radius:50%;
box-shadow:0 0 0 rgba(41,255,138,.6);
animation:pulse 1.5s infinite;
}

@keyframes pulse{
70%{box-shadow:0 0 0 18px rgba(41,255,138,0)}
100%{box-shadow:0 0 0 0 rgba(41,255,138,0)}
}

.scroll-down{
position:absolute;
left:8%;
bottom:34px;
color:white;
text-decoration:none;
display:flex;
align-items:center;
gap:10px;
font-size:12px;
letter-spacing:.18em;
text-transform:uppercase;
opacity:.75;
}

.scroll-down span{
width:18px;
height:32px;
border:1px solid rgba(255,255,255,.5);
border-radius:999px;
position:relative;
}

.scroll-down span::after{
content:"";
position:absolute;
left:50%;
top:7px;
width:4px;
height:4px;
background:white;
border-radius:50%;
transform:translateX(-50%);
animation:wheel 1.4s infinite;
}

@keyframes wheel{
to{top:19px;opacity:0}
}

.trust-strip{
border-block:1px solid rgba(255,255,255,.08);
background:rgba(255,255,255,.035);
overflow:hidden;
}

.marquee{
display:flex;
white-space:nowrap;
}

.marquee div{
display:flex;
gap:44px;
padding:22px 0;
animation:marquee 20s linear infinite;
}

.marquee span{
font-weight:900;
letter-spacing:.14em;
text-transform:uppercase;
color:rgba(255,255,255,.5);
}

@keyframes marquee{
from{transform:translateX(0)}
to{transform:translateX(-50%)}
}

.section-padding{
padding:120px 8%;
position:relative;
}

.section-head{
max-width:960px;
margin:0 auto 60px;
text-align:center;
}

.section-head h2,
.about-copy h2,
.jobs-box h2,
.contact-copy h2{
font-size:clamp(36px,5vw,68px);
line-height:1.05;
letter-spacing:-.06em;
margin:22px 0;
}

.section-head p,
.about-copy p,
.jobs-box p,
.contact-copy p{
color:var(--muted);
line-height:1.85;
font-size:17px;
}

.impact-grid,
.services-grid{
display:grid;
grid-template-columns:repeat(auto-fit,minmax(270px,1fr));
gap:24px;
}

.impact-card,
.service,
.equipment-card,
.command-card,
.jobs-box,
.contact-form{
border:1px solid rgba(255,255,255,.12);
background:linear-gradient(145deg,rgba(255,255,255,.085),rgba(255,255,255,.035));
backdrop-filter:blur(20px);
box-shadow:var(--shadow);
}

.impact-card{
padding:32px;
border-radius:28px;
min-height:240px;
}

.impact-card b,
.service-icon{
display:inline-flex;
width:48px;
height:48px;
align-items:center;
justify-content:center;
border-radius:16px;
background:rgba(31,111,255,.13);
border:1px solid rgba(99,161,255,.28);
color:var(--blue2);
margin-bottom:22px;
}

.impact-card h3,
.service h2{
font-size:25px;
margin-bottom:14px;
}

.impact-card p,
.service p,
.service li,
.command-card p{
color:var(--muted);
line-height:1.8;
}

.service{
padding:34px;
border-radius:30px;
position:relative;
overflow:hidden;
transition:.35s;
}

.service::before{
content:"";
position:absolute;
inset:0;
background:radial-gradient(circle at var(--mx,50%) var(--my,50%),rgba(31,111,255,.18),transparent 35%);
opacity:0;
transition:.3s;
}

.service:hover::before{
opacity:1;
}

.service:hover,
.impact-card:hover,
.equipment-card:hover,
.command-card:hover{
transform:translateY(-8px);
border-color:rgba(99,161,255,.42);
}

.service ul{
margin-top:18px;
padding-left:18px;
}

.service li{
margin:8px 0;
}

.numbers{
padding:80px 8%;
display:grid;
grid-template-columns:repeat(4,1fr);
gap:20px;
background:linear-gradient(90deg,rgba(31,111,255,.09),rgba(255,255,255,.025),rgba(31,111,255,.09));
border-block:1px solid rgba(255,255,255,.08);
}

.number-box{
text-align:center;
padding:36px 20px;
}

.number-box h3{
font-size:clamp(42px,6vw,76px);
color:var(--blue2);
letter-spacing:-.06em;
text-shadow:0 0 32px rgba(31,111,255,.35);
}

.number-box span{
color:var(--muted);
font-weight:800;
text-transform:uppercase;
font-size:12px;
letter-spacing:.14em;
}

.about{
overflow:hidden;
}

.about-grid{
display:grid;
grid-template-columns:1.15fr .85fr;
gap:58px;
align-items:center;
}

.about-copy p{
margin-bottom:20px;
}

.about-panel{
display:grid;
gap:22px;
}

.equipment-card,
.command-card{
border-radius:34px;
padding:34px;
}

.equipment-card h3{
font-size:30px;
margin-bottom:24px;
}

.equipment-list{
display:flex;
gap:12px;
flex-wrap:wrap;
}

.command-card small{
color:var(--blue2);
font-weight:900;
letter-spacing:.14em;
text-transform:uppercase;
}

.command-card strong{
display:block;
font-size:34px;
line-height:1.08;
margin:14px 0;
}

.process{
background:rgba(255,255,255,.025);
}

.timeline{
max-width:1050px;
margin:0 auto;
position:relative;
}

.timeline::before{
content:"";
position:absolute;
left:50%;
top:0;
bottom:0;
width:1px;
background:linear-gradient(transparent,var(--blue2),transparent);
}

.timeline-item{
width:calc(50% - 40px);
padding:30px;
border-radius:28px;
border:1px solid rgba(255,255,255,.12);
background:rgba(255,255,255,.055);
backdrop-filter:blur(16px);
margin-bottom:26px;
position:relative;
}

.timeline-item:nth-child(even){
margin-left:auto;
}

.timeline-item span{
color:var(--blue2);
font-weight:900;
}

.timeline-item h3{
font-size:25px;
margin:10px 0;
}

.timeline-item p{
color:var(--muted);
line-height:1.7;
}

.jobs{
background:
linear-gradient(rgba(0,0,0,.72),rgba(0,0,0,.86)),
url("https://images.unsplash.com/photo-1529070538774-1843cb3265df?q=80&w=2200&auto=format&fit=crop") center/cover fixed;
}

.jobs-box{
max-width:980px;
margin:auto;
border-radius:38px;
padding:58px;
text-align:center;
}

.job-tags{
display:flex;
justify-content:center;
gap:12px;
flex-wrap:wrap;
margin:28px 0 34px;
}

.contact-grid{
display:grid;
grid-template-columns:.9fr 1.1fr;
gap:58px;
align-items:start;
}

.contact-lines{
display:grid;
gap:14px;
margin-top:28px;
}

.contact-lines a,
.contact-lines span{
color:white;
text-decoration:none;
padding:16px 18px;
border:1px solid rgba(255,255,255,.12);
background:rgba(255,255,255,.04);
border-radius:18px;
}

.contact-form{
border-radius:34px;
padding:34px;
display:grid;
gap:16px;
}

.contact-form input,
.contact-form textarea,
.contact-form select{
width:100%;
padding:18px 18px;
border-radius:16px;
border:1px solid rgba(255,255,255,.1);
background:rgba(0,0,0,.35);
color:white;
font:inherit;
outline:none;
transition:.25s;
}

.contact-form textarea{
min-height:160px;
resize:vertical;
}

.contact-form input:focus,
.contact-form textarea:focus,
.contact-form select:focus{
border-color:rgba(99,161,255,.7);
box-shadow:0 0 0 4px rgba(31,111,255,.12);
}

.contact-form button{
min-height:58px;
border:none;
border-radius:18px;
background:linear-gradient(135deg,var(--blue),#0a2f76);
color:white;
font-weight:900;
font-size:15px;
cursor:pointer;
box-shadow:0 18px 42px rgba(31,111,255,.28);
}

.form-message{
padding:15px;
border-radius:16px;
font-weight:700;
}

.form-message.success{
background:rgba(41,255,138,.12);
border:1px solid rgba(41,255,138,.3);
}

.form-message.error{
background:rgba(255,70,70,.12);
border:1px solid rgba(255,70,70,.3);
}

footer{
padding:42px 8%;
display:flex;
justify-content:space-between;
gap:22px;
align-items:center;
border-top:1px solid rgba(255,255,255,.08);
background:#010206;
color:var(--muted);
}

footer strong{
display:block;
color:white;
margin-bottom:6px;
}

.reveal-up,
.reveal-left,
.reveal-right{
opacity:0;
filter:blur(12px);
transition:opacity .9s ease,transform .9s cubic-bezier(.2,.8,.2,1),filter .9s ease;
}

.reveal-up{
transform:translateY(70px);
}

.reveal-left{
transform:translateX(-70px);
}

.reveal-right{
transform:translateX(70px);
}

.in-view{
opacity:1;
transform:none;
filter:blur(0);
}

@media(max-width:1050px){
nav{
position:fixed;
right:22px;
top:86px;
width:min(360px,calc(100vw - 44px));
display:none;
flex-direction:column;
align-items:flex-start;
padding:24px;
border-radius:24px;
background:rgba(2,5,11,.92);
border:1px solid rgba(255,255,255,.12);
backdrop-filter:blur(22px);
}

nav.open{
display:flex;
}

.menu-toggle{
display:block;
}

.hotline{
display:none;
}

.hero-card{
display:none;
}

.about-grid,
.contact-grid{
grid-template-columns:1fr;
}

.timeline::before{
left:0;
}

.timeline-item,
.timeline-item:nth-child(even){
width:100%;
margin-left:0;
padding-left:36px;
}
}

@media(max-width:760px){
header{
padding:14px 18px;
}

.brand img{
height:50px;
}

.brand div{
display:none;
}

.hero{
padding:120px 22px 70px;
}

.hero-title{
font-size:54px;
}

.section-padding{
padding:84px 22px;
}

.numbers{
grid-template-columns:repeat(2,1fr);
padding:55px 22px;
}

.jobs-box{
padding:34px 22px;
}

footer{
flex-direction:column;
align-items:flex-start;
}

.cursor,
.cursor-dot{
display:none;
}
}

@media(prefers-reduced-motion:reduce){
*{
animation:none!important;
transition:none!important;
scroll-behavior:auto!important;
}
}
