/* ===== RESET ===== */

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

html{scroll-behavior:smooth;}

body{
    font-family:'Inter',sans-serif;
    background:#f8fafc;
    color:#1f2937;
    line-height:1.7;
}

.container{width:90%;max-width:1200px;margin:auto;}

header{
    position:sticky;
    top:0;
    background:white;
    z-index:999;
    box-shadow:0 2px 10px rgba(0,0,0,.05);
}

header .container{
    display:flex;
    justify-content:space-between;
    align-items:center;
    padding:20px 0;
}

.logo img{height:70px;width:auto;display:block;}

nav{display:flex;gap:30px;}

nav a{text-decoration:none;color:#374151;font-weight:600;transition:.3s;}
nav a:hover{color:#0c4a6e;}

.btn{
background:#0c4a6e;
color:white;
text-decoration:none;
padding:14px 28px;
border-radius:8px;
font-weight:600;
display:inline-flex;
align-items:center;
justify-content:center;
transition:.3s;
white-space:normal;
text-align:center;
min-height:50px;
}
.btn:hover{background:#075985;}

.btn-outline{
border:2px solid #0c4a6e;
color:#0c4a6e;
padding:14px 28px;
border-radius:8px;
text-decoration:none;
font-weight:600;
margin-left:15px;
transition:.3s;
display:inline-flex;
align-items:center;
justify-content:center;
white-space:normal;
text-align:center;
min-height:50px;
}
.btn-outline:hover{background:#0c4a6e;color:white;}

.hero{padding:100px 0;}
.hero-grid{display:grid;grid-template-columns:1fr 1fr;gap:60px;align-items:center;}
.hero h1{font-size:58px;line-height:1.1;margin-bottom:25px;}
.hero h1 span{color:#0c4a6e;}
.hero p{font-size:20px;color:#4b5563;margin-bottom:35px;}
.hero-image img{width:100%;border-radius:20px;box-shadow:0 15px 40px rgba(0,0,0,.15);}

.features{background:white;padding:70px 0;}
.features .container{display:grid;grid-template-columns:repeat(4,1fr);gap:30px;}
.feature{text-align:center;}
.feature h3{margin-bottom:15px;color:#0c4a6e;}

.about{padding:100px 0;}
.about-grid{display:grid;grid-template-columns:1fr 1fr;gap:60px;align-items:center;}
.about img{width:100%;border-radius:20px;}
.about h2{font-size:40px;margin-bottom:25px;}
.about p{margin-bottom:20px;}

.services{padding:100px 0;background:white;}
.services h2,.projects h2,.contact h2{text-align:center;font-size:42px;margin-bottom:60px;}
.cards{display:grid;grid-template-columns:repeat(3,1fr);gap:30px;}
.card{background:white;padding:35px;border-radius:18px;box-shadow:0 5px 25px rgba(0,0,0,.08);transition:.3s;}
.card:hover{transform:translateY(-8px);}
.card h3{color:#0c4a6e;margin-bottom:15px;}

.projects{padding:100px 0;}
.contact{background:#0c4a6e;color:white;text-align:center;padding:100px 20px;}
.contact p{margin-bottom:35px;font-size:20px;}
footer{background:#082f49;color:white;text-align:center;padding:30px;}

@media(max-width:900px){
.hero-grid,.about-grid{grid-template-columns:1fr;}
.cards{grid-template-columns:1fr;}
.features .container{grid-template-columns:1fr 1fr;}
header .container{flex-direction:column;gap:20px;}
nav{flex-wrap:wrap;justify-content:center;}
.hero h1{font-size:42px;}
}
@media(max-width:600px){
.features .container{grid-template-columns:1fr;}
.hero{padding:60px 0;}
.hero h1{font-size:34px;}
#google_translate_element {
    margin-left:auto;
    margin-right:20px;
    font-size:14px;
}

.goog-te-gadget {
    font-family:'Inter',sans-serif !important;
    color:transparent !important;
}

.goog-te-gadget span {
    display:none;
}

.goog-te-gadget select {
    background:white;
    color:#374151;
    border:1px solid #d1d5db;
    border-radius:6px;
    padding:6px 10px;
    font-family:'Inter',sans-serif;
    font-size:14px;
    cursor:pointer;
}
    .about h2,.services h2,.projects h2,.contact h2{font-size:30px;}
}
.contact .card{
display:flex;
flex-direction:column;
align-items:center;
justify-content:space-between;
min-height:250px;
}
/* ===== Google Translate Integration ===== */

#google_translate_element {
    font-size: 14px;
}

.goog-te-gadget {
    font-family: 'Inter', sans-serif !important;
    color: transparent !important;
}

.goog-te-gadget span {
    display: none;
}

.goog-te-gadget select {
    background:white;
    color:#374151;
    border:1px solid #d1d5db;
    border-radius:6px;
    padding:6px 10px;
    font-family:'Inter',sans-serif;
    font-size:14px;
    cursor:pointer;
}
