*{box-sizing:border-box;margin:0;padding:0}
:root{--yellow:#ffdf00;--green:#00a651;--green2:#00d36b;--black:#000;--dark:#050505;--border:rgba(255,255,255,.14)}
html{scroll-behavior:smooth}
.site-body{font-family:Arial,Helvetica,sans-serif;background:#000;color:#fff;line-height:1.6;overflow-x:hidden}
.container{width:92%;max-width:1320px;margin:0 auto}
.topbar{background:#020202;border-bottom:1px solid #161616;font-size:14px}
.topbar-inner{min-height:42px;display:flex;align-items:center;gap:28px;flex-wrap:wrap}
.socials{margin-left:auto;display:flex;gap:16px;color:#ddd}
.main-header{background:rgba(0,0,0,.96);border-bottom:1px solid #151515;position:sticky;top:0;z-index:99}
.header-inner{height:170px;display:flex;align-items:center;justify-content:space-between;gap:24px}
.logo{display:flex;align-items:center;flex-shrink:0;padding:10px 0;min-width:320px}
.logo img{height:150px;max-width:520px;object-fit:contain;display:block}
.main-nav{display:flex;align-items:center;gap:30px}
.main-nav a{color:#fff;text-decoration:none;text-transform:uppercase;font-weight:800;font-size:14px;position:relative;white-space:nowrap}
.main-nav a:hover{color:var(--green2)}
.main-nav a:after{content:"";width:0;height:3px;background:var(--yellow);position:absolute;left:0;bottom:-16px;transition:.3s}
.main-nav a:hover:after{width:100%}
.quote-btn{background:var(--yellow);color:#000;padding:14px 24px;border-radius:8px;text-decoration:none;font-weight:900;text-transform:uppercase;white-space:nowrap}
.menu-btn{display:none;background:var(--yellow);border:0;padding:10px 14px;border-radius:8px;font-size:22px;font-weight:900}
.hero{min-height:100vh;background:radial-gradient(circle at 72% 32%,rgba(0,166,81,.35),transparent 28%),radial-gradient(circle at 12% 80%,rgba(255,223,0,.12),transparent 34%),#000;position:relative;overflow:hidden}
.hero:before{content:"";position:absolute;inset:0;background-image:radial-gradient(rgba(255,223,0,.18) 1px,transparent 1px);background-size:26px 26px;opacity:.12}
.hero-grid{min-height:100vh;position:relative;z-index:2;display:grid;grid-template-columns:minmax(0,1fr) minmax(360px,520px);align-items:center;gap:50px}
.green-label{color:var(--green2);font-weight:900;letter-spacing:1.5px;display:inline-block;margin-bottom:14px}
.hero h1{font-size:clamp(44px,6vw,78px);line-height:1.05;margin-bottom:22px;letter-spacing:-2px}
.hero h1 span{color:var(--yellow)}
.hero p{font-size:20px;color:#e1e1e1;max-width:650px;margin-bottom:28px}
.hero-actions{display:flex;gap:18px;flex-wrap:wrap}
.btn{display:inline-flex;align-items:center;justify-content:center;padding:15px 26px;border-radius:8px;text-decoration:none;font-weight:900;text-transform:uppercase;border:0;cursor:pointer}
.yellow{background:var(--yellow);color:#000}
.outline{color:var(--green2);border:1px solid var(--green)}








.stats-section{margin-top:-34px;position:relative;z-index:3}
.stats-grid{background:linear-gradient(135deg,var(--green),#008f45);border-radius:12px;display:grid;grid-template-columns:repeat(4,1fr);padding:28px;box-shadow:0 20px 60px rgba(0,166,81,.35)}
.stats-grid div{text-align:center;border-right:1px solid rgba(255,255,255,.25)}
.stats-grid div:last-child{border-right:0}
.stats-grid span{font-size:34px;color:var(--yellow)}
.stats-grid strong{display:block;font-size:38px}
.stats-grid p{color:var(--yellow);font-weight:800}
.services-section{padding:70px 0 90px}
.services-section h2{font-size:42px;line-height:1.2;margin-bottom:36px}
.services-section h2 span{color:var(--yellow)}
.service-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px}
.service-card{border:1px solid var(--border);background:#050505;border-radius:16px;padding:26px;min-height:210px;transition:.3s}
.service-card:hover{border-color:var(--yellow);transform:translateY(-8px)}
.service-icon{display:inline-grid;place-items:center;width:48px;height:48px;background:var(--yellow);color:#000;border-radius:14px;margin-bottom:18px}
.service-card h3{margin-bottom:12px}
.service-card p{color:#cfcfcf;font-size:14px}
.service-card a{display:inline-block;margin-top:18px;color:var(--yellow);text-decoration:none;font-weight:900}
.page-hero{padding:90px 0;background:linear-gradient(135deg,#000,#082b17);border-bottom:1px solid rgba(255,223,0,.2)}
.page-hero h1{font-size:54px}
.page-content{padding:70px 0}
.content-card{background:#050505;border:1px solid var(--border);border-radius:20px;padding:40px}
.content-card h2{font-size:34px;margin-bottom:18px}
.content-card p{color:#ddd;margin-bottom:16px}
.contact-grid{display:grid;grid-template-columns:1fr 1fr;gap:28px}
.portfolio-grid,.blog-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}
.portfolio-grid div,.blog-grid article{border:1px solid var(--border);background:#080808;border-radius:16px;padding:24px}
.portfolio-grid div{height:220px;background:linear-gradient(135deg,var(--green),#111,var(--yellow));display:flex;align-items:center;justify-content:center;font-weight:900;font-size:22px;text-align:center}
.form input,.form textarea{width:100%;padding:15px;background:#000;border:1px solid var(--border);color:#fff;border-radius:10px;margin-bottom:14px;font-size:16px}
.form textarea{min-height:150px}
.form button{background:var(--yellow);color:#000;border:0;padding:15px 28px;border-radius:8px;font-weight:900}
.footer-cta{background:var(--yellow);color:#000;padding:25px 0}
.footer-cta-inner{display:grid;grid-template-columns:1.3fr 1.5fr auto auto;align-items:center;gap:24px}
.footer-contact{display:flex;gap:14px;align-items:center}
.footer-contact span{font-size:34px}
.footer-logo{height:82px;max-width:180px;object-fit:contain}
.footer-btn{background:#000;color:var(--yellow);padding:15px 28px;border-radius:8px;text-decoration:none;font-weight:900;text-transform:uppercase;text-align:center}
.footer{background:#020202;padding:18px 0;text-align:center;color:#bbb}
.whatsapp{position:fixed;right:24px;bottom:24px;width:66px;height:66px;border-radius:50%;background:#25d366;color:#fff;text-decoration:none;display:grid;place-items:center;font-size:34px;border:4px solid #fff;z-index:999}
@media(max-width:1100px){
    .main-nav,.quote-btn{display:none}
    .menu-btn{display:block}
    .menu-open .main-nav{display:flex;position:absolute;left:0;right:0;top:142px;background:#000;flex-direction:column;padding:25px;border-top:1px solid #222}
    .hero-grid,.stats-grid,.service-grid,.contact-grid,.portfolio-grid,.blog-grid,.footer-cta-inner{grid-template-columns:1fr}
    .hero-grid{padding:60px 0;min-height:auto}
    
    
    .stats-grid div{border-right:0;border-bottom:1px solid rgba(255,255,255,.2);padding:18px 0}
    .stats-grid div:last-child{border-bottom:0}
    .footer-cta-inner{text-align:center}
    .footer-contact{justify-content:center}
}
@media(max-width:600px){
    .topbar-inner{display:block;padding:10px 0}
    .socials{display:none}
    .header-inner{height:86px}
    .logo img{height:110px}
    .menu-open .main-nav{top:128px}
    .hero h1{font-size:40px}
    .content-card{padding:24px}
}


.service-detail-head{display:flex;gap:22px;align-items:center;margin-bottom:30px}
.service-detail-icon{width:76px;height:76px;border-radius:20px;background:var(--yellow);color:#000;display:grid;place-items:center;font-size:34px;font-weight:900;flex-shrink:0}
.service-detail-section{margin:30px 0;padding-top:25px;border-top:1px solid var(--border)}
.service-detail-section h3{font-size:26px;margin-bottom:16px;color:var(--yellow)}
.detail-list{display:grid;grid-template-columns:repeat(2,1fr);gap:14px}
.detail-list div{background:#090909;border:1px solid var(--border);padding:15px;border-radius:12px}
.process-list{display:grid;gap:14px}
.process-list div{display:flex;gap:14px;align-items:center;background:#090909;border:1px solid var(--border);padding:15px;border-radius:12px}
.process-list span{width:34px;height:34px;border-radius:50%;background:var(--green);display:grid;place-items:center;font-weight:900;flex-shrink:0}
@media(max-width:700px){.service-detail-head{display:block}.service-detail-icon{margin-bottom:16px}.detail-list{grid-template-columns:1fr}}


.service-detail-banner{margin-bottom:30px}
.service-detail-banner img{
    width:100%;
    max-height:520px;
    object-fit:cover;
    border-radius:22px;
    border:1px solid rgba(255,255,255,.1);
}


.hero-slider{position:relative;min-height:100vh;background:#000}
.hero-slide{
    display:none;
    min-height:100vh;
    background:radial-gradient(circle at 72% 32%,rgba(0,166,81,.35),transparent 28%),radial-gradient(circle at 12% 80%,rgba(255,223,0,.12),transparent 34%),#000;
    background-size:cover;
    background-position:center;
}
.hero-slide.active{display:block}
.slider-dots{
    position:absolute;
    left:50%;
    bottom:34px;
    transform:translateX(-50%);
    display:flex;
    gap:10px;
    z-index:10;
}
.slider-dots button{
    width:13px;
    height:13px;
    border-radius:50%;
    border:0;
    background:rgba(255,255,255,.45);
    cursor:pointer;
}
.slider-dots button.active{background:var(--yellow)}


.hero-slider,
.hero-slide{
    width:100%;
    min-height:100vh !important;
}

.hero-slide{
    display:none;
    align-items:center;
    background-size:cover !important;
    background-position:center center !important;
    background-repeat:no-repeat !important;
    padding:120px 0;
}

.hero-slide.active{
    display:flex;
}

.hero-grid{
    width:100%;
}

.hero-text{
    max-width:760px;
    position:relative;
    z-index:5;
}

.hero-text h1{
    font-size:72px;
    line-height:1.1;
}

.hero-text p{
    font-size:20px;
    max-width:700px;
}

@media(max-width:900px){
    .hero-slide,
    .hero-slider{
        min-height:85vh !important;
    }

    .hero-text h1{
        font-size:44px;
    }

    .hero-text p{
        font-size:17px;
    }
}


.map-section{
    margin-top:60px;
}

.map-header{
    margin-bottom:24px;
}

.map-wrapper{
    overflow:hidden;
    border-radius:24px;
    border:1px solid rgba(255,255,255,.08);
    background:#0a0a0a;
}

.map-wrapper iframe{
    display:block;
}

.contact-info-box{
    margin-top:24px;
    padding:24px;
    border-radius:20px;
    background:#0c0c0c;
    border:1px solid rgba(255,255,255,.08);
}

.contact-info-box p{
    margin-bottom:14px;
}


.map-wrapper iframe{
    width:100% !important;
    min-height:450px;
    border:0 !important;
}