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

body{
font-family:'Inter',sans-serif;
color:#0f172a;
background:#ffffff;
}

.container{
max-width:1200px;
margin:auto;
padding:0 24px;
}
/* Hero Section */
*{
margin:0;
padding:0;
box-sizing:border-box;
}

body{
font-family:'Inter',sans-serif;
}

/* HERO SECTION */

.hero{

min-height:100vh;

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

padding:40px;

background:
linear-gradient(rgba(0,0,0,.55),rgba(0,0,0,.55)),
url("https://images.unsplash.com/photo-1557804506-669a67965ba0");

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

}

/* GLASS CARD */

.glass-card{

max-width:820px;
width:100%;

padding:70px 60px;

text-align:center;

background: rgba(255,255,255,0.12);

backdrop-filter: blur(14px);
-webkit-backdrop-filter: blur(14px);

border-radius:20px;

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

box-shadow:
0 20px 60px rgba(0,0,0,.35),
inset 0 1px 0 rgba(255,255,255,.4);

color:white;

}

/* TYPOGRAPHY */

.hero-box h1{

font-size:clamp(36px,5vw,64px);

font-weight:800;

line-height:1.15;

letter-spacing:-1px;

margin-bottom:20px;

}

.hero-box span{

color:#ff8c00;

}

.hero-box p{

font-size:clamp(16px,2vw,20px);

line-height:1.6;

opacity:.9;

max-width:580px;

margin:auto;

margin-bottom:40px;

}

/* BUTTONS */

.hero-buttons{

display:flex;

justify-content:center;

gap:18px;

flex-wrap:wrap;

}

.btn-primary{

background:#ff8c00;

padding:14px 34px;

border-radius:8px;

font-weight:600;

color:white;

text-decoration:none;

transition:.25s;

}

.btn-primary:hover{

transform:translateY(-3px);

}

.btn-secondary{

border:2px solid white;

padding:12px 32px;

border-radius:8px;

font-weight:600;

color:white;

text-decoration:none;

transition:.25s;

}

.btn-secondary:hover{

background:white;
color:black;

}

/* MOBILE */

@media (max-width:600px){

.glass-card{
padding:45px 25px;
}

.hero-buttons{
flex-direction:column;
}

.btn-primary,
.btn-secondary{
width:100%;
text-align:center;
}

}
/* Services */
.services{

padding:120px 20px;

background:#f8fafc;

}

.container{

max-width:1200px;

margin:auto;

}

/* Titles */

.section-title{

text-align:center;

font-size:clamp(32px,4vw,44px);

margin-bottom:10px;

}

.section-subtitle{

text-align:center;

max-width:650px;

margin:auto;

margin-bottom:80px;

font-size:18px;

opacity:.8;

}

/* Service rows */

.service-row{

display:grid;

grid-template-columns:1fr 1fr;

gap:60px;

align-items:center;

margin-bottom:100px;

}

.reverse{

direction:rtl;

}

.reverse .service-text{

direction:ltr;

}

/* Text */

.service-text h3{

font-size:28px;

margin-bottom:15px;

}

.service-text p{

margin-bottom:20px;

line-height:1.7;

opacity:.85;

}

.service-text ul{

list-style:none;

padding:0;

}

.service-text li{

margin-bottom:10px;

position:relative;

padding-left:18px;

}

.service-text li::before{

content:"✔";

position:absolute;

left:0;

color:#ff8c00;

}

/* Image */

.service-image img{

width:100%;

border-radius:14px;

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

}

/* Mobile */

@media (max-width:900px){

.service-row{

grid-template-columns:1fr;

gap:30px;

}

.reverse{

direction:ltr;

}

}
/* Work */
.process{

padding:120px 20px;

background:#f8fafc;

}

.container{

max-width:1200px;
margin:auto;

}

.process-layout{

display:grid;

grid-template-columns:1fr 1fr;

gap:70px;

align-items:center;

}

/* Illustration */

.process-illustration img{

width:100%;

border-radius:14px;

box-shadow:0 20px 50px rgba(0,0,0,.1);

}

/* Titles */

.section-title{

font-size:clamp(32px,4vw,42px);

margin-bottom:10px;

}

.section-subtitle{

margin-bottom:40px;

opacity:.8;

line-height:1.6;

}

/* Steps */

.step-item{

display:flex;

gap:18px;

margin-bottom:25px;

align-items:flex-start;

}

.step-number{

min-width:42px;
height:42px;

background:#ff8c00;

color:white;

display:flex;

align-items:center;

justify-content:center;

border-radius:50%;

font-weight:700;

}

/* Text */

.step-item h3{

font-size:20px;

margin-bottom:4px;

}

.step-item p{

opacity:.8;

line-height:1.6;

}

/* Responsive */

@media (max-width:900px){

.process-layout{

grid-template-columns:1fr;

}

.process-illustration{

order:-1;

}

}
/* About */
.about{

padding:120px 20px;

background:white;

}

.container{

max-width:1200px;

margin:auto;

}

.about-layout{

display:grid;

grid-template-columns:1fr 1fr;

gap:70px;

align-items:center;

}

/* Image */

.about-image img{

width:100%;

border-radius:14px;

box-shadow:0 20px 50px rgba(0,0,0,.1);

}

/* Text */

.about-text{

margin-bottom:20px;

line-height:1.7;

opacity:.85;

}

/* Team Cards */

.team-grid{

display:grid;

grid-template-columns:1fr 1fr;

gap:20px;

margin-top:30px;

}

.team-card{

background:#f8fafc;

padding:25px;

border-radius:10px;

border:1px solid #eee;

}

.team-card h3{

font-size:18px;

margin-bottom:8px;

}

.team-card p{

opacity:.8;

font-size:14px;

line-height:1.6;

}

/* Mobile */

@media(max-width:900px){

.about-layout{

grid-template-columns:1fr;

}

.team-grid{

grid-template-columns:1fr;

}

}
/* Contact */
.contact-section{
  padding:60px 5%;
  background: linear-gradient(135deg,#013264 60%,#ff8c00 100%);
}

.contact-container{
  display:flex;
  align-items:center;
  gap:40px;
  flex-wrap:wrap;
}

.contact-illustration img{
  width:100%;
  max-width:350px;
  height:auto;
}

.contact-form-box{
  background:white;
  padding:32px 18px;
  border-radius:16px;
  box-shadow:0 10px 30px rgba(0,0,0,0.13);
  width:100%;
  max-width:420px;
}

#contact-form input,
#contact-form select,
#contact-form textarea{
  width:100%;
  padding:12px;
  margin-bottom:15px;
  border:1px solid #ddd;
  border-radius:8px;
  font-size:16px;
}

#contact-form textarea{
  height:100px;
  resize:none;
}

#contact-form button{
  width:100%;
  padding:14px;
  border:none;
  background:#ff8c00;
  color:white;
  font-size:17px;
  border-radius:8px;
  cursor:pointer;
  font-weight:600;
  transition:.2s;
}

#contact-form button:hover{
  background:#013264;
}

.footer{
  background: linear-gradient(135deg,#013264 80%,#ff8c00 100%);
  color:white;
  text-align:center;
  padding:36px 16px;
}

.footer-container p{
  margin:5px 0;
  font-size:15px;
}

.footer-social a{
  display:inline-block;
  margin:0 8px;
  color:#ff8c00;
  font-weight:600;
  text-decoration:none;
  font-size:18px;
}

@media (max-width:900px){
  .contact-container{
    flex-direction:column;
    gap:24px;
    align-items:flex-start;
  }
  .contact-illustration img{
    max-width:100%;
    margin-bottom:18px;
  }
  .contact-form-box{
    max-width:100%;
    padding:18px 8px;
  }
  .footer{
    padding:24px 8px;
  }
}
/* Footer */
.footer{
  background: linear-gradient(135deg,#013264 80%,#ff8c00 100%);
  color:white;
  text-align:center;
  padding:36px 16px;
}

.footer-container p{
  margin:5px 0;
  font-size:15px;
}

.footer-social a{
  display:inline-block;
  margin:0 8px;
  color:#ff8c00;
  font-weight:600;
  text-decoration:none;
  font-size:18px;
}
