*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:#090c0f;color:#eef0f2;font-family:Arial,Helvetica,sans-serif}a{color:inherit;text-decoration:none}.top{height:86px;display:flex;align-items:center;padding:0 4%;position:absolute;z-index:10;width:100%;gap:45px}.brand img{width:150px;height:62px;object-fit:cover;object-position:50% 72%;filter:brightness(1.45)}.top nav{display:flex;gap:30px;margin-left:auto}.top nav a{font-size:13px;color:#d6d9dc}.outline,.secondary,.light-btn{border:1px solid #62686e;padding:14px 20px;border-radius:4px;display:inline-block}.wa{border-color:#dce900}.hero{min-height:720px;display:grid;grid-template-columns:52% 48%;background:radial-gradient(circle at 45% 30%,#1d2429 0,#0b1014 46%,#07090b 80%);overflow:hidden}.hero-copy{padding:155px 7% 60px}.eyebrow{font-size:11px;letter-spacing:3px;color:#a9afb4;font-weight:700}.hero h1{font-size:66px;line-height:.98;margin:28px 0 22px}.hero h1 span{font-weight:300;color:#aeb4ba}.hero-copy>p{max-width:550px;color:#b6bbc0;line-height:1.7;font-size:17px}.actions{display:flex;gap:14px;margin-top:30px}.primary{background:#e5f000;color:#0b0d0f;padding:16px 23px;border-radius:4px;font-weight:800}.stats{display:flex;gap:48px;margin-top:58px}.stats div{padding-right:36px;border-right:1px solid #343a3f}.stats b{font-size:28px;display:block}.stats small{color:#8e969d}.hero-scene{position:relative;background:linear-gradient(90deg,#11171b,#23292d 55%,#0b0d0f);border-left:1px solid #262c31}.hero-scene:before{content:"";position:absolute;inset:0;background:linear-gradient(115deg,transparent 40%,rgba(255,255,255,.08) 41%,transparent 45%),repeating-linear-gradient(90deg,transparent 0 150px,rgba(255,255,255,.025) 151px)}.wall-logo{position:absolute;top:130px;left:17%;width:250px;height:230px;overflow:hidden}.wall-logo img{width:100%;height:100%;object-fit:cover;object-position:50% 42%;filter:grayscale(1) contrast(1.3) brightness(1.25);mix-blend-mode:screen}.quote{position:absolute;right:8%;top:190px;color:#aab0b5;line-height:1.6}.quote i,.vertical i{display:block;width:34px;height:2px;background:#dce900;margin-top:20px}.desk{position:absolute;bottom:0;left:0;right:0;height:260px;background:linear-gradient(#171c20,#07090b)}.monitor{position:absolute;left:22%;bottom:55px;width:330px;height:190px;background:#111;border:8px solid #24282b;border-radius:8px;box-shadow:0 25px 40px #000}.monitor span{position:absolute;width:80px;height:55px;background:#333;bottom:-62px;left:118px}.screen{height:100%;overflow:hidden;background:#080b0d}.screen img{width:100%;height:100%;object-fit:cover;object-position:50% 45%;filter:grayscale(1) brightness(.8)}.plant{position:absolute;right:10%;bottom:70px;font-size:110px;color:#444}.dark-section{background:linear-gradient(90deg,#151b20,#252b30,#12171b);padding:45px 4%;display:grid;grid-template-columns:20% 80%;gap:28px}.side-intro h2,.systems h2,.services h2,.process h2,.testimonials h2,.cta h2{font-size:38px;margin:13px 0}.side-intro p,.systems p,.process p,.testimonials p,.cta p{color:#aab0b5;line-height:1.6}.project-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}.project-grid article{background:linear-gradient(#2d3439,#20262b);padding:16px;border-radius:8px;box-shadow:0 12px 35px #080a0b55}.project-grid h3{font-size:20px;margin:14px 0 5px}.project-grid p{font-size:14px;color:#abb1b6;line-height:1.5;min-height:45px}.project-grid article>a{font-weight:700;font-size:13px}.mock{height:210px;border-radius:5px;padding:20px;position:relative;overflow:hidden;background:#e8ecef;color:#111;box-shadow:inset 0 0 35px #8e969d}.mock .browser{font-size:11px;margin-bottom:32px}.mock strong{font-size:22px;display:block}.mock em{color:#1671dd;font-style:normal;font-weight:800}.mock .phone{position:absolute;right:15px;bottom:10px;width:62px;height:125px;border:6px solid #1a1c1e;border-radius:15px;background:#fff;padding:24px 5px;font-size:10px}.gis{background:#eee7df;color:#45372f}.gis .portrait{position:absolute;right:45px;bottom:0;font-size:70px;color:#9b7a58}.erva{background:linear-gradient(#173126,#55725a);color:white}.systems{min-height:420px;padding:45px 4%;display:grid;grid-template-columns:28% 47% 25%;align-items:center;background:radial-gradient(circle at 55%,#17232b,#071015 65%,#06090b)}.systems>div:first-child{padding-right:35px}.laptop{height:300px;position:relative}.system-screen{height:250px;background:#edf2f7;border:8px solid #333b40;border-radius:12px;display:flex;color:#111;overflow:hidden;box-shadow:0 30px 45px #000}.system-screen aside{width:55px;background:#152a4a;color:white;padding:20px;line-height:30px}.system-screen section{padding:20px;flex:1}.system-screen h4{font-size:20px}.kpis{display:flex;gap:10px}.kpis i{background:#fff;padding:14px;font-style:normal;border-radius:5px}.chart{height:65px;margin-top:15px;background:linear-gradient(135deg,transparent 45%,#64748b 46% 48%,transparent 49%),linear-gradient(#fff,#e8edf2)}.system-phone{position:absolute;right:0;bottom:0;width:105px;height:220px;border:7px solid #292d30;border-radius:20px;background:#f7f9fb;color:#555;padding:25px 15px;line-height:1.4;box-shadow:0 15px 30px #000}.features{list-style:none;margin:0;padding:0}.features li{padding:10px 0;color:#b9c0c5}.services{background:linear-gradient(110deg,#f2f3f4,#cfd2d5);color:#111;padding:38px 4%}.service-head{display:grid;grid-template-columns:45% 35% 20%;align-items:center}.service-head p{color:#5c6268;line-height:1.5}.light-btn{border-color:#555}.service-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:18px;margin-top:20px}.service-grid article{background:rgba(255,255,255,.3);padding:24px;border-radius:7px;min-height:160px}.service-grid b{font-size:25px}.service-grid p{color:#5e6469;line-height:1.5}.process{padding:40px 4%;display:grid;grid-template-columns:28% 72%;background:linear-gradient(90deg,#0d151a,#111a20)}.steps{display:grid;grid-template-columns:repeat(4,1fr)}.steps article{padding:10px 25px;border-left:1px solid #343c42}.steps b{font-size:25px}.steps p{font-size:13px}.testimonials{min-height:280px;background:linear-gradient(90deg,#12171b,#293036,#14191d);display:grid;grid-template-columns:18% 27% 55%;align-items:stretch}.architectural{background:linear-gradient(135deg,#3a3937,#111 45%,#2e3031 46%,#080a0b 65%)}.test-intro{padding:45px 25px}.quotes{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;padding:30px 4% 30px 0}.quotes article{background:#30373c;padding:20px;border-radius:6px}.quotes p{font-size:13px;min-height:70px}.stars{color:#e5f000;letter-spacing:2px;margin:12px 0}.cta{min-height:330px;padding:50px 4%;position:relative;overflow:hidden;background:linear-gradient(90deg,#070a0c 0,#11161a 55%,#080b0d);display:grid;grid-template-columns:42% 28% 30%;align-items:center}.accent{color:#dce900}.cta-laptop{position:absolute;right:14%;bottom:-100px;width:360px;height:240px;background:linear-gradient(145deg,#656b70,#181c1f);transform:skew(-12deg);border-radius:10px;overflow:hidden}.cta-laptop img{width:190px;height:190px;object-fit:cover;object-position:50% 43%;filter:grayscale(1) brightness(1.1);margin:25px 80px}.vertical{position:absolute;right:3%;top:90px;line-height:1.8;letter-spacing:3px;color:#9da4aa}footer{min-height:160px;padding:28px 4%;display:grid;grid-template-columns:180px 1fr 2fr;gap:25px;align-items:start;border-top:1px solid #272d31;background:#090d10;color:#aab0b5}footer img{width:150px;height:70px;object-fit:cover;object-position:50% 72%;filter:brightness(1.4)}footer nav{display:flex;justify-content:flex-end;gap:20px;font-size:12px}footer small{grid-column:1/-1;border-top:1px solid #22292e;padding-top:20px}
@media(max-width:900px){.top{position:relative;height:auto;padding:14px 5%;background:#0a0e11}.top nav{display:none}.top .wa{margin-left:auto;font-size:11px}.hero{grid-template-columns:1fr;min-height:auto}.hero-copy{padding:70px 6%}.hero h1{font-size:48px}.hero-scene{height:420px}.stats{gap:18px}.dark-section,.systems,.process,.testimonials{grid-template-columns:1fr}.project-grid,.service-grid,.steps,.quotes{grid-template-columns:1fr}.side-intro{padding-bottom:15px}.systems{gap:30px}.features{columns:2}.service-head{grid-template-columns:1fr;gap:15px}.testimonials .architectural{height:160px}.quotes{padding:20px}.cta{grid-template-columns:1fr;min-height:470px}.cta-laptop{opacity:.35}.vertical{display:none}footer{grid-template-columns:1fr}footer nav{justify-content:flex-start;flex-wrap:wrap}.hero-copy .actions{flex-direction:column}.stats{flex-wrap:wrap}}/* V8 — imagens reais dos projetos */
.photo-scene{position:relative;overflow:hidden;background:#080b0d;min-height:640px}.hero-photo{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center;filter:grayscale(1) brightness(.72) contrast(1.08)}.hero-photo-shade{position:absolute;inset:0;background:linear-gradient(90deg,rgba(7,10,12,.1),rgba(7,10,12,.42)),linear-gradient(0deg,rgba(7,10,12,.18),transparent 45%)}.photo-scene .quote{position:absolute;z-index:3;right:7%;top:28%}
.project-shot{height:300px;border-radius:4px;overflow:hidden;background:#11161a;border:1px solid rgba(255,255,255,.09);box-shadow:0 18px 42px rgba(0,0,0,.3)}.project-shot img{width:100%;height:100%;object-fit:cover;object-position:top;display:block;transition:transform .6s ease,filter .6s ease}.project-grid article:hover .project-shot img{transform:scale(1.025);filter:brightness(1.06)}
.real-system-showcase{position:relative;min-height:520px;display:flex;align-items:center;justify-content:center}.desktop-frame{width:88%;background:#0b0f13;padding:10px 10px 24px;border-radius:12px;box-shadow:0 35px 70px rgba(0,0,0,.45);transform:perspective(1000px) rotateY(-3deg)}.desktop-frame img{width:100%;display:block;border-radius:5px}.mobile-frame{position:absolute;right:0;bottom:5%;width:145px;background:#080b0e;padding:7px;border-radius:20px;box-shadow:0 25px 45px rgba(0,0,0,.5)}.mobile-frame img{width:100%;display:block;border-radius:14px}
@media(max-width:900px){.photo-scene{min-height:430px}.hero-photo{object-position:center}.project-shot{height:220px}.real-system-showcase{min-height:360px}.desktop-frame{width:96%}.mobile-frame{width:105px;right:1%}}

/* V9 — correção visual fiel ao conceito aprovado */
.brand{display:flex;align-items:center;height:70px}
.brand img{width:180px;height:58px;object-fit:contain;object-position:left center;filter:none!important}
.photo-scene{min-height:720px;background:#080b0d}
.hero-photo{filter:grayscale(1) brightness(.78) contrast(1.08);object-position:center center}
.hero-photo-shade{background:linear-gradient(90deg,rgba(8,12,15,.18),rgba(8,12,15,.03) 55%,rgba(8,12,15,.12)),linear-gradient(0deg,rgba(4,7,9,.15),transparent 40%)}
.architectural{overflow:hidden;background:#111}
.architectural img{width:100%;height:100%;object-fit:cover;display:block;filter:grayscale(1) brightness(.7) contrast(1.15)}
.cta-laptop{background:linear-gradient(145deg,#666c71,#1b2024)}
.cta-laptop img{width:62%;height:70%;object-fit:contain;object-position:center;filter:none!important;margin:12% 19%}
footer img{width:175px;height:70px;object-fit:contain;object-position:left center;filter:none!important}
@media(max-width:900px){
 .brand img{width:145px;height:48px}
 .photo-scene{min-height:460px}
 .hero-photo{object-position:center}
}

/* V10 — reconstrução visual seguindo o mockup */
.top{position:absolute;top:0;left:0;right:0;height:92px;padding:0 4%;display:grid;grid-template-columns:230px 1fr 230px;align-items:center;z-index:20}
.top nav{margin:0;justify-self:center;display:flex;gap:28px}
.top .wa{justify-self:end}
.hero{position:relative}
.hero-copy{padding-top:155px}
.photo-scene{overflow:hidden}
.hero-photo{width:100%;height:100%;object-fit:cover;object-position:center;image-rendering:auto;filter:grayscale(1) brightness(.88) contrast(1.06)}
.project-grid article{overflow:visible}
.device{height:255px;position:relative;margin:0 0 34px;padding:8px 8px 12px;background:linear-gradient(#4b5257,#22282d);border:1px solid #596167;border-radius:8px;box-shadow:0 18px 28px rgba(0,0,0,.38)}
.screenbar{height:16px;background:#11161a;border-radius:3px 3px 0 0;padding:4px 6px;display:flex;gap:4px}.screenbar i{width:5px;height:5px;border-radius:50%;background:#62696e}
.screenview{height:218px;background:white;overflow:hidden;display:flex;align-items:flex-start;justify-content:center}.screenview img{width:100%;height:100%;object-fit:contain;object-position:top center;background:#fff}
.stand{position:absolute;left:50%;bottom:-28px;width:70px;height:28px;background:linear-gradient(#5a6166,#24292d);transform:translateX(-50%);clip-path:polygon(35% 0,65% 0,82% 80%,100% 100%,0 100%,18% 80%)}
.services{padding-top:46px;padding-bottom:48px}.service-grid article{position:relative;background:rgba(255,255,255,.28);border:1px solid rgba(255,255,255,.25);padding:22px;min-height:165px;transition:.25s}.service-grid article:hover{transform:translateY(-4px);background:rgba(255,255,255,.5)}.svc-icon{width:42px;height:42px;border-radius:9px;background:#343b40;color:#fff;display:grid;place-items:center;font-size:20px;box-shadow:0 7px 12px #0002}.arrow{position:absolute;right:22px;top:22px;font-size:22px}.service-grid h3{margin-top:18px}
.process{padding-top:48px;padding-bottom:48px}.steps article{position:relative;min-height:190px;padding:0 34px}.step-icon{font-size:30px;color:#cbd0d4;margin-bottom:12px}.steps b{font-size:27px}.step-arrow{position:absolute;right:-7px;top:60px;font-size:32px;color:#aab0b5}.steps h3{margin:9px 0}.steps p{line-height:1.5}
.testimonials{min-height:315px}.architectural{min-height:315px}.test-intro{padding:55px 30px}.quotes{align-items:center}.quotes article{min-height:205px;padding:24px;box-shadow:0 12px 25px #0002}.quotes article small{display:block;color:#9fa6ac;margin-top:4px}.quotes .stars{font-size:16px}
.cta{min-height:360px;padding-top:60px;padding-bottom:60px}.cta-copy{position:relative;z-index:2}.cta .actions{position:relative;z-index:4}.cta-device{position:absolute;right:13%;bottom:-100px;width:400px;height:260px;transform:rotate(4deg) skew(-8deg);z-index:1}.cta-device .lid{width:100%;height:100%;background:linear-gradient(145deg,#72797f,#252b2f);border:1px solid #777e83;border-radius:12px;box-shadow:0 25px 45px #000;display:grid;place-items:center}.cta-device img{width:180px;height:120px;object-fit:contain;transform:skew(8deg) rotate(-4deg);filter:brightness(.7)}.cta:before{content:"";position:absolute;inset:0;background:linear-gradient(115deg,transparent 50%,rgba(255,255,255,.035) 50.2%,transparent 64%)}
@media(max-width:900px){.top{position:relative;grid-template-columns:1fr auto;height:78px}.top nav{display:none}.hero-copy{padding-top:65px}.project-grid{gap:32px}.device{height:230px}.screenview{height:193px}.cta-device{right:-80px;opacity:.28}}

/* =========================================================
   V31 — HERO RECONSTRUÍDO / SEM REGRAS CONFLITANTES
   ========================================================= */

.top{
  position:absolute;
  inset:0 0 auto 0;
  z-index:20;
  height:92px;
  padding:0 3.7%;
  display:grid;
  grid-template-columns:220px 1fr 210px;
  align-items:center;
  gap:0;
  background:transparent;
}
.top .brand{
  justify-self:start;
  display:flex;
  align-items:center;
  width:175px;
  height:70px;
}
.top .brand img{
  width:170px;
  height:64px;
  object-fit:contain;
  object-position:left center;
  filter:none;
}
.top nav{
  justify-self:start;
  margin-left:92px;
  display:flex;
  align-items:center;
  gap:29px;
}
.top nav a{
  font-size:12px;
  font-weight:500;
  color:#f0f1f2;
}

/* O botão já faz parte da arte HD.
   Este link continua por cima dele, porém invisível, mantendo o clique. */
.top .wa{
  justify-self:end;
  width:210px;
  height:48px;
  padding:0;
  border:0;
  opacity:0;
  overflow:hidden;
  white-space:nowrap;
}

.hero{
  position:relative;
  display:grid;
  grid-template-columns:52% 48%;
  width:100%;
  height:720px;
  min-height:720px;
  overflow:hidden;
  background:#091015;
}

.hero-copy{
  position:relative;
  z-index:5;
  height:720px;
  padding:145px 7.1% 55px 3.7%;
  background:
    radial-gradient(circle at 65% 28%,rgba(33,45,52,.26),transparent 53%),
    linear-gradient(90deg,#081014 0%,#0c1419 78%,#0d151a 100%);
}
.hero-copy::after{
  content:"";
  position:absolute;
  inset:0;
  z-index:-1;
  pointer-events:none;
  opacity:.22;
  background:
    repeating-linear-gradient(90deg,transparent 0 115px,rgba(255,255,255,.03) 116px),
    repeating-linear-gradient(0deg,transparent 0 82px,rgba(255,255,255,.018) 83px);
}
.hero-copy .eyebrow{
  display:block;
  font-size:11px;
  line-height:1;
  letter-spacing:3.1px;
  color:#b8c0c6;
  font-weight:700;
}
.hero h1{
  margin:25px 0 24px;
  max-width:620px;
  font-size:64px;
  line-height:1.02;
  letter-spacing:-2.4px;
  font-weight:700;
}
.hero h1 span{
  color:#aeb5ba;
  font-weight:300;
}
.hero-copy>p{
  width:100%;
  max-width:520px;
  margin:0;
  color:#c4c8cc;
  font-size:16px;
  line-height:1.65;
}
.hero-copy .actions{
  display:flex;
  align-items:stretch;
  gap:14px;
  margin-top:30px;
}
.hero-copy .actions a{
  height:52px;
  display:flex;
  align-items:center;
  justify-content:center;
  padding:0 22px;
  line-height:1;
  white-space:nowrap;
}
.hero-copy .primary{
  min-width:258px;
  background:#e8f000;
  color:#080b0d;
  font-size:14px;
  font-weight:800;
}
.hero-copy .secondary{
  min-width:184px;
  border:1px solid #626b72;
  font-size:13px;
}
.hero-copy .stats{
  display:flex;
  align-items:flex-start;
  gap:0;
  margin-top:43px;
}
.hero-copy .stats div{
  width:168px;
  min-height:50px;
  padding:0 24px 0 0;
  margin-right:24px;
  border-right:1px solid #394147;
}
.hero-copy .stats b{
  display:block;
  font-size:27px;
  line-height:1;
  margin-bottom:8px;
}
.hero-copy .stats small{
  display:block;
  color:#9da5ab;
  font-size:10px;
  line-height:1.2;
}

.hero-scene.photo-scene{
  position:relative;
  width:100%;
  height:720px;
  overflow:hidden;
  border:0;
  background:#080b0d;
}
.hero-scene .hero-photo{
  position:absolute;
  inset:0;
  z-index:1;
  display:block;
  width:100%;
  height:100%;
  max-width:none;
  object-fit:cover;
  object-position:center center;
  filter:none;
}
.hero-photo-shade{
  position:absolute;
  inset:0;
  z-index:2;
  pointer-events:none;
  background:linear-gradient(90deg,rgba(7,13,17,.16) 0%,rgba(7,13,17,.02) 15%,transparent 34%);
}

/* transição central inclinada */
.hero-scene::before{
  content:"";
  position:absolute;
  z-index:4;
  top:-2%;
  left:-1px;
  width:16%;
  height:104%;
  pointer-events:none;
  background:linear-gradient(90deg,
    #0d151a 0%,
    rgba(13,21,26,.98) 25%,
    rgba(13,21,26,.76) 54%,
    rgba(13,21,26,0) 100%);
  clip-path:polygon(0 0,100% 0,34% 100%,0 100%);
}
.hero-scene::after{content:none}

/* evita qualquer pseudo-elemento antigo na foto */
.hero-photo::before,
.hero-photo::after{content:none!important}

/* desktop intermediário */
@media (max-width:1300px) and (min-width:901px){
  .top nav{margin-left:35px;gap:22px}
  .hero h1{font-size:56px}
  .hero-copy{padding-right:5%}
  .hero-copy>p{font-size:15px}
  .hero-copy .stats div{width:145px;margin-right:18px;padding-right:18px}
}

/* mobile */
@media(max-width:900px){
  .top{
    position:absolute;
    height:78px;
    padding:0 22px;
    display:grid;
    grid-template-columns:1fr auto;
  }
  .top .brand{width:145px;height:58px}
  .top .brand img{width:140px;height:54px}
  .top nav{display:none}
  .top .wa{display:none}

  .hero{
    display:flex;
    flex-direction:column;
    height:auto;
    min-height:0;
  }
  .hero-copy{
    width:100%;
    height:auto;
    min-height:610px;
    padding:125px 24px 55px;
  }
  .hero h1{
    font-size:clamp(43px,12vw,58px);
    letter-spacing:-1.7px;
  }
  .hero-copy>p{font-size:15px}
  .hero-copy .actions{
    flex-direction:column;
    align-items:stretch;
  }
  .hero-copy .actions a{width:100%;min-width:0}
  .hero-copy .stats{
    justify-content:space-between;
    gap:10px;
  }
  .hero-copy .stats div{
    width:auto;
    flex:1;
    margin-right:0;
    padding-right:10px;
  }
  .hero-scene.photo-scene{
    width:100%;
    height:112vw;
    min-height:520px;
    max-height:760px;
  }
  .hero-scene::before{
    top:0;
    left:0;
    width:100%;
    height:16%;
    background:linear-gradient(180deg,#0d151a 0%,rgba(13,21,26,0) 100%);
    clip-path:none;
  }
}


/* =========================================================
   V32 — gradiente suave (sem faixa luminosa) + menu premium
   ========================================================= */

/* Transição central: somente sombra/gradiente escuro inclinado */
.hero-scene::before{
  content:"";
  position:absolute;
  z-index:4;
  top:-3%;
  left:-1px;
  width:21%;
  height:106%;
  pointer-events:none;
  background:linear-gradient(90deg,
    #0d151a 0%,
    rgba(13,21,26,.99) 22%,
    rgba(13,21,26,.93) 42%,
    rgba(13,21,26,.67) 63%,
    rgba(13,21,26,.30) 81%,
    rgba(13,21,26,0) 100%);
  clip-path:polygon(0 0,100% 0,30% 100%,0 100%);
  filter:none;
  box-shadow:none;
}

/* Menu um pouco maior, discreto e contemporâneo */
.top nav{
  justify-self:start;
  margin-left:70px;
  display:flex;
  align-items:center;
  gap:10px;
  padding:6px 8px;
  border:1px solid rgba(255,255,255,.045);
  border-radius:999px;
  background:rgba(10,17,21,.30);
  backdrop-filter:blur(8px);
  -webkit-backdrop-filter:blur(8px);
}
.top nav a{
  position:relative;
  display:flex;
  align-items:center;
  justify-content:center;
  min-height:36px;
  padding:0 14px;
  border-radius:999px;
  font-size:13px;
  line-height:1;
  font-weight:500;
  color:#eef1f3;
  transition:background .22s ease,color .22s ease,transform .22s ease;
}
.top nav a::after{
  content:"";
  position:absolute;
  left:50%;
  bottom:3px;
  width:0;
  height:2px;
  border-radius:2px;
  background:#e8f000;
  transform:translateX(-50%);
  transition:width .22s ease;
}
.top nav a:hover{
  color:#fff;
  background:rgba(255,255,255,.055);
  transform:translateY(-1px);
}
.top nav a:hover::after,
.top nav a:first-child::after{
  width:22px;
}
.top nav a:first-child{
  color:#f3f600;
}

/* impede qualquer brilho antigo na junção */
.hero-scene,
.hero-scene::before,
.hero-photo-shade{
  box-shadow:none!important;
}

@media (max-width:1300px) and (min-width:901px){
  .top nav{
    margin-left:28px;
    gap:5px;
  }
  .top nav a{
    padding:0 10px;
    font-size:12px;
  }
}

@media(max-width:900px){
  .hero-scene::before{
    width:100%;
    height:17%;
    top:0;
    left:0;
    clip-path:none;
    background:linear-gradient(180deg,#0d151a 0%,rgba(13,21,26,.88) 30%,rgba(13,21,26,0) 100%);
  }
}


/* =========================================================
   V33 — JUNÇÃO FLUIDA IGUAL AO MOCKUP
   Sem recorte/clip-path visível. A foto entra gradualmente
   por baixo do painel escuro.
   ========================================================= */

.hero{
  grid-template-columns:52% 48%;
}

/* deixa a cena avançar para baixo do lado esquerdo */
.hero-scene.photo-scene{
  overflow:visible;
}

.hero-scene .hero-photo{
  left:-18%;
  width:118%;
  right:auto;
  object-position:center center;
}

/* remove totalmente a antiga cunha geométrica */
.hero-scene::before{
  content:none!important;
}

/* sombreado contínuo sobre a parte da foto que invade o lado esquerdo */
.hero-photo-shade{
  position:absolute;
  z-index:3;
  top:0;
  bottom:0;
  left:-18%;
  width:64%;
  height:100%;
  pointer-events:none;
  background:linear-gradient(90deg,
    #0d151a 0%,
    rgba(13,21,26,.995) 20%,
    rgba(13,21,26,.97) 36%,
    rgba(13,21,26,.88) 50%,
    rgba(13,21,26,.66) 64%,
    rgba(13,21,26,.38) 76%,
    rgba(13,21,26,.15) 88%,
    rgba(13,21,26,0) 100%);
  clip-path:none;
  filter:none;
}

/* o painel de texto termina suavemente, em vez de formar uma borda */
.hero-copy{
  background:
    radial-gradient(circle at 65% 28%,rgba(33,45,52,.24),transparent 53%),
    linear-gradient(90deg,
      #081014 0%,
      #0b1318 72%,
      rgba(11,19,24,.98) 82%,
      rgba(11,19,24,.78) 90%,
      rgba(11,19,24,.28) 97%,
      rgba(11,19,24,0) 100%);
}

/* cria uma faixa de mistura larga e orgânica exatamente na junção */
.hero-copy::before{
  content:"";
  position:absolute;
  z-index:-1;
  top:0;
  right:-150px;
  width:245px;
  height:100%;
  pointer-events:none;
  background:linear-gradient(100deg,
    rgba(11,19,24,.98) 0%,
    rgba(11,19,24,.90) 25%,
    rgba(11,19,24,.68) 48%,
    rgba(11,19,24,.38) 68%,
    rgba(11,19,24,.14) 84%,
    rgba(11,19,24,0) 100%);
  clip-path:polygon(0 0,100% 0,42% 100%,0 100%);
}

/* mantém o grid sutil, sem transformar a junção numa linha */
.hero-copy::after{
  mask-image:linear-gradient(90deg,#000 0%,#000 78%,transparent 100%);
  -webkit-mask-image:linear-gradient(90deg,#000 0%,#000 78%,transparent 100%);
}

@media (max-width:1300px) and (min-width:901px){
  .hero-scene .hero-photo{
    left:-15%;
    width:115%;
  }
  .hero-photo-shade{
    left:-15%;
    width:61%;
  }
  .hero-copy::before{
    right:-125px;
    width:210px;
  }
}

@media(max-width:900px){
  .hero-scene.photo-scene{
    overflow:hidden;
  }
  .hero-scene .hero-photo{
    left:0;
    width:100%;
  }
  .hero-photo-shade{
    left:0;
    top:0;
    width:100%;
    height:22%;
    background:linear-gradient(180deg,
      #0d151a 0%,
      rgba(13,21,26,.92) 30%,
      rgba(13,21,26,.52) 62%,
      rgba(13,21,26,0) 100%);
  }
  .hero-copy::before{
    content:none;
  }
}


/* =========================================================
   V35 — CORREÇÃO PONTUAL
   Mantém EXATAMENTE o tamanho/posição da foto da V33.
   Suaviza somente a emenda central.
   ========================================================= */

/* fotografia volta exatamente à geometria da V33 */
.hero-scene .hero-photo{
  left:-18%;
  width:118%;
  right:auto;
  object-position:center center;
}

/* degradê mais longo SEM alterar a foto */
.hero-photo-shade{
  left:-18%;
  width:76%;
  background:linear-gradient(90deg,
    #0d151a 0%,
    rgba(13,21,26,1) 12%,
    rgba(13,21,26,.995) 24%,
    rgba(13,21,26,.975) 35%,
    rgba(13,21,26,.92) 46%,
    rgba(13,21,26,.82) 56%,
    rgba(13,21,26,.68) 66%,
    rgba(13,21,26,.51) 75%,
    rgba(13,21,26,.34) 83%,
    rgba(13,21,26,.20) 89%,
    rgba(13,21,26,.10) 94%,
    rgba(13,21,26,.035) 98%,
    rgba(13,21,26,0) 100%);
}

/* painel esquerdo deixa de terminar visualmente no 52% */
.hero-copy{
  margin-right:0;
  background:
    radial-gradient(circle at 65% 28%,rgba(33,45,52,.24),transparent 53%),
    linear-gradient(90deg,
      #081014 0%,
      #0b1318 67%,
      rgba(11,19,24,.995) 76%,
      rgba(11,19,24,.95) 83%,
      rgba(11,19,24,.78) 89%,
      rgba(11,19,24,.52) 94%,
      rgba(11,19,24,.25) 97%,
      rgba(11,19,24,0) 100%);
}

/* sobreposição larga, sem faixa luminosa e sem mudar escala da imagem */
.hero-copy::before{
  right:-205px;
  width:315px;
  background:linear-gradient(98deg,
    rgba(11,19,24,1) 0%,
    rgba(11,19,24,.99) 17%,
    rgba(11,19,24,.95) 31%,
    rgba(11,19,24,.86) 44%,
    rgba(11,19,24,.72) 56%,
    rgba(11,19,24,.56) 67%,
    rgba(11,19,24,.39) 77%,
    rgba(11,19,24,.24) 85%,
    rgba(11,19,24,.12) 92%,
    rgba(11,19,24,.045) 97%,
    rgba(11,19,24,0) 100%);
  clip-path:polygon(0 0,100% 0,50% 100%,0 100%);
}

/* evita que o grid sutil denuncie o limite das colunas */
.hero-copy::after{
  mask-image:linear-gradient(90deg,#000 0%,#000 68%,rgba(0,0,0,.6) 78%,transparent 94%);
  -webkit-mask-image:linear-gradient(90deg,#000 0%,#000 68%,rgba(0,0,0,.6) 78%,transparent 94%);
}

@media (max-width:1300px) and (min-width:901px){
  .hero-scene .hero-photo{
    left:-15%;
    width:115%;
  }
  .hero-photo-shade{
    left:-15%;
    width:72%;
  }
  .hero-copy::before{
    right:-175px;
    width:275px;
  }
}

@media(max-width:900px){
  .hero-scene .hero-photo{
    left:0;
    width:100%;
  }
  .hero-photo-shade{
    left:0;
    width:100%;
  }
}


/* =========================================================
   V36 — TRANSIÇÃO CENTRAL DA V22
   Mantém conteúdo, menu, card, botões e enquadramento atual.
   Apenas substitui as camadas que fazem a junção esquerda/foto.
   ========================================================= */

@media (min-width:901px){

  /* Mantém a geometria/enquadramento atual da fotografia. */
  .hero-scene .hero-photo{
    left:-18% !important;
    width:118% !important;
    right:auto !important;
    object-position:center center !important;
  }

  /* Remove a camada estreita das V34/V35, que denunciava a emenda. */
  .hero-photo-shade{
    display:none !important;
  }

  /* Remove totalmente a cunha/clip-path das versões recentes. */
  .hero-copy::before{
    display:none !important;
    content:none !important;
  }

  /* Fundo esquerdo igual à lógica visual da V22:
     termina progressivamente em transparência, sem borda definida. */
  .hero-copy{
    background:
      radial-gradient(circle at 37% 32%,
        rgba(32,42,48,.30),
        transparent 48%),
      linear-gradient(90deg,
        #080d11 0%,
        #0b1115 67%,
        rgba(11,17,21,.96) 75%,
        rgba(11,17,21,.82) 82%,
        rgba(11,17,21,.60) 88%,
        rgba(11,17,21,.36) 93%,
        rgba(11,17,21,.16) 97%,
        rgba(11,17,21,0) 100%) !important;
  }

  /* Camada larga sobre a própria fotografia, copiada da abordagem da V22.
     Ela começa totalmente escura e desaparece aos poucos sobre a foto. */
  .hero-scene.photo-scene::after{
    content:"" !important;
    display:block !important;
    position:absolute !important;
    z-index:5 !important;
    inset:0 !important;
    pointer-events:none !important;
    background:
      linear-gradient(105deg,
        #080d11 0%,
        rgba(8,13,17,.995) 5%,
        rgba(8,13,17,.96) 12%,
        rgba(8,13,17,.86) 20%,
        rgba(8,13,17,.64) 29%,
        rgba(8,13,17,.36) 38%,
        rgba(8,13,17,.14) 47%,
        rgba(8,13,17,.035) 55%,
        rgba(8,13,17,0) 63%) !important;
  }

  /* Grade permanece apenas no lado escuro e some antes da transição. */
  .hero-copy::after{
    mask-image:linear-gradient(90deg,#000 0%,#000 64%,rgba(0,0,0,.55) 76%,transparent 90%) !important;
    -webkit-mask-image:linear-gradient(90deg,#000 0%,#000 64%,rgba(0,0,0,.55) 76%,transparent 90%) !important;
  }
}

@media(max-width:900px){
  .hero-scene.photo-scene::after{
    content:none !important;
  }
  .hero-photo-shade{
    display:block !important;
  }
}


/* =========================================================
   V37 — CORREÇÃO DA DIVISÃO SECA
   A V36 ainda mantinha as duas colunas lado a lado.
   Aqui usamos a mecânica REAL da V22: a foto começa POR BAIXO
   do painel esquerdo e o degradê acontece sobre a própria foto.
   Todo o conteúdo visual atual permanece inalterado.
   ========================================================= */

@media (min-width:901px){

  .hero{
    position:relative !important;
    display:block !important;
    height:720px !important;
    min-height:720px !important;
    overflow:hidden !important;
    background:#080d11 !important;
  }

  /* Foto sobreposta como na V22 */
  .hero-scene.photo-scene{
    position:absolute !important;
    z-index:1 !important;
    top:0 !important;
    right:0 !important;
    bottom:0 !important;
    left:42.5% !important;
    width:auto !important;
    height:720px !important;
    min-height:720px !important;
    margin:0 !important;
    border:0 !important;
    overflow:hidden !important;
    background:#080b0d !important;
  }

  .hero-scene.photo-scene .hero-photo{
    position:absolute !important;
    inset:0 !important;
    left:0 !important;
    right:0 !important;
    width:100% !important;
    height:100% !important;
    object-fit:cover !important;
    object-position:48% center !important;
    filter:none !important;
  }

  /* remove todos os antigos sombreadores */
  .hero-photo-shade{
    display:none !important;
  }

  .hero-copy::before{
    display:none !important;
    content:none !important;
  }

  /* degradê original da V22, sobre a fotografia */
  .hero-scene.photo-scene::after{
    content:"" !important;
    display:block !important;
    position:absolute !important;
    z-index:5 !important;
    inset:0 !important;
    pointer-events:none !important;
    background:
      linear-gradient(105deg,
        #080d11 0%,
        rgba(8,13,17,.995) 5%,
        rgba(8,13,17,.96) 12%,
        rgba(8,13,17,.86) 20%,
        rgba(8,13,17,.64) 29%,
        rgba(8,13,17,.36) 38%,
        rgba(8,13,17,.14) 47%,
        rgba(8,13,17,.035) 55%,
        rgba(8,13,17,0) 63%) !important;
  }

  /* painel esquerdo também termina transparente, como na V22 */
  .hero-copy{
    position:relative !important;
    z-index:10 !important;
    width:55% !important;
    height:720px !important;
    box-sizing:border-box !important;
    background:
      radial-gradient(circle at 37% 32%,rgba(32,42,48,.30),transparent 48%),
      linear-gradient(90deg,
        #080d11 0%,
        #0b1115 72%,
        rgba(11,17,21,.72) 90%,
        rgba(11,17,21,0) 100%) !important;
    overflow:visible !important;
  }

  /* mantém a grade sutil sem criar borda na emenda */
  .hero-copy::after{
    content:"" !important;
    display:block !important;
    position:absolute !important;
    inset:0 7% 0 0 !important;
    z-index:-1 !important;
    pointer-events:none !important;
    opacity:.22 !important;
    background:
      repeating-linear-gradient(90deg,transparent 0 112px,rgba(255,255,255,.028) 113px),
      repeating-linear-gradient(0deg,transparent 0 82px,rgba(255,255,255,.022) 83px) !important;
    mask-image:none !important;
    -webkit-mask-image:none !important;
  }

  /* o conteúdo da foto fica acima do degradê */
  .photo-scene .quote,
  .photo-scene .photo-quote,
  .photo-scene .scene-quote,
  .photo-scene .hero-quote{
    z-index:20 !important;
  }
}

@media (max-width:1400px) and (min-width:901px){
  .hero-scene.photo-scene{
    left:43% !important;
  }
  .hero-copy{
    width:57% !important;
  }
}

@media (max-width:1100px) and (min-width:901px){
  .hero-scene.photo-scene{
    left:46% !important;
  }
  .hero-copy{
    width:61% !important;
  }
}


/* =========================================================
   V39 — HEADER FIXO (seletores reais da V37)
   ÚNICA alteração: fixa logo/menu/WhatsApp e centraliza o menu.
   ========================================================= */
@media (min-width:901px){
  .top{
    position:fixed !important;
    inset:0 0 auto 0 !important;
    z-index:9999 !important;
    width:100% !important;
    height:92px !important;
    padding:0 3.7% !important;
    display:grid !important;
    grid-template-columns:220px 1fr 210px !important;
    align-items:center !important;
    gap:0 !important;
    background:linear-gradient(180deg,rgba(6,11,14,.72) 0%,rgba(6,11,14,.22) 62%,rgba(6,11,14,0) 100%) !important;
    pointer-events:none !important;
  }

  .top .brand,
  .top nav,
  .top .wa{
    pointer-events:auto !important;
  }

  .top .brand{
    position:relative !important;
    left:auto !important;
    top:auto !important;
    justify-self:start !important;
    margin:0 !important;
  }

  /* Centralização absoluta na viewport */
  .top nav{
    position:absolute !important;
    left:50% !important;
    top:20px !important;
    transform:translateX(-50%) !important;
    justify-self:auto !important;
    margin:0 !important;
    padding:0 22px !important;
    height:50px !important;
    display:flex !important;
    align-items:center !important;
    gap:29px !important;
    border:1px solid rgba(255,255,255,.075) !important;
    border-radius:28px !important;
    background:rgba(5,10,13,.28) !important;
    backdrop-filter:blur(9px) !important;
    -webkit-backdrop-filter:blur(9px) !important;
  }

  .top .wa{
    position:relative !important;
    right:auto !important;
    top:auto !important;
    justify-self:end !important;
    margin:0 !important;
  }
}


/* =========================================================
   V40 — AJUSTE EXCLUSIVO DO HEADER
   - Blur mais evidente no menu
   - WhatsApp realmente fixo junto ao logo/menu
   - restante da V39 intacto
   ========================================================= */
@media (min-width:901px){

  .top{
    position:fixed !important;
    top:0 !important;
    left:0 !important;
    right:0 !important;
    z-index:99999 !important;
  }

  /* cápsula do menu com glass/blur */
  .top nav{
    position:fixed !important;
    top:20px !important;
    left:50% !important;
    transform:translateX(-50%) !important;

    background:rgba(7,13,17,.58) !important;
    border:1px solid rgba(255,255,255,.10) !important;
    box-shadow:
      0 10px 30px rgba(0,0,0,.20),
      inset 0 1px 0 rgba(255,255,255,.025) !important;

    backdrop-filter:blur(18px) saturate(120%) !important;
    -webkit-backdrop-filter:blur(18px) saturate(120%) !important;
  }

  /* logo preso à viewport */
  .top .brand{
    position:fixed !important;
    top:10px !important;
    left:clamp(32px,3.7vw,64px) !important;
    z-index:100000 !important;
  }

  /* WhatsApp preso à viewport, independente do grid/header */
  .top .wa{
    position:fixed !important;
    top:14px !important;
    right:clamp(32px,3.2vw,54px) !important;
    left:auto !important;
    transform:none !important;
    z-index:100000 !important;
    margin:0 !important;
  }
}


/* =========================================================
   V41 — HEADER FINAL
   Mantém o visual/blur aprovado da V40.
   WhatsApp passa para dentro da cápsula do menu.
   Logo deixa de ser fixed e acompanha a página normalmente.
   ========================================================= */
@media (min-width:901px){

  /* Header não precisa mais manter logo preso à viewport. */
  .top{
    position:absolute !important;
    top:0 !important;
    left:0 !important;
    right:0 !important;
    z-index:99999 !important;
  }

  /* Logo volta ao fluxo do topo/hero e rola com a página. */
  .top .brand{
    position:absolute !important;
    top:10px !important;
    left:clamp(32px,3.7vw,64px) !important;
    z-index:100000 !important;
    margin:0 !important;
  }

  /* Menu continua fixo, centralizado e com o blur da V40. */
  .top nav{
    position:fixed !important;
    top:20px !important;
    left:50% !important;
    transform:translateX(-50%) !important;
    z-index:100001 !important;
    width:max-content !important;
    max-width:calc(100vw - 40px) !important;
    height:50px !important;
    padding:0 10px 0 22px !important;
    gap:27px !important;

    background:rgba(7,13,17,.58) !important;
    border:1px solid rgba(255,255,255,.10) !important;
    border-radius:28px !important;
    box-shadow:
      0 10px 30px rgba(0,0,0,.20),
      inset 0 1px 0 rgba(255,255,255,.025) !important;
    backdrop-filter:blur(18px) saturate(120%) !important;
    -webkit-backdrop-filter:blur(18px) saturate(120%) !important;
  }

  /* O botão agora é um item da própria cápsula. */
  .top nav .wa{
    position:relative !important;
    inset:auto !important;
    transform:none !important;
    z-index:auto !important;
    margin:0 0 0 2px !important;
    height:36px !important;
    min-height:36px !important;
    padding:0 15px !important;
    display:inline-flex !important;
    align-items:center !important;
    justify-content:center !important;
    white-space:nowrap !important;
    border-radius:19px !important;
  }
}


/* =========================================================
   V43 — HEADER DEFINITIVO
   CTA do WhatsApp é um item real do menu e NÃO usa a classe .wa.
   ========================================================= */
@media (min-width:901px){
  .top .main-menu{
    position:fixed !important;
    top:20px !important;
    left:50% !important;
    right:auto !important;
    transform:translateX(-50%) !important;
    z-index:100001 !important;

    width:auto !important;
    min-width:0 !important;
    max-width:calc(100vw - 40px) !important;
    height:50px !important;
    margin:0 !important;
    padding:6px 7px 6px 22px !important;

    display:flex !important;
    flex:0 0 auto !important;
    align-items:center !important;
    justify-content:center !important;
    gap:26px !important;

    background:rgba(7,13,17,.58) !important;
    border:1px solid rgba(255,255,255,.10) !important;
    border-radius:28px !important;
    box-shadow:0 10px 30px rgba(0,0,0,.20), inset 0 1px 0 rgba(255,255,255,.025) !important;
    backdrop-filter:blur(18px) saturate(120%) !important;
    -webkit-backdrop-filter:blur(18px) saturate(120%) !important;
  }

  .top .main-menu > a{
    flex:0 0 auto !important;
    white-space:nowrap !important;
  }

  .top .main-menu .menu-whatsapp{
    position:static !important;
    inset:auto !important;
    transform:none !important;
    margin:0 !important;
    height:36px !important;
    padding:0 16px !important;

    display:inline-flex !important;
    align-items:center !important;
    justify-content:center !important;

    color:#f2f4f5 !important;
    border:1px solid #dce900 !important;
    border-radius:19px !important;
    background:rgba(8,13,17,.35) !important;
  }

  .top .main-menu .menu-whatsapp::after{
    display:none !important;
    content:none !important;
  }

  /* Segurança: se restar algum .wa diretamente no header, não aparece. */
  .top > .wa{
    display:none !important;
  }
}

/* =========================================================
   V45 — PORTFÓLIO: acabamento visual + navegação futura
   Escopo restrito à seção #projetos.
   ========================================================= */
#projetos.projects{
  position:relative;
  overflow:hidden;
  isolation:isolate;
  background:
    radial-gradient(ellipse at 76% 12%,rgba(255,255,255,.055),transparent 31%),
    radial-gradient(ellipse at 56% 105%,rgba(116,132,143,.10),transparent 42%),
    linear-gradient(105deg,#151b20 0%,#20272c 46%,#11171b 100%) !important;
}
#projetos.projects::before{
  content:"";
  position:absolute;
  inset:0;
  z-index:-1;
  pointer-events:none;
  opacity:.42;
  background-image:
    linear-gradient(rgba(255,255,255,.018) 1px,transparent 1px),
    linear-gradient(90deg,rgba(255,255,255,.014) 1px,transparent 1px);
  background-size:72px 72px;
  -webkit-mask-image:linear-gradient(90deg,transparent 4%,#000 42%,#000 100%);
  mask-image:linear-gradient(90deg,transparent 4%,#000 42%,#000 100%);
}
#projetos.projects::after{
  content:"";
  position:absolute;
  width:420px;
  height:420px;
  right:-150px;
  top:-210px;
  z-index:-1;
  pointer-events:none;
  border:1px solid rgba(255,255,255,.045);
  border-radius:50%;
  box-shadow:0 0 90px rgba(255,255,255,.018);
}
#projetos .side-intro{position:relative;z-index:2;padding-top:4px}
#projetos .side-intro::after{content:"";display:block;width:48px;height:2px;background:#dce900;margin-top:25px;opacity:.8}
#projetos .project-grid{position:relative;z-index:2;overflow:visible}
#projetos .project-grid article{transition:transform .28s ease,border-color .28s ease,box-shadow .28s ease;border:1px solid rgba(255,255,255,.025)}
#projetos .project-grid article:hover{transform:translateY(-5px);border-color:rgba(220,233,0,.16);box-shadow:0 18px 42px rgba(0,0,0,.30)}
#projetos .portfolio-next{
  position:absolute;
  z-index:8;
  right:18px;
  top:50%;
  transform:translateY(-50%);
  width:54px;
  height:54px;
  border-radius:50%;
  border:1px solid rgba(255,255,255,.12);
  background:rgba(7,12,16,.86);
  color:#f3f5f6;
  display:flex;
  align-items:center;
  justify-content:center;
  font-size:30px;
  line-height:1;
  font-weight:300;
  cursor:pointer;
  box-shadow:0 10px 28px rgba(0,0,0,.34);
  backdrop-filter:blur(12px);
  -webkit-backdrop-filter:blur(12px);
  transition:transform .22s ease,border-color .22s ease,background .22s ease,color .22s ease;
}
#projetos .portfolio-next:hover{transform:translateY(-50%) translateX(3px);border-color:#dce900;background:rgba(13,19,22,.96);color:#dce900}
#projetos .portfolio-next:focus-visible{outline:2px solid #dce900;outline-offset:3px}
@media(max-width:900px){
  #projetos.projects::before{background-size:52px 52px}
  #projetos .portfolio-next{right:12px;top:62%;width:46px;height:46px;font-size:25px}
}

/* =========================================================
   V46 — PORTFÓLIO: gradiente orgânico discreto
   Somente #projetos. Mantém layout, cards e navegação da V45.
   ========================================================= */
#projetos.projects{
  background:
    radial-gradient(ellipse 58% 105% at -8% 12%, rgba(115,143,160,.115) 0%, rgba(63,80,91,.045) 34%, transparent 66%),
    radial-gradient(ellipse 48% 82% at 102% 88%, rgba(62,82,94,.075) 0%, transparent 67%),
    radial-gradient(ellipse 52% 58% at 48% 108%, rgba(77,96,108,.055) 0%, transparent 70%),
    linear-gradient(112deg,#171e23 0%,#1c2328 44%,#141a1e 100%) !important;
}
#projetos.projects::before{
  opacity:.22;
  background-image:
    linear-gradient(128deg,transparent 0 19%,rgba(255,255,255,.020) 19.1%,transparent 19.35% 100%),
    linear-gradient(48deg,transparent 0 72%,rgba(255,255,255,.014) 72.1%,transparent 72.35% 100%);
  background-size:100% 100%;
  -webkit-mask-image:linear-gradient(90deg,#000 0%,rgba(0,0,0,.72) 35%,rgba(0,0,0,.22) 72%,transparent 100%);
  mask-image:linear-gradient(90deg,#000 0%,rgba(0,0,0,.72) 35%,rgba(0,0,0,.22) 72%,transparent 100%);
}
#projetos.projects::after{
  width:680px;
  height:680px;
  left:-430px;
  right:auto;
  top:-255px;
  border:1px solid rgba(183,205,218,.045);
  box-shadow:0 0 120px rgba(130,154,168,.018), inset 0 0 90px rgba(255,255,255,.008);
}

/* =========================================================
   V47 — PORTFÓLIO: gradiente visível, porém discreto
   Ajuste restrito à seção #projetos.
   ========================================================= */
#projetos.projects{
  position:relative;
  isolation:isolate;
  overflow:hidden;
  background:linear-gradient(108deg,#1b2227 0%,#20282d 42%,#171e22 72%,#11171b 100%) !important;
}
#projetos.projects::before{
  content:"";
  position:absolute;
  inset:0;
  z-index:0;
  pointer-events:none;
  opacity:1;
  background:
    radial-gradient(ellipse 42% 125% at -4% 16%,rgba(157,181,195,.20) 0%,rgba(99,121,134,.095) 31%,rgba(50,67,77,.025) 56%,transparent 72%),
    radial-gradient(ellipse 35% 95% at 101% 82%,rgba(92,115,128,.10) 0%,rgba(56,74,84,.035) 43%,transparent 70%),
    linear-gradient(124deg,rgba(255,255,255,.035) 0%,transparent 19%,transparent 100%);
  -webkit-mask-image:none;
  mask-image:none;
}
#projetos.projects::after{
  content:"";
  position:absolute;
  z-index:0;
  pointer-events:none;
  width:760px;
  height:760px;
  left:-535px;
  top:-315px;
  border-radius:50%;
  border:1px solid rgba(184,204,216,.07);
  box-shadow:0 0 135px rgba(124,151,166,.045),inset 0 0 110px rgba(255,255,255,.012);
}
#projetos.projects > *{position:relative;z-index:1}

/* V47 — gradiente visível e discreto, apenas no portfólio */
#projetos.projects{position:relative;isolation:isolate;overflow:hidden;background:linear-gradient(108deg,#1b2227 0%,#20282d 42%,#171e22 72%,#11171b 100%) !important}
#projetos.projects::before{content:"";position:absolute;inset:0;z-index:0;pointer-events:none;opacity:1;background:radial-gradient(ellipse 42% 125% at -4% 16%,rgba(157,181,195,.20) 0%,rgba(99,121,134,.095) 31%,rgba(50,67,77,.025) 56%,transparent 72%),radial-gradient(ellipse 35% 95% at 101% 82%,rgba(92,115,128,.10) 0%,rgba(56,74,84,.035) 43%,transparent 70%),linear-gradient(124deg,rgba(255,255,255,.035) 0%,transparent 19%,transparent 100%);-webkit-mask-image:none;mask-image:none}
#projetos.projects::after{content:"";position:absolute;z-index:0;pointer-events:none;width:760px;height:760px;left:-535px;top:-315px;border-radius:50%;border:1px solid rgba(184,204,216,.07);box-shadow:0 0 135px rgba(124,151,166,.045),inset 0 0 110px rgba(255,255,255,.012)}
#projetos.projects > *{position:relative;z-index:1}

/* V48 — corrige somente a posição da seta do portfólio.
   Mantém integralmente o gradiente e o restante da seção V47. */
#projetos.projects > .portfolio-next{
  position:absolute;
  z-index:8;
  left:auto;
  right:18px;
  top:50%;
  transform:translateY(-50%);
  margin:0;
}
#projetos.projects > .portfolio-next:hover{
  transform:translateY(-50%) translateX(3px);
}
@media(max-width:900px){
  #projetos.projects > .portfolio-next{
    left:auto;
    right:12px;
    top:62%;
  }
}

/* =========================================================
   V49 — SISTEMAS SOB MEDIDA fiel ao mockup
   Escopo intencionalmente restrito a .systems
   ========================================================= */
.systems{
  position:relative;
  isolation:isolate;
  min-height:500px;
  padding:46px 4.1%;
  display:grid;
  grid-template-columns:27% 49% 24%;
  gap:0;
  align-items:center;
  overflow:hidden;
  background:
    radial-gradient(ellipse 44% 95% at 53% 48%,rgba(58,72,82,.32) 0%,rgba(25,35,42,.18) 48%,transparent 74%),
    linear-gradient(90deg,#080d11 0%,#0c1318 28%,#151d23 51%,#0b1116 76%,#070b0e 100%);
}
.systems::before{
  content:"";position:absolute;z-index:-1;inset:0;
  background:linear-gradient(105deg,transparent 22%,rgba(255,255,255,.018) 42%,transparent 62%);
  pointer-events:none;
}
.systems>div:first-child{padding:0 38px 0 0;align-self:center}
.systems>div:first-child .eyebrow{display:block;margin-bottom:16px;letter-spacing:3.4px;color:#aeb5ba}
.systems h2{font-size:45px;line-height:1.06;margin:0 0 24px;letter-spacing:-1.3px}
.systems>div:first-child p{max-width:330px;font-size:16px;line-height:1.52;margin:0 0 27px;color:#b7bdc2}
.systems>div:first-child .outline{padding:15px 25px;border-color:#747c82;border-radius:5px;font-size:16px;transition:.25s ease}
.systems>div:first-child .outline:hover{border-color:#dce900;background:rgba(220,233,0,.045);transform:translateY(-2px)}

.systems .real-system-showcase{position:relative;min-height:410px;height:410px;display:flex;align-items:center;justify-content:center;padding:0 15px 0 0}
.systems .desktop-frame{
  position:relative;width:94%;max-width:650px;padding:10px 10px 27px;
  border:1px solid rgba(255,255,255,.16);border-radius:13px;
  background:linear-gradient(145deg,#353b40,#11161a 70%);
  box-shadow:0 34px 65px rgba(0,0,0,.58),0 0 55px rgba(95,118,132,.09);
  transform:none;
}
.systems .desktop-frame::after{
  content:"";position:absolute;left:10%;right:10%;bottom:-17px;height:18px;
  background:linear-gradient(180deg,#42484d,#171b1e);clip-path:polygon(8% 0,92% 0,100% 100%,0 100%);
  filter:drop-shadow(0 9px 8px rgba(0,0,0,.55));
}
.systems .desktop-frame img{width:100%;display:block;border-radius:4px;box-shadow:inset 0 0 0 1px rgba(255,255,255,.08)}
.systems .mobile-frame{
  position:absolute;z-index:3;right:2%;bottom:8%;width:139px;padding:7px;
  background:#090c0f;border:1px solid rgba(255,255,255,.15);border-radius:23px;
  box-shadow:0 24px 40px rgba(0,0,0,.68);transform:none;
}
.systems .mobile-frame img{width:100%;display:block;border-radius:16px}

.systems .features{list-style:none;margin:0;padding:0 0 0 24px;display:flex;flex-direction:column;gap:8px}
.systems .features li{display:flex;align-items:center;gap:15px;padding:0;color:#c4c9cd;font-size:16px;line-height:1.25;white-space:nowrap}
.systems .feature-icon{width:40px;height:40px;flex:0 0 40px;border-radius:50%;display:grid;place-items:center;background:linear-gradient(145deg,#3b4349,#242b30);border:1px solid rgba(255,255,255,.10);box-shadow:0 6px 13px rgba(0,0,0,.26);color:#d4d8db;font-size:18px;font-weight:400}
.systems .features li:last-child .feature-icon{font-size:25px;font-weight:200}

@media(max-width:1100px) and (min-width:901px){
 .systems{grid-template-columns:28% 46% 26%;padding-left:3%;padding-right:3%}
 .systems h2{font-size:39px}.systems>div:first-child p{font-size:15px}
 .systems .features{padding-left:12px}.systems .features li{font-size:14px;gap:10px}
 .systems .feature-icon{width:35px;height:35px;flex-basis:35px}
 .systems .mobile-frame{width:118px}
}
@media(max-width:900px){
 .systems{min-height:auto;padding:55px 6%;grid-template-columns:1fr;gap:30px;background:radial-gradient(circle at 50% 48%,#17232b,#071015 68%,#06090b)}
 .systems>div:first-child{padding:0}.systems h2{font-size:39px}.systems>div:first-child p{max-width:520px}
 .systems .real-system-showcase{height:auto;min-height:360px;padding:0}.systems .desktop-frame{width:94%}.systems .mobile-frame{width:105px;right:0;bottom:4%}
 .systems .features{padding:0;display:grid;grid-template-columns:1fr 1fr;gap:13px}.systems .features li{white-space:normal;font-size:14px}
}

/* V50 — refinamento visual exclusivo da seção Serviços */
.services{
  position:relative;
  overflow:hidden;
  isolation:isolate;
  background:
    radial-gradient(circle at 13% 18%,rgba(255,255,255,.72) 0,rgba(255,255,255,.18) 24%,transparent 48%),
    radial-gradient(circle at 88% 88%,rgba(128,138,145,.22) 0,transparent 38%),
    linear-gradient(112deg,#eef0f1 0%,#dfe2e4 52%,#cfd3d6 100%);
}
.services::before{
  content:"";
  position:absolute;
  width:520px;height:520px;
  left:-250px;bottom:-335px;
  border:1px solid rgba(45,53,58,.10);
  border-radius:50%;
  box-shadow:0 0 0 74px rgba(45,53,58,.025),0 0 0 150px rgba(45,53,58,.018);
  z-index:-1;
}
.services::after{
  content:"";
  position:absolute;
  width:420px;height:220px;
  right:-110px;top:-105px;
  background:linear-gradient(135deg,transparent 45%,rgba(38,46,52,.055) 45.5%,rgba(38,46,52,.055) 46%,transparent 46.5%),linear-gradient(155deg,transparent 59%,rgba(255,255,255,.24) 59.5%,rgba(255,255,255,.24) 60%,transparent 60.5%);
  transform:rotate(-8deg);
  z-index:-1;
}
.services .service-head,.services .service-grid{position:relative;z-index:1}
.services .service-head h2{color:#111519;letter-spacing:-1px}
.services .service-head p{color:#596168}
.services .eyebrow{color:#8e979e}
.services .light-btn{background:rgba(255,255,255,.18);border-color:#717980;transition:transform .22s ease,background .22s ease,box-shadow .22s ease}
.services .light-btn:hover{transform:translateY(-2px);background:rgba(255,255,255,.52);box-shadow:0 10px 28px rgba(24,31,36,.10)}
.services .service-grid article{
  overflow:hidden;
  background:linear-gradient(145deg,rgba(255,255,255,.58),rgba(255,255,255,.24));
  border:1px solid rgba(255,255,255,.56);
  box-shadow:0 12px 30px rgba(37,45,50,.055),inset 0 1px 0 rgba(255,255,255,.65);
  backdrop-filter:blur(4px);
}
.services .service-grid article::before{
  content:"";position:absolute;width:150px;height:150px;right:-92px;bottom:-105px;border:1px solid rgba(42,49,54,.08);border-radius:50%;transition:.35s ease
}
.services .service-grid article::after{
  content:"";position:absolute;left:0;bottom:0;width:0;height:2px;background:#cbd600;transition:width .3s ease
}
.services .service-grid article:hover{transform:translateY(-6px);background:linear-gradient(145deg,rgba(255,255,255,.76),rgba(255,255,255,.34));box-shadow:0 18px 40px rgba(37,45,50,.11)}
.services .service-grid article:hover::before{transform:scale(1.15)}
.services .service-grid article:hover::after{width:42%}
.services .svc-icon{background:linear-gradient(145deg,#414a50,#2d3439);box-shadow:0 8px 18px rgba(18,23,27,.18);transition:transform .25s ease,box-shadow .25s ease}
.services article:hover .svc-icon{transform:translateY(-2px) rotate(-3deg);box-shadow:0 12px 22px rgba(18,23,27,.23)}
.services .arrow{transition:transform .25s ease}
.services article:hover .arrow{transform:translate(3px,-3px)}
@media(max-width:900px){.services::before{width:360px;height:360px;left:-230px;bottom:-210px}.services::after{opacity:.55}}

/* V51 — Processo + depoimentos: composição inspirada no mockup aprovado */
.process{
  position:relative;overflow:hidden;isolation:isolate;
  padding:48px 4%;
  background:
    radial-gradient(circle at 10% 45%,rgba(47,75,91,.20),transparent 34%),
    radial-gradient(circle at 84% 5%,rgba(40,67,82,.13),transparent 30%),
    linear-gradient(105deg,#0b1217 0%,#101a21 45%,#091016 100%);
}
.process::before{
  content:"";position:absolute;z-index:-1;width:620px;height:620px;left:-330px;top:-410px;
  border:1px solid rgba(142,164,177,.09);border-radius:50%;
  box-shadow:0 0 0 78px rgba(142,164,177,.018),0 0 0 156px rgba(142,164,177,.012);
}
.process::after{
  content:"";position:absolute;z-index:-1;width:480px;height:480px;right:-350px;top:-210px;
  border:1px solid rgba(142,164,177,.08);border-radius:50%;
  box-shadow:0 0 0 64px rgba(142,164,177,.014);
}
.process-intro{position:relative;z-index:1;padding-right:34px}
.process-intro h2{font-size:40px;line-height:1.08;letter-spacing:-1px}
.steps{position:relative;z-index:1}
.steps article{transition:transform .25s ease,background .25s ease;border-color .25s ease}
.steps article:hover{transform:translateY(-4px);background:linear-gradient(180deg,rgba(255,255,255,.025),transparent);border-left-color:rgba(220,233,0,.38)}
.step-icon{
  width:44px;height:44px;border-radius:50%;display:grid;place-items:center;margin-bottom:10px;
  border:1px solid rgba(207,218,225,.20);background:linear-gradient(145deg,rgba(62,78,88,.58),rgba(18,28,34,.48));
  box-shadow:inset 0 1px rgba(255,255,255,.08),0 8px 22px rgba(0,0,0,.18);
  font-size:23px!important;
}
.steps b{color:#eef2f4}.steps h3{font-size:17px}.step-arrow{transition:transform .25s ease,color .25s ease}
.steps article:hover .step-arrow{transform:translateX(5px);color:#e5f000}

.testimonials{
  position:relative;overflow:hidden;isolation:isolate;min-height:340px;
  grid-template-columns:22% 27% 51%;
  background:
    radial-gradient(ellipse at 53% 45%,rgba(52,73,86,.25),transparent 46%),
    linear-gradient(100deg,#111a20 0%,#263039 48%,#121a20 100%);
}
.testimonials::before{
  content:"";position:absolute;z-index:-1;width:740px;height:360px;left:26%;bottom:-260px;
  border:1px solid rgba(143,166,179,.085);border-radius:50%;
  box-shadow:0 0 0 70px rgba(143,166,179,.012);
}
.testimonials::after{
  content:"←   →";position:absolute;right:4.2%;top:18px;color:#929da4;font-size:24px;letter-spacing:13px;opacity:.78;
}
.architectural{position:relative;min-height:340px;overflow:hidden;background:#070b0e}
.architectural::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,transparent 68%,rgba(17,26,32,.9) 100%);pointer-events:none}
.architectural img{width:100%;height:100%;display:block;object-fit:cover;object-position:center;filter:saturate(.72) contrast(1.06) brightness(.82);transform:scale(1.015)}
.test-intro{padding:64px 30px 45px 40px;align-self:center}
.test-intro h2{font-size:39px;line-height:1.1;letter-spacing:-1px;margin:15px 0 18px}
.quotes{position:relative;z-index:1;align-items:center;padding:52px 4% 34px 0;gap:18px}
.quotes article{
  position:relative;min-height:210px;padding:26px 25px 22px;
  background:linear-gradient(145deg,rgba(57,70,79,.74),rgba(37,47,54,.72));
  border:1px solid rgba(194,208,216,.10);border-radius:10px;
  box-shadow:0 18px 38px rgba(0,0,0,.16),inset 0 1px rgba(255,255,255,.025);
  backdrop-filter:blur(5px);-webkit-backdrop-filter:blur(5px);
  transition:transform .25s ease,border-color .25s ease,box-shadow .25s ease;
}
.quotes article:hover{transform:translateY(-5px);border-color:rgba(220,233,0,.22);box-shadow:0 24px 44px rgba(0,0,0,.24)}
.quotes article p{font-size:14px;line-height:1.62;color:#c2c9ce;min-height:105px;margin:0}
.quotes .stars{font-size:17px;margin:15px 0 0;color:#e5f000;text-shadow:0 0 14px rgba(229,240,0,.10)}

@media(max-width:900px){
 .process{padding:48px 6%}.process-intro{padding-right:0}.process-intro h2{font-size:36px}
 .testimonials{grid-template-columns:1fr}.architectural{height:250px;min-height:250px}.architectural::after{background:linear-gradient(180deg,transparent 60%,#1c252c 100%)}
 .test-intro{padding:38px 6% 18px}.quotes{padding:20px 6% 42px;gap:14px}.testimonials::after{display:none}
}

/* =========================================================
   V52 — CTA + FOOTER fiel ao mockup aprovado
   Escopo restrito ao último trecho do site.
   ========================================================= */
.cta{
  min-height:300px;
  padding:38px 4% 30px;
  position:relative;
  overflow:hidden;
  isolation:isolate;
  display:grid;
  grid-template-columns:29% 34% 37%;
  align-items:center;
  background:
    radial-gradient(ellipse 35% 95% at 78% 45%,rgba(79,91,101,.24),transparent 72%),
    linear-gradient(90deg,#05090c 0%,#080d11 46%,#121a20 77%,#222c34 100%);
}
.cta::before{
  content:"";position:absolute;z-index:-1;inset:0;
  background:linear-gradient(112deg,transparent 48%,rgba(255,255,255,.035) 48.2%,rgba(255,255,255,.008) 65%,transparent 65.2%);
  pointer-events:none;
}
.cta-copy{position:relative;z-index:4;align-self:center;max-width:410px}
.cta-copy .eyebrow{display:block;margin-bottom:13px;color:#dce900;letter-spacing:2.6px}
.cta h2{font-size:34px;line-height:1.08;letter-spacing:-1px;margin:0 0 18px;font-weight:500}
.cta-copy p{font-size:14px;line-height:1.55;max-width:390px;margin:0;color:#b8bec3}
.cta>.actions{
  position:relative;z-index:5;margin:0;display:flex;gap:14px;align-items:center;justify-content:center;
  transform:translateY(8px);
}
.cta>.actions a{height:48px;display:inline-flex;align-items:center;justify-content:center;white-space:nowrap;padding:0 22px}
.cta>.actions .primary{min-width:188px;box-shadow:0 0 0 1px rgba(229,240,0,.14),0 8px 25px rgba(0,0,0,.16)}
.cta>.actions .secondary{min-width:180px;border-color:#697179;background:rgba(11,16,20,.24)}
.cta-device{
  position:absolute;z-index:2;right:9.5%;bottom:-102px;width:420px;height:285px;
  transform:rotate(5deg) skew(-9deg);
  filter:drop-shadow(0 26px 30px rgba(0,0,0,.48));
}
.cta-device .lid{
  width:100%;height:100%;display:grid;place-items:center;
  background:linear-gradient(145deg,#7b8288 0%,#4c5359 44%,#20262a 100%);
  border:1px solid rgba(201,208,213,.36);border-radius:11px;
  box-shadow:inset 0 1px rgba(255,255,255,.15);
}
.cta-device img{width:165px;height:105px;object-fit:contain;transform:skew(9deg) rotate(-5deg);filter:brightness(.48)!important;opacity:.92}
.vertical{position:absolute;z-index:5;right:3.8%;top:73px;font-size:14px;line-height:1.75;letter-spacing:2.6px;color:#aeb4b9}
.vertical i{width:42px;margin-top:15px;background:#dce900}

footer{
  min-height:165px;padding:26px 4% 20px;
  display:grid;grid-template-columns:190px 1fr 2fr 130px;grid-template-rows:auto auto;
  column-gap:28px;row-gap:20px;align-items:center;
  border-top:1px solid #273038;background:linear-gradient(90deg,#0b1115,#0d1419 54%,#0a1014);color:#aeb4b9;
}
footer .footer-brand{display:flex;align-items:center}
footer .footer-brand img{width:165px;height:66px;object-fit:contain;object-position:left center;filter:none!important}
footer .footer-tagline{font-size:13px;line-height:1.45;margin:0;color:#aeb4b9}
footer nav{display:flex;justify-content:center;gap:25px;font-size:12px}
footer nav a{transition:color .2s ease}
footer nav a:hover{color:#e5f000}
.footer-social{display:flex;justify-content:flex-end;align-items:center;gap:20px;color:#eef1f2;font-size:25px}
.footer-social span:last-child{font-size:21px;font-weight:700;font-family:Arial,sans-serif}
.footer-social a{font-size:22px}
footer small{grid-column:1/4;border-top:1px solid #242c32;padding-top:17px;font-size:11px;color:#8f989f}
.footer-location{grid-column:4;border-top:1px solid #242c32;padding-top:17px;text-align:right;font-size:11px;color:#8f989f;white-space:nowrap}

@media(max-width:1100px) and (min-width:901px){
 .cta{grid-template-columns:34% 34% 32%}.cta h2{font-size:31px}.cta-device{right:5%;width:360px}.vertical{right:2%}
 .cta>.actions{gap:9px}.cta>.actions a{padding:0 14px;font-size:13px}.cta>.actions .primary,.cta>.actions .secondary{min-width:0}
 footer{grid-template-columns:155px 1fr 1.7fr 100px}footer nav{gap:14px}.footer-social{gap:12px}
}
@media(max-width:900px){
 .cta{min-height:510px;padding:55px 6% 35px;display:block}.cta-copy{max-width:520px}.cta h2{font-size:36px}.cta>.actions{justify-content:flex-start;transform:none;margin-top:25px;flex-wrap:wrap}
 .cta-device{right:-100px;bottom:-85px;width:390px;height:250px;opacity:.42}.vertical{display:none}
 footer{grid-template-columns:1fr;grid-template-rows:auto;padding:30px 6%;gap:18px}
 footer .footer-brand,footer .footer-tagline,footer nav,.footer-social,footer small,.footer-location{grid-column:1}
 footer nav{justify-content:flex-start;flex-wrap:wrap}.footer-social{justify-content:flex-start}
 footer small{order:5}.footer-location{order:6;text-align:left;border-top:0;padding-top:0}
}

/* =========================================================
   V53 — MOBILE REFINADO + REDES SOCIAIS
   Desktop preservado. Ajustes entram apenas até 900px.
   ========================================================= */
.menu-toggle{display:none}
.footer-social a{width:34px;height:34px;display:grid;place-items:center;color:#eef1f2;transition:color .2s ease,transform .2s ease}
.footer-social a:hover{color:#e5f000;transform:translateY(-2px)}
.footer-social svg{width:23px;height:23px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}

@media(max-width:900px){
  html,body{max-width:100%;overflow-x:hidden}

  /* header compacto: logo + botão, sem menu vazando para fora da tela */
  .top{
    position:absolute!important;top:0;left:0;right:0;z-index:50!important;
    width:100%!important;height:88px!important;padding:14px 22px!important;
    display:flex!important;align-items:center!important;justify-content:space-between!important;
    background:linear-gradient(180deg,rgba(7,13,17,.96),rgba(7,13,17,.72),transparent)!important;
  }
  .top .brand{width:112px!important;height:60px!important;position:relative!important;left:auto!important;top:auto!important}
  .top .brand img{width:108px!important;height:58px!important;object-fit:contain!important;object-position:left center!important}
  .menu-toggle{
    display:flex;width:48px;height:44px;padding:0;border:1px solid rgba(255,255,255,.15);border-radius:14px;
    background:rgba(12,19,24,.74);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);
    flex-direction:column;align-items:center;justify-content:center;gap:5px;color:#fff
  }
  .menu-toggle span{display:block;width:20px;height:2px;border-radius:2px;background:#eef1f2;transition:.25s ease}
  .menu-toggle.active span:nth-child(1){transform:translateY(7px) rotate(45deg)}
  .menu-toggle.active span:nth-child(2){opacity:0}
  .menu-toggle.active span:nth-child(3){transform:translateY(-7px) rotate(-45deg)}
  .top .main-menu{
    display:none!important;position:absolute!important;top:76px!important;left:20px!important;right:20px!important;width:auto!important;
    margin:0!important;padding:12px!important;gap:4px!important;border-radius:18px!important;
    background:rgba(8,14,18,.94)!important;border:1px solid rgba(255,255,255,.12)!important;
    box-shadow:0 18px 45px rgba(0,0,0,.35)!important;backdrop-filter:blur(18px)!important;-webkit-backdrop-filter:blur(18px)!important;
    flex-direction:column!important;align-items:stretch!important
  }
  .top .main-menu.open{display:flex!important}
  .top .main-menu a{width:100%!important;padding:12px 14px!important;text-align:left!important;border-radius:10px!important}
  .top .main-menu .menu-whatsapp{margin:4px 0 0!important;justify-content:center!important;text-align:center!important;border:1px solid #dce900!important;color:#fff!important}

  /* Hero: proporções menores e mais naturais em celular */
  .hero-copy{min-height:0!important;padding:126px 24px 48px!important}
  .hero-copy .eyebrow{font-size:10px!important;letter-spacing:2.35px!important;line-height:1.45!important}
  .hero h1{margin:22px 0 24px!important;font-size:clamp(42px,11.7vw,54px)!important;line-height:1.04!important;letter-spacing:-1.8px!important}
  .hero-copy>p{font-size:15px!important;line-height:1.65!important;max-width:100%!important}
  .hero-copy .actions{margin-top:28px!important;gap:12px!important}
  .hero-copy .actions a{height:56px!important;font-size:14px!important}
  .hero-copy .stats{margin-top:38px!important;gap:0!important;display:grid!important;grid-template-columns:repeat(3,1fr)!important}
  .hero-copy .stats div{min-width:0!important;padding:0 10px!important;text-align:left!important;border-right:1px solid #394147!important}
  .hero-copy .stats div:first-child{padding-left:0!important}
  .hero-copy .stats b{font-size:25px!important}.hero-copy .stats small{font-size:9px!important;line-height:1.35!important}

  /* Foto vira um bloco próprio, sem sobreposição/corte lateral */
  .hero-scene.photo-scene{position:relative!important;inset:auto!important;width:100%!important;height:112vw!important;max-height:600px!important;min-height:390px!important;margin:0!important;overflow:hidden!important}
  .hero-scene .hero-photo{position:absolute!important;inset:0!important;width:100%!important;height:100%!important;object-fit:cover!important;object-position:58% center!important}
  .hero-scene::before,.hero-scene::after{content:none!important;display:none!important}
  .hero-photo-shade{display:block!important;background:linear-gradient(180deg,rgba(7,13,17,.2) 0%,transparent 14%,transparent 88%,rgba(18,27,33,.25) 100%)!important}

  /* Projetos: evita título e texto cortados e dá respiro após a foto */
  #projetos.projects{padding:54px 24px 64px!important;display:block!important;overflow:hidden!important}
  #projetos .side-intro{width:100%!important;max-width:none!important;padding:0 0 28px!important}
  #projetos .side-intro h2{font-size:40px!important;line-height:1.08!important;letter-spacing:-1.2px!important;margin:14px 0 18px!important}
  #projetos .side-intro p{font-size:15px!important;line-height:1.6!important;margin-bottom:22px!important}
  #projetos .project-grid{display:grid!important;grid-template-columns:1fr!important;gap:18px!important;width:100%!important}
  #projetos .project-grid article{width:100%!important;min-width:0!important}
  #projetos .portfolio-next{display:none!important}

  /* CTA e rodapé sem elementos saindo da viewport */
  .cta{min-height:auto!important;padding:52px 24px 230px!important}
  .cta h2{font-size:34px!important}.cta>.actions{display:grid!important;grid-template-columns:1fr!important;width:100%!important}
  .cta>.actions a{width:100%!important}.cta-device{right:-105px!important;bottom:-58px!important;width:330px!important;height:215px!important;opacity:.32!important}
  footer{padding:34px 24px 28px!important}
  footer .footer-brand img{width:145px!important}
  footer nav{gap:10px 18px!important}
  .footer-social{gap:12px!important}.footer-social a{width:40px;height:40px;border:1px solid rgba(255,255,255,.12);border-radius:50%}
}


/* =========================================================
   V54 — ajustes mobile solicitados
   ========================================================= */
@media(max-width:900px){
  /* menu centralizado no mobile */
  .top .main-menu{
    left:50%!important;
    right:auto!important;
    width:min(354px,calc(100vw - 40px))!important;
    transform:translateX(-50%)!important;
    align-items:center!important;
    padding:14px!important;
  }
  .top .main-menu a{
    width:100%!important;
    text-align:center!important;
    display:flex!important;
    justify-content:center!important;
    align-items:center!important;
  }
  .top .main-menu .menu-whatsapp{margin-top:6px!important}

  /* botão do SOSPC Gestão centralizado */
  .systems>div:first-child .sospc-gestao-link{
    display:flex!important;
    width:max-content!important;
    max-width:100%!important;
    min-height:52px!important;
    margin:24px auto 0!important;
    align-items:center!important;
    justify-content:center!important;
    text-align:center!important;
  }
}