body{
margin:0;
font-family:'Segoe UI', Arial, sans-serif;
background:#ffffff;
color:#1f2937;
}

.hero-white{
height:90vh;
display:flex;
align-items:center;
justify-content:center;
text-align:center;
background:linear-gradient(180deg,#ffffff,#f8fafc);
padding:20px;
}

.hero-content h1{
font-size:3rem;
font-weight:700;
color:#111827;
margin-bottom:20px;
}

.hero-content p{
font-size:1.2rem;
color:#4b5563;
max-width:600px;
margin:auto;
margin-bottom:30px;
}

.btn-primary{
display:inline-block;
background:#2563eb;
color:white;
padding:14px 32px;
border-radius:30px;
text-decoration:none;
font-weight:600;
transition:0.3s;
}

.btn-primary:hover{
background:#1d4ed8;
}

.section{
padding:80px 20px;
text-align:center;
background:white;
}

.section h2{
font-size:2rem;
margin-bottom:40px;
color:#111827;
}

.grid{
display:grid;
grid-template-columns:repeat(auto-fit,minmax(280px,1fr));
gap:30px;
max-width:1200px;
margin:auto;
}

.card{
background:#f9fafb;
padding:30px;
border-radius:12px;
box-shadow:0 10px 30px rgba(0,0,0,0.05);
transition:0.3s;
}

.card:hover{
transform:translateY(-5px);
box-shadow:0 20px 40px rgba(0,0,0,0.08);
}

.card i{
font-size:2rem;
color:#2563eb;
margin-bottom:15px;
}

.pricing{
padding:80px 20px;
background:#f8fafc;
display:flex;
justify-content:center;
gap:40px;
flex-wrap:wrap;
}

.price-card{
background:white;
padding:40px;
border-radius:15px;
box-shadow:0 15px 40px rgba(0,0,0,0.05);
width:300px;
}

.price-card h1{
color:#2563eb;
}

.contact{
padding:80px 20px;
background:white;
}

.contact form{
max-width:500px;
margin:auto;
display:flex;
flex-direction:column;
gap:15px;
}

.contact input, 
.contact textarea{
padding:12px;
border:1px solid #e5e7eb;
border-radius:8px;
}

.contact button{
padding:14px;
background:#2563eb;
border:none;
color:white;
border-radius:8px;
cursor:pointer;
font-weight:600;
}

.contact button:hover{
background:#1d4ed8;
}

footer{
background:#111827;
color:#9ca3af;
padding:30px;
text-align:center;
}

.lang{
margin-top:15px;
}

.lang a{
color:#2563eb;
text-decoration:none;
margin:0 5px;
font-weight:500;
}
.hero-image{
background:white;
padding:80px 20px;
}

.hero-container{
display:flex;
align-items:center;
justify-content:center;
gap:60px;
max-width:1300px;
margin:auto;
flex-wrap:wrap;
}

.hero-text{
flex:1;
min-width:300px;
}

.hero-text h1{
font-size:3rem;
color:#111827;
margin-bottom:20px;
}

.hero-text p{
font-size:1.2rem;
color:#4b5563;
margin-bottom:30px;
max-width:500px;
}

.hero-img{
flex:1;
text-align:center;
}

.hero-img img{
max-width:100%;
height:auto;
border-radius:10px;
box-shadow:0 25px 50px rgba(0,0,0,0.08);
}
/* =========================
   HERO PREMIUM FULL WIDTH
========================= */

.hero-premium{
position:relative;
min-height:100vh;
background:linear-gradient(135deg,#f8fafc 0%, #ffffff 40%, #eef2ff 100%);
display:flex;
flex-direction:column;
align-items:center;
justify-content:center;
text-align:center;
overflow:hidden;
padding:60px 20px;
}

/* Glass overlay */

.hero-overlay{
position:absolute;
width:100%;
height:100%;
background:radial-gradient(circle at 50% 30%, rgba(59,130,246,0.08), transparent 60%);
z-index:0;
}

/* Content */

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

.hero-content-premium h1{
font-size:3.5rem;
font-weight:800;
color:#111827;
margin-bottom:20px;
}

.hero-content-premium p{
font-size:1.2rem;
color:#4b5563;
margin-bottom:30px;
}

/* Button already exists but refine */

.btn-primary{
background:linear-gradient(90deg,#2563eb,#3b82f6);
box-shadow:0 10px 25px rgba(37,99,235,0.3);
}

/* Image wrapper */

.hero-image-wrapper{
position:relative;
margin-top:60px;
z-index:2;
animation:float 6s ease-in-out infinite;
}

.hero-image-wrapper img{
max-width:1200px;
width:100%;
border-radius:20px;
box-shadow:0 40px 80px rgba(0,0,0,0.1);
transition:transform 0.6s ease;
}

/* Subtle zoom effect */

.hero-image-wrapper img:hover{
transform:scale(1.03);
}

/* Floating animation */

@keyframes float{
0%{ transform:translateY(0px); }
50%{ transform:translateY(-15px); }
100%{ transform:translateY(0px); }
}

/* Fade animations */

.fade-up{
opacity:0;
transform:translateY(30px);
animation:fadeUp 1s forwards;
}

.delay-1{ animation-delay:0.3s; }
.delay-2{ animation-delay:0.6s; }

@keyframes fadeUp{
to{
opacity:1;
transform:translateY(0);
}
}

.fade-in{
opacity:0;
animation:fadeIn 1.5s forwards;
animation-delay:0.8s;
}

@keyframes fadeIn{
to{ opacity:1; }
}

/* Responsive */

@media(max-width:768px){

.hero-content-premium h1{
font-size:2.2rem;
}

.hero-image-wrapper{
margin-top:40px;
}

}
.clients{
padding:80px 20px;
background:#f9fafb;
text-align:center;
}

.clients h2{
font-size:2rem;
margin-bottom:50px;
color:#111827;
}

.logos{
display:flex;
flex-wrap:wrap;
justify-content:center;
align-items:center;
gap:60px;
max-width:1200px;
margin:auto;
}

.logo-item{
filter:grayscale(100%);
opacity:0.7;
transition:all 0.3s ease;
}

.logo-item img{
max-height:70px;
max-width:180px;
object-fit:contain;
}

.logo-item:hover{
filter:grayscale(0%);
opacity:1;
transform:scale(1.05);
}
.clients{
padding:80px 20px;
background:#f9fafb;
text-align:center;
overflow:hidden;
}

.clients h2{
font-size:2rem;
margin-bottom:50px;
color:#111827;
}

.carousel{
overflow:hidden;
position:relative;
width:100%;
}

.carousel-track{
display:flex;
gap:80px;
animation:scroll 25s linear infinite;
width:max-content;
}

.logo-item{
display:flex;
align-items:center;
justify-content:center;
filter:grayscale(100%);
opacity:0.6;
transition:0.3s;
}

.logo-item img{
max-height:70px;
max-width:180px;
object-fit:contain;
}

.logo-item:hover{
filter:grayscale(0%);
opacity:1;
transform:scale(1.05);
}

@keyframes scroll{
0%{
transform:translateX(0);
}
100%{
transform:translateX(-50%);
}
}