:root {

--navy:#0b1f33;
--blue:#123f63;
--green:#22c55e;
--light:#f4f7f9;
--text:#334155;
--white:#ffffff;

}


* {

margin:0;
padding:0;
box-sizing:border-box;
font-family:"Segoe UI", Arial, sans-serif;

}


html {

scroll-behavior:smooth;

}


body {

color:var(--text);
background:white;
line-height:1.6;

}


.container {

width:90%;
max-width:1200px;
margin:auto;

}



/* HEADER */

header {

position:sticky;
top:0;
z-index:1000;
background:white;
box-shadow:0 3px 15px rgba(0,0,0,.08);

}


.nav-container {

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

}


.logo {

font-size:1.6rem;
font-weight:700;
color:var(--navy);

}


.logo span {

color:var(--green);

}



nav a {

text-decoration:none;
color:var(--navy);
margin-left:30px;
font-weight:600;

}


.menu-toggle {

display:none;
background:none;
border:none;
font-size:28px;
cursor:pointer;

}



/* HERO */

.hero {

height:85vh;
position:relative;
display:flex;
align-items:center;
background:

linear-gradient(
rgba(11,31,51,.82),
rgba(11,31,51,.82)
),

url("images/hero.jpg");

background-size:cover;
background-position:center;

color:white;

}



.hero-content {

position:relative;
max-width:800px;

}


.hero h1 {

font-size:3.2rem;
line-height:1.15;
margin-bottom:25px;

}


.hero p {

font-size:1.15rem;
margin-bottom:35px;

}




.btn {

display:inline-block;
background:var(--green);
color:white;
padding:14px 28px;
border-radius:8px;
text-decoration:none;
font-weight:700;
border:none;
cursor:pointer;

}



.btn.secondary {

background:transparent;
border:2px solid white;
margin-left:15px;

}



/* SECTIONS */


section {

padding:90px 0;

}


h2 {

text-align:center;
font-size:2.2rem;
color:var(--navy);
margin-bottom:40px;

}


.about p {

max-width:900px;
margin:auto;
text-align:center;
font-size:1.1rem;

}



/* SERVICES */


.services {

background:var(--light);

}


.cards {

display:grid;
grid-template-columns:repeat(auto-fit,minmax(260px,1fr));
gap:25px;

}


.card {

background:white;
padding:35px;
border-radius:14px;
box-shadow:0 8px 25px rgba(0,0,0,.08);

}



.card h3 {

color:var(--navy);
margin-bottom:15px;

}



/* INDUSTRIES */


.industry-grid {

display:grid;
grid-template-columns:repeat(auto-fit,minmax(220px,1fr));
gap:20px;

}


.industry-grid div {

background:var(--navy);
color:white;
padding:25px;
border-radius:10px;
text-align:center;
font-weight:600;

}



/* PROCESS */


.steps {

display:grid;
grid-template-columns:repeat(auto-fit,minmax(220px,1fr));
gap:25px;

}


.step {

background:#fff;
padding:30px;
border-left:5px solid var(--green);
box-shadow:0 5px 20px rgba(0,0,0,.06);

}


.step h3 {

color:var(--navy);

}





/* CONTACT */


.contact {

background:var(--light);
text-align:center;

}



.contact-form {

max-width:600px;
margin:40px auto;
display:flex;
flex-direction:column;
gap:15px;

}


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

padding:15px;
border-radius:8px;
border:1px solid #cbd5e1;
font-size:1rem;

}


.contact-form textarea {

height:140px;

}


.contact-info {

font-size:1.1rem;
margin-top:25px;
font-weight:600;

}



/* FOOTER */


footer {

background:var(--navy);
color:white;
text-align:center;
padding:25px;

}





/* MOBILE */

@media(max-width:768px){


nav {

display:none;
position:absolute;
top:75px;
left:0;
right:0;
background:white;
padding:20px;

}


nav.active {

display:flex;
flex-direction:column;

}


nav a {

margin:12px 0;

}


.menu-toggle {

display:block;

}


.hero h1 {

font-size:2.2rem;

}


.hero-buttons {

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

}


.btn.secondary {

margin-left:0;

}

}