.cyber-hero {
    
  background:
    linear-gradient(90deg, rgba(24, 98, 255, 0.06) 0%, rgba(24, 98, 255, 0) 18%),
    linear-gradient(180deg, #071226 0%, #071124 100%);
  color: #fff;
  padding: 48px 20px 56px;
  font-family: Inter, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  overflow: hidden;
  border-top: 1px solid rgba(255,255,255,0.04);
  margin-top: 5rem;
}

.cyber-hero__inner {
  max-width: 1600px;
  margin: 0 auto;
  display: grid;
  grid-template-columns: 1fr;
  gap: 36px;
  align-items: center;
}

.cyber-hero__content {
  max-width: 760px;
}

.cyber-hero__badge {
  display: inline-flex;
  align-items: center;
  min-height: 34px;
  padding: 0 16px;
  border-radius: 999px;
  border: 1px solid rgba(68, 123, 255, 0.16);
  background: rgba(18, 43, 87, 0.48);
  color: #4b8cff;
  font-size: 13px;
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: none;
  margin-bottom: 26px;
}

.cyber-hero__title {
  margin: 0;
  font-size: 44px;
  line-height: 0.98;
  font-weight: 700;
  letter-spacing: -0.05em;
  color: #f7f9fc;
}

.cyber-hero__title span {
  background: linear-gradient(180deg, #4d85ff 0%, #5a87df 54%, #5d6f97 100%);
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
}

.cyber-hero__text {
  max-width: 590px;
  margin: 24px 0 0;
  font-size: 18px;
  line-height: 1.45;
  color: rgba(181, 196, 221, 0.8);
}

.cyber-hero__actions {
  display: flex;
  flex-direction: column;
  gap: 14px;
  margin-top: 34px;
}

.cyber-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 64px;
  padding: 0 28px;
  border-radius: 12px;
  font-size: 18px;
  font-weight: 700;
  line-height: 1.2;
  text-align: center;
  text-decoration: none;
  transition:
    transform 0.25s ease,
    box-shadow 0.25s ease,
    background 0.25s ease,
    border-color 0.25s ease;
}

.cyber-btn--primary {
  background: #f7630c;
  color: #fff;
  box-shadow: 0 14px 36px rgba(247, 99, 12, 0.22);
}

.cyber-btn--primary:hover {
  transform: translateY(-2px);
  background: #ff6b16;
  box-shadow: 0 18px 42px rgba(247, 99, 12, 0.3);
}

.cyber-btn--secondary {
  background: transparent;
  color: #f4f7fb;
  border: 1px solid rgba(255, 255, 255, 0.14);
}

.cyber-btn--secondary:hover {
  transform: translateY(-2px);
  background: rgba(255,255,255,0.03);
  border-color: rgba(255,255,255,0.24);
}

.cyber-hero__media {
  display: flex;
  justify-content: center;
}

.cyber-hero__image-wrap {
  width: 100%;
  max-width: 720px;
  border-radius: 22px;
  overflow: hidden;
  box-shadow: 0 26px 80px rgba(0,0,0,0.34);
}

.cyber-hero__image-wrap img {
  display: block;
  width: 100%;
  height: auto;
  aspect-ratio: 1.08 / 1;
  object-fit: cover;
}

/* tablet */
@media (min-width: 768px) {
  .cyber-hero {
    padding: 64px 32px 72px;
  }

  .cyber-hero__title {
    font-size: 62px;
  }

  .cyber-hero__actions {
    flex-direction: row;
    flex-wrap: wrap;
  }

  .cyber-btn {
    min-width: 270px;
  }
}

/* desktop */
@media (min-width: 1200px) {
  .cyber-hero {
    padding: 56px 48px 64px;
  }

  .cyber-hero__inner {
    grid-template-columns: minmax(0, 1fr) minmax(540px, 720px);
    gap: 72px;
  }

  .cyber-hero__title {
    font-size: 86px;
  }

  .cyber-hero__text {
    font-size: 20px;
    max-width: 610px;
    margin-top: 28px;
  }

  .cyber-hero__actions {
    margin-top: 42px;
  }

  .cyber-btn {
    min-height: 100px;
    min-width: 360px;
    padding: 0 34px;
    border-radius: 14px;
    font-size: 22px;
  }

  .cyber-hero__image-wrap {
    max-width: 760px;
    border-radius: 24px;
  }
}
@media (min-width: 1200px) {
  .cyber-btn {
    max-width: 390px;
    white-space: normal;
  }
}
.cyber-hero {
  padding: 36px 20px 44px;
}

.cyber-hero__inner {
  gap: 28px;
}

.cyber-hero__badge {
  min-height: 30px;
  padding: 0 14px;
  font-size: 12px;
  margin-bottom: 18px;
}

.cyber-hero__title {
  font-size: 36px;
  line-height: 1.02;
}

.cyber-hero__text {
  font-size: 15px;
  line-height: 1.5;
  margin-top: 18px;
  max-width: 520px;
}

.cyber-hero__actions {
  margin-top: 24px;
  gap: 12px;
}

.cyber-btn {
  min-height: 54px;
  padding: 0 20px;
  font-size: 16px;
  border-radius: 10px;
}

.cyber-hero__image-wrap {
  max-width: 620px;
  border-radius: 18px;
}

@media (min-width: 768px) {
  .cyber-hero {
    padding: 48px 28px 56px;
  }

  .cyber-hero__title {
    font-size: 48px;
  }

  .cyber-hero__text {
    font-size: 16px;
  }

  .cyber-btn {
    min-width: 220px;
    min-height: 58px;
    font-size: 16px;
  }
}

@media (min-width: 1200px) {
  .cyber-hero {
    padding: 40px 48px 52px;
  }

  .cyber-hero__inner {
    grid-template-columns: minmax(0, 1fr) minmax(480px, 650px);
    gap: 56px;
  }

  .cyber-hero__title {
    font-size: 68px;
  }

  .cyber-hero__text {
    font-size: 17px;
    max-width: 560px;
  }

  .cyber-btn {
    min-height: 74px;
    min-width: 280px;
    padding: 0 24px;
    font-size: 18px;
  }

  .cyber-hero__image-wrap {
    max-width: 680px;
  }
}

/* NFO  */

.cyber-info{

padding:100px 60px;

background:#ffffff;

font-family:Inter,system-ui;

}

.cyber-info-container{

max-width:1300px;
margin:auto;

display:grid;
grid-template-columns:1fr 1fr;

gap:80px;
align-items:center;

}

/* IMAGE */

.cyber-image img{

width:100%;
border-radius:14px;
display:block;

}

/* CONTENT */

.cyber-content h2{

font-size:42px;
margin-bottom:20px;
color:#111827;

}

.cyber-desc{

color:#6b7a90;
font-size:18px;
line-height:1.6;
margin-bottom:36px;

}

/* LIST */

.cyber-list{

display:flex;
flex-direction:column;
gap:22px;

}

.cyber-item{

display:flex;
gap:16px;

}

.cyber-item h4{

font-size:18px;
margin-bottom:4px;
color:#111827;

}

.cyber-item p{

color:#6b7a90;
font-size:15px;
line-height:1.5;

}

/* CHECK ICON */

.check{

width:28px;
height:28px;
min-width:28px;

border-radius:50%;

background:#e7f6ec;

position:relative;

}

.check::after{

content:"✓";

position:absolute;
top:50%;
left:50%;

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

color:#2dbd60;
font-weight:700;
font-size:14px;

}

/* RESPONSIVE */

@media(max-width:1000px){

.cyber-info-container{

grid-template-columns:1fr;
gap:40px;

}

.cyber-content h2{

font-size:32px;

}

}

/* SECURITY ARCH */

.security-architecture{

background:#061326;

padding:120px 40px;

font-family:Inter,system-ui;

color:white;

}

/* CONTAINER */

.security-container{

max-width:1200px;
margin:auto;
text-align:center;

}

/* TITLE */

.security-container h2{

font-size:42px;
margin-bottom:10px;

}

/* SUBTITLE */

.security-subtitle{

color:#8fa2b8;
font-size:18px;
margin-bottom:60px;

}

/* CARD CONTAINER */

.security-grid{

display:grid;
grid-template-columns:1fr;

gap:40px;

padding:50px;

border-radius:20px;

background:linear-gradient(
180deg,
rgba(30,45,70,.6),
rgba(12,20,36,.9)
);

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

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

}

/* ITEM */

.security-item{

text-align:left;

}

.security-item h4{

color:#4d8cff;

font-size:18px;
margin-bottom:12px;

}

.security-item p{

color:#b4c2d6;
line-height:1.6;

}

/* DESKTOP */

@media(min-width:900px){

.security-grid{

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

gap:60px;

}

}
.security-grid{
backdrop-filter:blur(10px);
}

/* CARDS */

.capabilities{

background:#f5f7fb;

padding:90px 40px;

font-family:Inter,system-ui;

}

.capabilities-container{

max-width:1200px;
margin:auto;

}

.cap-title{

font-size:32px;
font-weight:700;

margin-bottom:10px;

color:#0f172a;

}

.cap-line{

width:220px;
height:4px;

background:#3b82f6;

margin-bottom:50px;

border-radius:3px;

}

/* GRID */

.cap-grid{

display:grid;

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

gap:28px;

}

/* CARD */

.cap-card{

background:#1e2b3f;

padding:34px;

border-radius:14px;

color:white;

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

transition:
transform .35s ease,
box-shadow .35s ease,
background .35s ease;

position:relative;

overflow:hidden;

/* floating animation */
animation:floatCard 7s ease-in-out infinite;

}

.cap-card:nth-child(2){animation-delay:1s;}
.cap-card:nth-child(3){animation-delay:2s;}
.cap-card:nth-child(4){animation-delay:1.5s;}

/* ICON */

.cap-icon{

width:46px;
height:46px;

display:flex;
align-items:center;
justify-content:center;

border-radius:10px;

background:#2b3d57;

margin-bottom:18px;

font-size:20px;

transition:transform .3s ease;

}

/* TITLE */

.cap-card h3{

font-size:18px;

margin-bottom:10px;

}

/* TEXT */

.cap-card p{

font-size:14px;

line-height:1.6;

color:#a9b6cc;

}

/* HOVER EFFECT */

.cap-card:hover{

transform:translateY(-8px);

box-shadow:
0 18px 50px rgba(0,0,0,.4),
0 0 30px rgba(70,120,255,.12);

background:#22344e;

}

/* ICON SCALE */

.cap-card:hover .cap-icon{

transform:scale(1.15);

}

/* SHIMMER */

.cap-card::before{

content:"";

position:absolute;

top:0;
left:-100%;

width:200%;
height:100%;

background:linear-gradient(
120deg,
transparent,
rgba(255,255,255,.06),
transparent
);

transition:0.6s;

}

.cap-card:hover::before{

left:100%;

}

/* FLOATING ANIMATION */

@keyframes floatCard{

0%{transform:translateY(0);}
50%{transform:translateY(-4px);}
100%{transform:translateY(0);}

}

/* RESPONSIVE */

@media(max-width:1000px){

.cap-grid{

grid-template-columns:1fr 1fr;

}

}

@media(max-width:650px){

.cap-grid{

grid-template-columns:1fr;

}

}

/* PROCESS */
.security-process{

background:#061327;

padding:120px 40px;

font-family:Inter,system-ui;

color:white;

}

/* CONTAINER */

.process-container{

max-width:1300px;
margin:auto;
text-align:center;

}

/* TITLE */

.process-container h2{

font-size:42px;
margin-bottom:10px;

}

.process-sub{

color:#8ea2bd;
font-size:18px;
margin-bottom:80px;

}

/* TIMELINE */

.timeline{

display:grid;

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

gap:30px;

position:relative;

}

/* CONNECTING LINE */

.timeline::before{

content:"";

position:absolute;

top:38px;
left:0;
right:0;

height:2px;

background:linear-gradient(
90deg,
rgba(60,120,255,.2),
rgba(60,120,255,.6),
rgba(60,120,255,.2)
);

z-index:0;

}

/* STEP */

.step{

position:relative;

text-align:center;

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

}

.step:nth-child(2){animation-delay:1s;}
.step:nth-child(3){animation-delay:2s;}
.step:nth-child(4){animation-delay:1.5s;}

/* NUMBER CIRCLE */

.circle{

width:74px;
height:74px;

margin:auto;

display:flex;
align-items:center;
justify-content:center;

border-radius:50%;

border:2px solid #3b82f6;

background:#0d1e36;

font-size:22px;
font-weight:700;

color:#5ea0ff;

position:relative;

z-index:2;

transition:
transform .35s ease,
box-shadow .35s ease,
background .35s ease;

}

/* TEXT */

.step h4{

margin-top:20px;

font-size:18px;

}

.step p{

color:#8ea2bd;

font-size:14px;

margin-top:6px;

line-height:1.5;

}

/* HOVER EFFECT */

.step:hover .circle{

transform:translateY(-6px) scale(1.08);

background:#1c3355;

box-shadow:
0 0 20px rgba(80,140,255,.4),
0 10px 40px rgba(0,0,0,.4);

}

/* FLOATING ANIMATION */

@keyframes floatStep{

0%{transform:translateY(0);}
50%{transform:translateY(-4px);}
100%{transform:translateY(0);}

}

/* RESPONSIVE */

@media(max-width:1000px){

.timeline{

grid-template-columns:repeat(3,1fr);
row-gap:60px;

}

.timeline::before{

display:none;

}

}

@media(max-width:600px){

.timeline{

grid-template-columns:1fr;

}

}
.circle{
animation:pulseCircle 4s infinite ease-in-out;
}

@keyframes pulseCircle{
0%{box-shadow:0 0 0 rgba(80,140,255,0);}
50%{box-shadow:0 0 20px rgba(80,140,255,.4);}
100%{box-shadow:0 0 0 rgba(80,140,255,0);}
}

/* Securing Critical Sectors  */

.sectors{

background:#061327;

padding:120px 40px;

font-family:Inter,system-ui;

color:white;

}

/* CONTAINER */

.sectors-container{

max-width:1300px;
margin:auto;

display:grid;

grid-template-columns:1fr 520px;

gap:80px;

align-items:center;

}

/* TITLE */

.sectors-left h2{

font-size:42px;

margin-bottom:50px;

font-weight:700;

}

/* GRID */

.sector-grid{

display:grid;

grid-template-columns:1fr 1fr;

gap:40px 60px;

}

/* ITEMS */

.sector-item{

transition:all .35s ease;

cursor:pointer;

}

.sector-item h4{

color:#4ea1ff;

font-size:18px;

margin-bottom:8px;

}

.sector-item p{

color:#8ea2bd;

font-size:15px;

line-height:1.6;

}

/* HOVER EFFECT */

.sector-item:hover{

transform:translateX(6px);

}

.sector-item:hover h4{

color:#70b4ff;

text-shadow:0 0 12px rgba(80,140,255,.6);

}

/* IMAGE CARD */

.image-card{

border-radius:18px;

overflow:hidden;

position:relative;

box-shadow:

0 20px 60px rgba(0,0,0,.6);

animation:floatImage 7s ease-in-out infinite;

}

/* IMAGE */

.image-card img{

width:100%;
height:auto;

display:block;

transition:transform .6s ease, filter .6s ease;

}

/* IMAGE HOVER */

.image-card:hover img{

transform:scale(1.06);

filter:brightness(1.1);

}

/* GLOW EFFECT */

.image-card::after{

content:"";

position:absolute;

inset:0;

border-radius:18px;

box-shadow:

0 0 60px rgba(80,140,255,.3);

opacity:.5;

pointer-events:none;

}

/* FLOATING ANIMATION */

@keyframes floatImage{

0%{transform:translateY(0px)}

50%{transform:translateY(-12px)}

100%{transform:translateY(0px)}

}

/* RESPONSIVE */

@media(max-width:1000px){

.sectors-container{

grid-template-columns:1fr;

}

.sectors-right{

order:-1;

}

.sector-grid{

grid-template-columns:1fr;

}

}

/* CALL US  */

.consult-section{

padding:120px 40px;
background:#f3f5f8;

font-family:Inter,system-ui;

}

/* MAIN CONTAINER */

.consult-container{

max-width:1300px;
margin:auto;

display:grid;
grid-template-columns:1fr 560px;

gap:80px;

align-items:center;

padding:80px;

border-radius:22px;

background:linear-gradient(
135deg,
#eef1f5,
#cfd5dd,
#2d3f58
);

box-shadow:
0 30px 80px rgba(0,0,0,.25);

}

/* LEFT */

.consult-left h2{

font-size:40px;
color:#1b2430;

margin-bottom:20px;

}

.consult-left p{

font-size:18px;
color:#6b7b8e;

max-width:520px;

line-height:1.7;

margin-bottom:35px;

}

/* BUTTON */

.consult-btn{

display:inline-block;

background:#f15a0f;

color:white;

padding:16px 36px;

border-radius:8px;

font-weight:600;

font-size:18px;

text-decoration:none;

transition:all .35s ease;

box-shadow:
0 10px 25px rgba(241,90,15,.35);

}

/* BUTTON HOVER */

.consult-btn:hover{

transform:translateY(-3px);

box-shadow:
0 16px 40px rgba(241,90,15,.5);

background:#ff6b22;

}

/* RIGHT IMAGE */

.consult-image{

position:relative;

border-radius:18px;

overflow:hidden;

box-shadow:
0 25px 60px rgba(0,0,0,.35);

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

}

/* IMAGE */

.consult-image img{

width:100%;
display:block;

transition:transform .6s ease;

}

/* IMAGE HOVER */

.consult-image:hover img{

transform:scale(1.06);

}

/* LIGHT SWEEP EFFECT */

.consult-image::after{

content:"";

position:absolute;

top:0;
left:-120%;

width:60%;
height:100%;

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

transform:skewX(-25deg);

animation:lightSweep 6s infinite;

}

/* FLOATING IMAGE */

@keyframes floatImage{

0%{transform:translateY(0)}
50%{transform:translateY(-12px)}
100%{transform:translateY(0)}

}

/* LIGHT SWEEP */

@keyframes lightSweep{

0%{left:-120%}
100%{left:140%}

}

/* RESPONSIVE */

@media(max-width:1000px){

.consult-container{

grid-template-columns:1fr;

text-align:center;

}

.consult-left p{

margin:auto;
margin-bottom:35px;

}

}

.consult-section{
    width:100%;
    max-width:1300px;
    margin:120px auto;
    padding:80px 40px;

    display:grid;
    grid-template-columns:1fr 520px;
    gap:80px;
    align-items:center;

    border-radius:30px;

    background:linear-gradient(
        110deg,
        #e9edf2 0%,
        #cfd5dd 45%,
        #1b2f4b 100%
    );

    box-shadow:0 40px 80px rgba(0,0,0,.35);
}
@media(max-width:1000px){

.consult-section{
grid-template-columns:1fr;
padding:60px 25px;
text-align:center;
gap:40px;
}

.consult-left p{
margin:auto;
}

.consult-right img{
height:auto;
}

}

/* LEFT SIDE */

.consult-left h2{

    font-size:44px;
    line-height:1.2;
    color:#111827;

    margin-bottom:25px;
}

.consult-left p{

    font-size:18px;
    color:#8a9ab0;
    line-height:1.7;

    max-width:420px;

    margin-bottom:45px;
}

/* BUTTON */

.consult-btn{

    display:inline-flex;
    align-items:center;
    justify-content:center;

    padding:20px 40px;

    background:#f25c0d;
    color:white;

    font-weight:700;
    font-size:18px;

    border-radius:10px;

    text-decoration:none;

    box-shadow:0 15px 30px rgba(242,92,13,.35);

    transition:all .25s ease;
}

.consult-btn:hover{

    transform:translateY(-3px);

    box-shadow:0 20px 40px rgba(242,92,13,.45);

    background:#ff6b1b;
}

/* IMAGE */

.consult-right img{

    width:100%;
    height:420px;

    object-fit:cover;

    border-radius:18px;

    box-shadow:0 30px 60px rgba(0,0,0,.35);
}.consult-section {

    width: 1300px;
    margin: 120px auto;

    padding: 90px;

    display: grid;
    grid-template-columns: 1fr 520px;
    gap: 80px;
    align-items: center;

    border-radius: 30px;

    background: linear-gradient(
        110deg,
        #e9edf2 0%,
        #cfd5dd 45%,
        #1b2f4b 100%
    );

    box-shadow: 0 40px 80px rgba(0,0,0,.35);

    font-family: Inter, sans-serif;
}

/* LEFT SIDE */

.consult-left h2{

    font-size:44px;
    line-height:1.2;
    color:#111827;

    margin-bottom:25px;
}

.consult-left p{

    font-size:18px;
    color:#8a9ab0;
    line-height:1.7;

    max-width:420px;

    margin-bottom:45px;
}

/* BUTTON */

.consult-btn{

    display:inline-flex;
    align-items:center;
    justify-content:center;

    padding:20px 40px;

    background:#f25c0d;
    color:white;

    font-weight:700;
    font-size:18px;

    border-radius:10px;

    text-decoration:none;

    box-shadow:0 15px 30px rgba(242,92,13,.35);

    transition:all .25s ease;
}

.consult-btn:hover{

    transform:translateY(-3px);

    box-shadow:0 20px 40px rgba(242,92,13,.45);

    background:#ff6b1b;
}

/* IMAGE */

.consult-right img{

    width:100%;
    height:420px;

    object-fit:cover;

    border-radius:18px;

    box-shadow:0 30px 60px rgba(0,0,0,.35);
}.consult-section{
    width:100%;
    margin:0;
    border-radius:0;
}

.consult-right img{

animation:consultFloat 7s ease-in-out infinite;

}

@keyframes consultFloat{

0%{transform:translateY(0)}
50%{transform:translateY(-12px)}
100%{transform:translateY(0)}

}
.consult-right img{

transition:transform .6s ease, box-shadow .6s ease;

}

.consult-right:hover img{

transform:scale(1.05);

box-shadow:
0 30px 80px rgba(0,0,0,.35),
0 0 40px rgba(80,140,255,.25);

}
.consult-btn{

animation:ctaPulse 3.5s infinite;

}

@keyframes ctaPulse{

0%{
box-shadow:0 15px 30px rgba(242,92,13,.35);
}

50%{
box-shadow:0 20px 40px rgba(242,92,13,.6);
}

100%{
box-shadow:0 15px 30px rgba(242,92,13,.35);
}

}
.consult-btn:hover{

transform:translateY(-4px) scale(1.02);

background:#ff6b1b;

box-shadow:
0 25px 50px rgba(242,92,13,.45);

}
.consult-right{

position:relative;
overflow:hidden;

}

.consult-right::after{

content:"";

position:absolute;

top:0;
left:-120%;

width:60%;
height:100%;

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

transform:skewX(-25deg);

animation:consultSweep 7s infinite;

}

@keyframes consultSweep{

0%{left:-120%}
100%{left:140%}

}
.consult-left h2{

transition:text-shadow .4s ease;

}

.consult-left h2:hover{

text-shadow:
0 0 12px rgba(80,140,255,.4);

}
.consult-section::before{

content:"";

position:absolute;

inset:0;

background:
radial-gradient(circle at 20% 30%, rgba(80,140,255,.12), transparent 50%),
radial-gradient(circle at 80% 70%, rgba(80,140,255,.08), transparent 50%);

pointer-events:none;

animation:particleMove 12s ease-in-out infinite;

}

@keyframes particleMove{

0%{opacity:.6}
50%{opacity:1}
100%{opacity:.6}

}

/* FORM  */

.security-transform{

background:linear-gradient(90deg,#071327,#091a34);
padding:120px 40px;

font-family:Inter,system-ui;
color:white;

overflow:hidden;

}

.transform-container{

max-width:1300px;
margin:auto;

display:grid;
grid-template-columns:1fr minmax(320px,520px);

gap:80px;
align-items:start;

}
@media(max-width:1000px){

.sectors-container{
grid-template-columns:1fr;
gap:40px;
}

.sectors-right{
order:-1;
}

}
/* CONSULT SECTION */

.consult-section{
width:100%;
max-width:1300px;
margin:120px auto;
padding:80px 40px;

display:grid;
grid-template-columns:1fr 520px;
gap:80px;
align-items:center;

border-radius:30px;

background:linear-gradient(
110deg,
#e9edf2 0%,
#cfd5dd 45%,
#1b2f4b 100%
);

box-shadow:0 40px 80px rgba(0,0,0,.35);
}

/* IMAGE */

.consult-right img{
width:100%;
height:420px;
object-fit:cover;
border-radius:18px;
}

/* TABLET */

@media(max-width:1000px){

.consult-section{
grid-template-columns:1fr;
gap:40px;
padding:60px 30px;
text-align:center;
}

.consult-left p{
margin:auto;
}

.consult-right{
order:-1;
}

.consult-right img{
height:auto;
}

}

/* MOBILE */

@media(max-width:600px){

.consult-section{
padding:50px 20px;
margin:80px auto;
}

.consult-left h2{
font-size:32px;
}

.consult-left p{
font-size:16px;
}

.consult-btn{
width:100%;
}

}


/* LEFT SIDE */

.transform-left h2{

font-size:48px;
font-weight:700;
margin-bottom:1px;

animation:fadeUp 1s ease;

}

.transform-desc{

color:#8ea2bd;
font-size:18px;
line-height:1.7;
max-width:520px;

margin-bottom:1px;

animation:fadeUp 1.2s ease;

}


/* STEPS */

.transform-steps{

display:flex;
flex-direction:column;
gap:1px;

}

.step{

display:flex;
align-items:center;
gap:20px;

cursor:pointer;

transition:.3s;

}

.step span{

font-size:44px;
font-weight:700;

color:#1c4fa3;

min-width:60px;

transition:.35s;

}

.step p{

font-size:18px;
color:#cdd6e4;

}

.step:hover span{

color:#4ea1ff;

transform:scale(1.15);

text-shadow:0 0 20px rgba(80,140,255,.7);

}

.step:hover{

transform:translateX(8px);

}


/* IMAGE */

.transform-image{

margin-top:20px;

border-radius:16px;
overflow:hidden;

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

animation:floatImage 7s ease-in-out infinite;

}

.transform-image img{

width:100%;
display:block;

transition:transform .6s ease;

}

.transform-image:hover img{

transform:scale(1.06);

}


/* FORM */

.transform-form{

background:linear-gradient(
180deg,
rgba(25,38,64,.6),
rgba(8,15,30,.9)
);

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

padding:45px;

border-radius:18px;

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

backdrop-filter:blur(10px);

animation:fadeUp 1.2s ease;

}


/* FORM GRID */

.form-row{

display:grid;
grid-template-columns:1fr 1fr;
gap:20px;

}

.form-group{

display:flex;
flex-direction:column;
margin-bottom:22px;

}

.form-group label{

font-size:13px;
color:#9fb1c7;
margin-bottom:8px;

}

.form-group input,
.form-group select,
.form-group textarea{

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

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

border-radius:8px;

padding:14px;

color:white;

font-size:14px;

transition:.25s;

}

textarea{

height:120px;
resize:none;

}


/* INPUT HOVER */

.form-group input:hover,
.form-group textarea:hover,
.form-group select:hover{

border-color:#4ea1ff;

}


/* INPUT FOCUS GLOW */

.form-group input:focus,
.form-group textarea:focus,
.form-group select:focus{

outline:none;

border-color:#4ea1ff;

box-shadow:
0 0 0 2px rgba(78,161,255,.15),
0 0 18px rgba(78,161,255,.25);

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

}


/* BUTTON */

.cta-btn{

width:100%;

margin-top:10px;

padding:18px;

border-radius:8px;

border:none;

font-size:16px;
font-weight:700;

background:linear-gradient(
90deg,
#ff7a32,
#ff6a21
);

color:white;

cursor:pointer;

position:relative;
overflow:hidden;

transition:.3s;

box-shadow:0 10px 30px rgba(255,120,40,.35);

}


/* BUTTON HOVER */

.cta-btn:hover{

transform:translateY(-3px);

box-shadow:0 18px 40px rgba(255,120,40,.45);

}


/* BUTTON SHINE */

.cta-btn::after{

content:"";

position:absolute;

top:0;
left:-120%;

width:50%;
height:100%;

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

transform:skewX(-20deg);

transition:.6s;

}

.cta-btn:hover::after{

left:140%;

}


/* IMAGE FLOAT */

@keyframes floatImage{

0%{transform:translateY(0)}
50%{transform:translateY(-10px)}
100%{transform:translateY(0)}

}


/* FADE ANIMATION */

@keyframes fadeUp{

0%{

opacity:0;
transform:translateY(30px);

}

100%{

opacity:1;
transform:translateY(0);

}

}


/* RESPONSIVE */

@media(max-width:1000px){

.transform-container{

grid-template-columns:1fr;

}

.form-row{

grid-template-columns:1fr;

}

}

.transform-left{
  display:flex;
  flex-direction:column;
  gap:1px;
}

.transform-steps{
  margin-top:0;
}

.transform-image{
  margin-top:0;
}

.transform-left{
  display:grid;
  grid-template-rows:auto auto auto;
  gap:10px;
}

/* FAQ */

.faq-section{

background:#f3f4f6;
padding:120px 20px;
font-family:Inter,system-ui;

text-align:center;

}

.faq-title{

font-size:42px;
font-weight:700;
margin-bottom:60px;

}

.faq-container{

max-width:900px;
margin:auto;

display:flex;
flex-direction:column;
gap:24px;

}


/* CARD */

.faq-item{

background:#1e2b3f;
border-radius:18px;

overflow:hidden;

box-shadow:0 15px 40px rgba(0,0,0,.15);

transition:.35s;

position:relative;

}

.faq-item:hover{

transform:translateY(-3px);

box-shadow:
0 25px 60px rgba(0,0,0,.25),
0 0 30px rgba(70,120,255,.12);

}


/* QUESTION */

.faq-question{

display:flex;
justify-content:space-between;
align-items:center;

padding:28px 34px;

font-size:20px;
color:white;

cursor:pointer;

}


/* HIDE RADIO */

.faq-item input{

display:none;

}


/* ANSWER */

.faq-answer{

max-height:0;
overflow:hidden;

padding:0 34px;

text-align:left;

font-size:16px;
line-height:1.6;

color:#a9b6cc;

transition:
max-height .4s ease,
padding .4s ease;

}


/* OPEN */

.faq-item input:checked ~ .faq-answer{

max-height:200px;
padding:0 34px 28px;

}


/* ARROW */

.arrow{

width:12px;
height:12px;

border-right:2px solid #a9b6cc;
border-bottom:2px solid #a9b6cc;

transform:rotate(45deg);

transition:.3s;

}


/* ROTATE */

.faq-item input:checked + .faq-question .arrow{

transform:rotate(-135deg);

}


/* GLOW SWEEP */

.faq-item::before{

content:"";

position:absolute;

top:0;
left:-120%;

width:60%;
height:100%;

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

transform:skewX(-25deg);

transition:.6s;

}

.faq-item:hover::before{

left:140%;

}


/* FLOAT ANIMATION */

.faq-item{

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

}

.faq-item:nth-child(2){animation-delay:1.5s;}
.faq-item:nth-child(3){animation-delay:3s;}

@keyframes faqFloat{

0%{transform:translateY(0)}
50%{transform:translateY(-4px)}
100%{transform:translateY(0)}

}

/* PROCESS  */

.delivery-section{

background:linear-gradient(90deg,#071327,#091a34);

padding:120px 40px;

font-family:Inter,system-ui;
color:white;
text-align:center;

}


/* TITLE */

.delivery-title{

font-size:42px;
font-weight:700;
margin-bottom:12px;

}

.delivery-sub{

color:#8ea2bd;
font-size:18px;
margin-bottom:80px;

}


/* TIMELINE */

.timeline{

display:grid;

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

gap:30px;

position:relative;

max-width:1300px;
margin:auto;

}


/* DASHED LINE */

.timeline::before{

content:"";

position:absolute;

top:38px;
left:0;
right:0;

height:2px;

background:linear-gradient(
90deg,
rgba(60,120,255,.2),
rgba(60,120,255,.6),
rgba(60,120,255,.2)
);

z-index:0;

}


/* ITEM */

.timeline-item{

position:relative;

text-align:center;

transition:.35s;

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

}

.timeline-item:nth-child(2){animation-delay:1s;}
.timeline-item:nth-child(3){animation-delay:2s;}
.timeline-item:nth-child(4){animation-delay:1.5s;}


/* CIRCLE */

.circle{

width:74px;
height:74px;

margin:auto;

display:flex;
align-items:center;
justify-content:center;

border-radius:50%;

border:2px solid #3b82f6;

background:#0d1e36;

font-size:22px;
font-weight:700;

color:#5ea0ff;

position:relative;

z-index:2;

transition:
transform .35s ease,
box-shadow .35s ease,
background .35s ease;

}


/* TEXT */

.timeline-item h4{

margin-top:20px;

font-size:18px;

}

.timeline-item p{

color:#8ea2bd;

font-size:14px;

margin-top:6px;

line-height:1.5;

}


/* HOVER EFFECT */

.timeline-item:hover .circle{

transform:translateY(-6px) scale(1.08);

background:#1c3355;

box-shadow:
0 0 20px rgba(80,140,255,.4),
0 10px 40px rgba(0,0,0,.4);

}

.timeline-item:hover{

transform:translateY(-6px);

}


/* FLOATING STATIC ANIMATION */

@keyframes floatStep{

0%{transform:translateY(0);}
50%{transform:translateY(-4px);}
100%{transform:translateY(0);}

}


/* GLOW PULSE */

.circle{

animation:pulseCircle 4s infinite ease-in-out;

}

@keyframes pulseCircle{

0%{box-shadow:0 0 0 rgba(80,140,255,0);}
50%{box-shadow:0 0 20px rgba(80,140,255,.4);}
100%{box-shadow:0 0 0 rgba(80,140,255,0);}

}


/* RESPONSIVE */

@media(max-width:1000px){

.timeline{

grid-template-columns:repeat(3,1fr);
row-gap:60px;

}

.timeline::before{

display:none;

}

}

@media(max-width:600px){

.timeline{

grid-template-columns:1fr;

}

}
/* SECURITY FORM SECTION */

.security-transform{
padding:100px 40px;
}

/* MAIN GRID */

.transform-container{
max-width:1300px;
margin:auto;

display:grid;
grid-template-columns:1fr 520px;
gap:80px;
align-items:start;
}

/* IMAGE */

.transform-image img{
width:100%;
height:auto;
}

/* TABLET */

@media(max-width:1000px){

.transform-container{
grid-template-columns:1fr;
gap:50px;
}

.transform-form{
padding:35px;
}

}

/* MOBILE */

@media(max-width:600px){

.security-transform{
padding:80px 20px;
}

.transform-left h2{
font-size:34px;
}

.transform-desc{
font-size:16px;
}

.transform-form{
padding:25px;
}

}

/* FORM INPUT FIX */

@media(max-width:600px){

.form-row{
grid-template-columns:1fr;
gap:15px;
}

}
/* GLOBAL IMAGE HOVER EFFECT */

img{
  transition:
    transform .55s cubic-bezier(.22,.61,.36,1),
    filter .45s ease,
    box-shadow .45s ease;
  will-change: transform, filter;
}

.fx-image,
.image-card,
.cyber-image,
.consult-right,
.transform-image,
.cyber-hero__image-wrap,
.service-image,
.engagement-card,
.hero-image{
  overflow: hidden;
  border-radius: 18px;
}

.fx-image img,
.image-card img,
.cyber-image img,
.consult-right img,
.transform-image img,
.cyber-hero__image-wrap img,
.service-image img,
.engagement-card img,
.hero-image img{
  transform: scale(1.01);
}

/* hover zoom + cinematic light */
.fx-image:hover img,
.image-card:hover img,
.cyber-image:hover img,
.consult-right:hover img,
.transform-image:hover img,
.cyber-hero__image-wrap:hover img,
.service-image:hover img,
.engagement-card:hover img,
.hero-image:hover img{
  transform: scale(1.08);
  filter: brightness(1.08) contrast(1.06) saturate(1.08);
}

/* optional glass shine layer */
.fx-image,
.image-card,
.cyber-image,
.consult-right,
.transform-image,
.cyber-hero__image-wrap,
.service-image,
.engagement-card,
.hero-image{
  position: relative;
}

.fx-image::after,
.image-card::after,
.cyber-image::after,
.consult-right::after,
.transform-image::after,
.cyber-hero__image-wrap::after,
.service-image::after,
.engagement-card::after,
.hero-image::after{
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(
    115deg,
    transparent 20%,
    rgba(255,255,255,.18) 38%,
    rgba(255,255,255,0) 52%
  );
  transform: translateX(-120%);
  transition: transform .75s ease;
  pointer-events: none;
}

.fx-image:hover::after,
.image-card:hover::after,
.cyber-image:hover::after,
.consult-right:hover::after,
.transform-image:hover::after,
.cyber-hero__image-wrap:hover::after,
.service-image:hover::after,
.engagement-card:hover::after,
.hero-image:hover::after{
  transform: translateX(120%);
}

/* subtle shadow lift on container */
.fx-image:hover,
.image-card:hover,
.cyber-image:hover,
.consult-right:hover,
.transform-image:hover,
.cyber-hero__image-wrap:hover,
.service-image:hover,
.engagement-card:hover,
.hero-image:hover{
  box-shadow: 0 24px 60px rgba(0,0,0,.22);
  transition: box-shadow .45s ease;
}

/* =========================================================
   BUTTON EFFECTS MATCHED TO YOUR REAL BUTTON COLORS
   ========================================================= */

.cyber-btn,
.consult-btn,
.cta-btn {
  position: relative;
  overflow: hidden;
  isolation: isolate;
  transition:
    color 0.45s ease,
    background-color 0.45s ease,
    background 0.45s ease,
    border-color 0.45s ease,
    transform 0.35s ease,
    box-shadow 0.35s ease;
}

.cyber-btn::before,
.consult-btn::before,
.cta-btn::before,
.cyber-btn::after,
.consult-btn::after,
.cta-btn::after {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  z-index: 0;
  transition:
    transform 0.45s cubic-bezier(.22,1,.36,1),
    opacity 0.35s ease,
    background 0.45s ease;
}

.cyber-btn,
.consult-btn,
.cta-btn {
  z-index: 1;
}

/* moving fill layer */
.cyber-btn::before,
.consult-btn::before,
.cta-btn::before {
  transform: translateX(-102%);
}

/* gloss layer */
.cyber-btn::after,
.consult-btn::after,
.cta-btn::after {
  background: linear-gradient(
    120deg,
    transparent 0%,
    rgba(255,255,255,0.08) 35%,
    rgba(255,255,255,0.20) 50%,
    rgba(255,255,255,0.08) 65%,
    transparent 100%
  );
  transform: translateX(-130%) skewX(-20deg);
  opacity: 0;
}

.cyber-btn:hover,
.consult-btn:hover,
.cta-btn:hover {
  transform: translateY(-3px);
}

.cyber-btn:hover::before,
.consult-btn:hover::before,
.cta-btn:hover::before {
  transform: translateX(0);
}

.cyber-btn:hover::after,
.consult-btn:hover::after,
.cta-btn:hover::after {
  transform: translateX(130%) skewX(-20deg);
  opacity: 1;
}

.cyber-btn:active,
.consult-btn:active,
.cta-btn:active {
  transform: translateY(-1px);
}

/* ---------------------------------------------------------
   PRIMARY HERO BUTTON
   orange solid -> transparent orange
   --------------------------------------------------------- */
.cyber-btn--primary {
  background: #f7630c;
  color: #fff;
  border: 1px solid #f7630c;
  box-shadow: 0 14px 36px rgba(247, 99, 12, 0.22);
}

.cyber-btn--primary::before {
  background: rgba(247, 99, 12, 0.12);
}

.cyber-btn--primary:hover {
  background: transparent;
  color: #f7630c;
  border-color: #f7630c;
  box-shadow:
    0 0 0 1px rgba(247, 99, 12, 0.18),
    0 18px 42px rgba(247, 99, 12, 0.18);
}

/* ---------------------------------------------------------
   SECONDARY HERO BUTTON
   transparent -> subtle white fill
   --------------------------------------------------------- */
.cyber-btn--secondary {
  background: transparent;
  color: #f4f7fb;
  border: 1px solid rgba(255,255,255,0.14);
  box-shadow: 0 10px 24px rgba(0,0,0,0.08);
}

.cyber-btn--secondary::before {
  background: rgba(255,255,255,0.08);
}

.cyber-btn--secondary:hover {
  background: rgba(255,255,255,0.06);
  color: #ffffff;
  border-color: rgba(255,255,255,0.24);
  box-shadow:
    0 0 0 1px rgba(255,255,255,0.08),
    0 14px 30px rgba(0,0,0,0.18);
}

/* ---------------------------------------------------------
   CONSULT BUTTON
   orange solid -> transparent orange
   --------------------------------------------------------- */
.consult-btn {
  background: #f25c0d;
  color: #fff;
  border: 1px solid #f25c0d;
  box-shadow: 0 15px 30px rgba(242,92,13,.35);
}

.consult-btn::before {
  background: rgba(242,92,13,0.12);
}

.consult-btn:hover {
  background: transparent;
  color: #f25c0d;
  border-color: #f25c0d;
  box-shadow:
    0 0 0 1px rgba(242,92,13,.18),
    0 20px 40px rgba(242,92,13,.18);
}

/* ---------------------------------------------------------
   CTA FORM BUTTON
   orange gradient solid -> transparent orange outline
   --------------------------------------------------------- */
.cta-btn {
  background: linear-gradient(90deg, #ff7a32, #ff6a21);
  color: #fff;
  border: 1px solid #ff7a32;
  box-shadow: 0 10px 30px rgba(255,120,40,.35);
}

.cta-btn::before {
  background: rgba(255,120,40,0.12);
}

.cta-btn:hover {
  background: transparent;
  color: #ff7a32;
  border-color: #ff7a32;
  box-shadow:
    0 0 0 1px rgba(255,120,40,.18),
    0 18px 40px rgba(255,120,40,.20);
}

/* reduced motion */
@media (prefers-reduced-motion: reduce) {
  .cyber-btn,
  .consult-btn,
  .cta-btn,
  .cyber-btn::before,
  .consult-btn::before,
  .cta-btn::before,
  .cyber-btn::after,
  .consult-btn::after,
  .cta-btn::after {
    transition: none !important;
  }
}



/* UPDGRADES  */



section {
  position: relative;
  transition: transform .4s ease;
}

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

h2, .delivery-title, .faq-title, .cap-title {
  font-size: clamp(28px, 4vw, 44px);
  line-height: 1.2;
  letter-spacing: -0.03em;
  max-width: 900px;
  margin-left: auto;
  margin-right: auto;

  background: linear-gradient(180deg, #ffffff, #1939ad);
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
}
section::before {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;

  background:
    radial-gradient(circle at 20% 30%, rgba(80,140,255,.08), transparent 40%),
    radial-gradient(circle at 80% 70%, rgba(80,140,255,.06), transparent 40%);

  opacity: .6;
  animation: sectionGlow 12s ease-in-out infinite;
}

@keyframes sectionGlow {
  0% { opacity: .5 }
  50% { opacity: .9 }
  100% { opacity: .5 }
}
.cyber-hero__title {
  font-size: clamp(32px, 5vw, 72px);
  line-height: 1.1;
  max-width: 800px;

  /* FIX overflow issue */
  word-break: break-word;
  overflow-wrap: break-word;
  hyphens: auto;

  /* OPTIONAL: safer layout */
  white-space: normal;
}