:root{
  --black:#070707; --black-2:#111; --dark:#181818; --gray:#6d6d6d;
  --light:#f5f5f5; --white:#fff; --line:#dedede;
  --max:1180px; --radius:4px;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;font-family:Inter,Arial,sans-serif;color:#111;background:#fff;line-height:1.6}
a{text-decoration:none;color:inherit}
.container{width:min(var(--max),calc(100% - 48px));margin:auto}
.site-header{position:absolute;top:0;left:0;width:100%;z-index:20;background:rgba(5,5,5,.8);border-bottom:1px solid rgba(255,255,255,.08)}
.nav-wrap{height:74px;display:flex;align-items:center;gap:30px}
.brand img{display:block;width:155px;height:48px;object-fit:contain;mix-blend-mode:screen}
.main-nav{display:flex;gap:26px;margin-left:auto}
.main-nav a,.social-top a{color:#fff;font-size:12px;font-weight:600;opacity:.92;transition:.2s}
.main-nav a:hover,.social-top a:hover{opacity:.6}
.social-top{display:flex;gap:14px;align-items:center;margin-left:12px}
.social-top a{width:22px;height:22px;display:grid;place-items:center;border:1px solid rgba(255,255,255,.35);font-size:11px}
.menu-btn{display:none;background:none;border:0;color:#fff;font-size:25px}
.hero{min-height:680px;position:relative;background-image:url("https://images.unsplash.com/photo-1521737711867-e3b97375f902?auto=format&fit=crop&w=2200&q=85");background-size:cover;background-position:center}
.hero-overlay{position:absolute;inset:0;background:linear-gradient(90deg,rgba(0,0,0,.87) 0%,rgba(0,0,0,.62) 48%,rgba(0,0,0,.20) 100%)}
.hero-content{position:relative;z-index:2;padding-top:185px;color:#fff;max-width:720px}
.eyebrow{font-size:11px;letter-spacing:2px;font-weight:700;display:inline-block}
.hero h1{font-size:58px;line-height:1.03;margin:18px 0 18px;font-weight:800;letter-spacing:-2px}
.hero-lead{font-size:17px;max-width:600px;color:#eee}
.hero-actions{display:flex;gap:12px;margin-top:28px}
.btn{display:inline-flex;align-items:center;justify-content:center;min-height:46px;padding:0 24px;border-radius:3px;font-weight:700;font-size:12px;border:1px solid transparent;cursor:pointer}
.btn-light{background:#fff;color:#111}.btn-light:hover{background:#ddd}
.btn-outline{border-color:#fff;color:#fff}.btn-outline:hover{background:#fff;color:#111}
.section{padding:90px 0}
.section-heading{text-align:center;margin-bottom:42px}
.eyebrow.dark{color:#777}
.section-heading h2{font-size:35px;line-height:1.15;margin:8px 0 12px;letter-spacing:-1px}
.section-heading p{color:#6b6b6b;margin:0}
.heading-line{width:46px;height:2px;background:#111;display:block;margin:16px auto}
.services-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:14px}
.service-card{border:1px solid #e5e5e5;padding:34px 25px;min-height:210px;text-align:center;transition:.25s;background:#fff}
.service-card:hover{transform:translateY(-5px);box-shadow:0 16px 35px rgba(0,0,0,.08)}
.service-icon{width:52px;height:52px;margin:0 auto 18px;border:1px solid #111;display:grid;place-items:center;clip-path:polygon(25% 6.7%,75% 6.7%,100% 50%,75% 93.3%,25% 93.3%,0 50%);font-weight:800;font-size:20px}
.service-card h3{font-size:15px;margin:0 0 9px}.service-card p{font-size:12px;color:#666;margin:0}
.impact{background:#0c0c0c;color:#fff;display:grid;grid-template-columns:1fr 1fr;min-height:390px}
.impact-image{background:url("https://images.unsplash.com/photo-1497366811353-6870744d04b2?auto=format&fit=crop&w=1500&q=80") center/cover;filter:grayscale(1)}
.impact-content{padding:65px max(40px,calc((100vw - var(--max))/2)) 55px 60px;display:flex;flex-direction:column;justify-content:center}
.impact-content h2{font-size:36px;margin:8px 0}.impact-content p{color:#c7c7c7;max-width:550px}
.metrics{display:grid;grid-template-columns:repeat(4,1fr);margin-top:28px}
.metric{padding:0 18px;border-left:1px solid #444}.metric:first-child{padding-left:0;border-left:0}
.metric strong{display:block;font-size:27px}.metric span{display:block;color:#bbb;font-size:11px;margin-top:4px}
.cases{background:#fafafa}
.testimonials{display:grid;grid-template-columns:repeat(5,1fr);gap:12px}
.testimonial{background:#fff;border:1px solid #e7e7e7;padding:25px 18px;min-height:265px;display:flex;flex-direction:column}
.quote{font-size:42px;line-height:.7;font-weight:800}.testimonial p{font-size:12px;color:#555;flex:1}
.client{display:flex;align-items:center;gap:9px;border-top:1px solid #eee;padding-top:14px}
.avatar{width:34px;height:34px;border-radius:50%;background:#222;color:#fff;display:grid;place-items:center;font-size:10px;font-weight:700}
.client strong{display:block;font-size:11px}.client small{font-size:9px;color:#777}
.case-dots{text-align:center;margin-top:22px}.case-dots span{width:6px;height:6px;border-radius:50%;background:#ccc;display:inline-block;margin:0 4px}.case-dots .active{background:#111}
.contact{background:#0b0b0b;color:#fff;padding:78px 0}
.contact-grid{display:grid;grid-template-columns:1fr 1.15fr;gap:70px}
.contact-copy h2{font-size:39px;line-height:1.1;margin:10px 0 16px}.contact-copy p{color:#bbb;max-width:430px}
.contact-items{margin:30px 0}.contact-items>div{display:flex;gap:15px;margin:18px 0}.contact-items span{font-size:20px;width:25px}.contact-items strong{display:block;font-size:12px}.contact-items small{display:block;color:#aaa;font-size:10px}
.btn-whatsapp{border:1px solid #777;color:#fff;margin-top:4px}.btn-whatsapp:hover{background:#fff;color:#111}
.contact-form{display:flex;flex-direction:column;gap:12px}
.form-row{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.contact-form input,.contact-form select,.contact-form textarea{width:100%;border:1px solid #444;background:#191919;color:#fff;padding:14px;font:inherit;font-size:12px;border-radius:3px;outline:none}
.contact-form input:focus,.contact-form select:focus,.contact-form textarea:focus{border-color:#aaa}
.contact-form option{color:#111}
.submit-btn{width:100%;margin-top:3px}.form-note{color:#888;font-size:9px}.form-note code{color:#bbb}
.footer{background:#080808;color:#fff;border-top:1px solid #222}
.footer-grid{display:grid;grid-template-columns:2fr 1fr 1.3fr 1fr;gap:50px;padding:48px 0}
.footer-brand img{width:150px;height:46px;object-fit:contain;mix-blend-mode:screen}
.footer-brand p{color:#999;font-size:11px;max-width:250px}
.footer h4{font-size:10px;letter-spacing:1px;margin:4px 0 17px}.footer a{display:block;color:#aaa;font-size:10px;margin:9px 0}.footer a:hover{color:#fff}
.footer-bottom{border-top:1px solid #222;padding:17px 0;display:flex;justify-content:space-between;color:#777;font-size:9px}
@media(max-width:900px){
  .main-nav{display:none;position:absolute;top:74px;left:0;right:0;background:#080808;padding:20px 24px;flex-direction:column;gap:15px}
  .main-nav.open{display:flex}.social-top{margin-left:auto}.menu-btn{display:block}
  .services-grid{grid-template-columns:repeat(2,1fr)}.testimonials{grid-template-columns:repeat(2,1fr)}
  .impact{grid-template-columns:1fr}.impact-image{min-height:260px}.impact-content{padding:50px 24px}
  .contact-grid{grid-template-columns:1fr}.footer-grid{grid-template-columns:repeat(2,1fr)}
}
@media(max-width:560px){
  .container{width:min(var(--max),calc(100% - 30px))}
  .nav-wrap{height:65px}.brand img{width:135px}.social-top{display:none}
  .hero{min-height:650px}.hero-content{padding-top:155px}.hero h1{font-size:42px}.hero-lead{font-size:14px}
  .hero-actions{flex-direction:column;align-items:flex-start}.btn{min-height:44px}
  .section{padding:65px 0}.section-heading h2{font-size:28px}
  .services-grid,.testimonials,.form-row,.footer-grid{grid-template-columns:1fr}
  .service-card{min-height:auto}.metrics{grid-template-columns:repeat(2,1fr);gap:20px}.metric:nth-child(3){border-left:0;padding-left:0}
  .contact-copy h2{font-size:31px}.footer-bottom{flex-direction:column;gap:8px}
}