/* ============================================================
   Sérggio Designer — Caruaru/PE
   Paleta: verde-esmeralda + lima sobre verde-quase-preto
   ============================================================ */

:root{
  --tinta:#0A1310;
  --tinta-2:#0F1D17;
  --tinta-3:#16291F;
  --borda-esc:#20402F;
  --branco:#FFFFFF;
  --creme:#F4FBF6;
  --creme-2:#E7F3EB;
  --cinza:#5B6B62;
  --cinza-c:#A9BFB3;

  --verde:#1FCE7C;
  --verde-esc:#12A461;
  --verde-fundo:#0D2B1D;
  --lima:#B6F36B;

  --zap:#25D366;
  --zap-esc:#1DA851;

  --r-g:26px;
  --r-m:18px;
  --r-p:12px;
  --sombra:0 18px 44px rgba(10,19,16,.14);
  --sombra-v:0 12px 28px rgba(31,206,124,.30);
  --max:1180px;
  --fonte:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;
}

*,*::before,*::after{box-sizing:border-box;}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth;}
body{
  margin:0;
  font-family:var(--fonte);
  font-size:17px;
  line-height:1.62;
  color:var(--tinta);
  background:var(--branco);
  -webkit-font-smoothing:antialiased;
  overflow-x:hidden;
}
img,svg{max-width:100%;}
a{color:inherit;text-decoration:none;}
h1,h2,h3,p,ul,ol,figure{margin:0;}
ul,ol{padding:0;list-style:none;}
button,input,select,textarea{font:inherit;color:inherit;}

.wrap{width:100%;max-width:var(--max);margin:0 auto;padding:0 20px;}
.wrap--fino{max-width:820px;}

.pular{position:absolute;left:-9999px;top:0;z-index:200;background:var(--verde);color:#06170F;padding:12px 18px;border-radius:0 0 10px 0;font-weight:700;}
.pular:focus{left:0;}
:focus-visible{outline:3px solid var(--verde);outline-offset:3px;border-radius:6px;}

/* ---------- botões ---------- */
.btn{
  display:inline-flex;align-items:center;justify-content:center;gap:10px;
  padding:15px 24px;border-radius:999px;border:0;cursor:pointer;
  font-weight:800;font-size:16px;line-height:1.15;letter-spacing:.2px;text-align:center;
  transition:transform .16s ease,box-shadow .16s ease,background .16s ease,color .16s ease;
}
.btn:hover{transform:translateY(-2px);}
.btn--verde{background:var(--verde);color:#06170F;box-shadow:var(--sombra-v);}
.btn--verde:hover{background:var(--lima);}
.btn--zap{background:var(--zap);color:#fff;box-shadow:0 10px 24px rgba(37,211,102,.3);}
.btn--zap:hover{background:var(--zap-esc);}
.btn--ghost{background:transparent;color:var(--branco);border:2px solid rgba(255,255,255,.38);}
.btn--ghost:hover{border-color:var(--verde);color:var(--verde);}
.btn--g{padding:18px 30px;font-size:17.5px;}
.btn--full{width:100%;}
.ic-zap{width:20px;height:20px;fill:currentColor;flex:none;}
.ic-ig{width:20px;height:20px;flex:none;}

/* ---------- olho / eyebrow ---------- */
.olho{
  display:inline-flex;align-items:center;gap:9px;
  font-size:13px;font-weight:800;letter-spacing:1.4px;text-transform:uppercase;
  color:var(--lima);margin-bottom:16px;
}
.olho .pt{width:8px;height:8px;border-radius:50%;background:var(--verde);flex:none;}
.olho--esc{color:var(--verde-esc);}

/* ---------- topo ---------- */
.topo{
  position:sticky;top:0;z-index:90;
  background:rgba(10,19,16,.92);
  backdrop-filter:saturate(160%) blur(10px);
  -webkit-backdrop-filter:saturate(160%) blur(10px);
  border-bottom:1px solid rgba(31,206,124,.20);
}
.topo__in{display:flex;align-items:center;gap:16px;min-height:70px;}
.marca{display:flex;align-items:center;gap:11px;color:var(--branco);flex:none;}
.marca__ic{display:block;width:40px;height:40px;flex:none;}
.marca__ic svg{width:40px;height:40px;display:block;}
.marca__txt{display:flex;flex-direction:column;line-height:1.05;}
.marca__txt b{font-size:19px;font-weight:800;letter-spacing:.2px;}
.marca__txt i{font-style:normal;font-size:11px;letter-spacing:1.5px;text-transform:uppercase;color:var(--verde);font-weight:700;margin-top:3px;}

.nav{display:none;margin-left:auto;gap:24px;}
.nav a{color:var(--cinza-c);font-size:15px;font-weight:600;transition:color .15s ease;}
.nav a:hover{color:var(--verde);}
.topo__zap{display:none;padding:11px 18px;font-size:14.5px;}

.hamb{
  margin-left:auto;width:44px;height:44px;border:0;border-radius:12px;
  background:rgba(31,206,124,.14);display:flex;flex-direction:column;
  align-items:center;justify-content:center;gap:5px;cursor:pointer;flex:none;
}
.hamb span{display:block;width:20px;height:2px;background:var(--verde);border-radius:2px;transition:transform .2s ease,opacity .2s ease;}
.hamb.is-on span:nth-child(1){transform:translateY(7px) rotate(45deg);}
.hamb.is-on span:nth-child(2){opacity:0;}
.hamb.is-on span:nth-child(3){transform:translateY(-7px) rotate(-45deg);}

.menumob{border-top:1px solid rgba(31,206,124,.18);padding:10px 20px 18px;background:var(--tinta);}
.menumob a{display:block;padding:13px 4px;color:var(--creme);font-weight:600;border-bottom:1px solid rgba(255,255,255,.07);}
.menumob a:last-child{border-bottom:0;}

@media (min-width:960px){
  .nav{display:flex;}
  .topo__zap{display:inline-flex;}
  .hamb{display:none;}
  .menumob{display:none !important;}
}

/* ---------- hero ---------- */
.hero{position:relative;background:var(--tinta);color:var(--branco);overflow:hidden;}
.hero__deco{position:absolute;inset:0;opacity:.9;pointer-events:none;}
.hero__deco svg{width:100%;height:100%;}
.hero__in{position:relative;padding:62px 20px 44px;max-width:var(--max);}
.hero h1{
  font-size:clamp(31px,7.4vw,58px);line-height:1.1;font-weight:800;letter-spacing:-.6px;
  max-width:16ch;
}
.hero h1 em{font-style:normal;color:var(--verde);}
.hero__sub{margin-top:20px;font-size:clamp(16.5px,4vw,19.5px);color:var(--cinza-c);max-width:56ch;}
.hero__sub b{color:var(--branco);}
.hero__acoes{display:flex;flex-wrap:wrap;gap:12px;margin-top:30px;}
.hero__acoes .btn{flex:1 1 220px;}

.hero__selos{display:grid;gap:14px;margin-top:40px;}
.hero__selos li{
  background:rgba(255,255,255,.045);border:1px solid rgba(31,206,124,.22);
  border-radius:var(--r-m);padding:16px 18px;
}
.hero__selos b{display:block;font-size:16px;color:var(--verde);margin-bottom:2px;}
.hero__selos span{font-size:14.5px;color:var(--cinza-c);line-height:1.5;}

@media (min-width:760px){
  .hero__in{padding:96px 20px 66px;}
  .hero__selos{grid-template-columns:repeat(3,1fr);gap:16px;}
  .hero__acoes .btn{flex:0 0 auto;}
}

/* ---------- faixa rolante ---------- */
.faixa{
  position:relative;background:var(--verde);color:#06170F;overflow:hidden;
  border-top:1px solid rgba(0,0,0,.08);
}
.faixa__rolo{
  display:flex;align-items:center;gap:16px;white-space:nowrap;
  padding:13px 0;font-weight:800;font-size:14px;letter-spacing:1.6px;text-transform:uppercase;
  animation:rola 30s linear infinite;
}
@keyframes rola{from{transform:translateX(0);}to{transform:translateX(-50%);}}
@media (prefers-reduced-motion:reduce){
  .faixa__rolo{animation:none;flex-wrap:wrap;white-space:normal;justify-content:center;padding:12px 20px;}
}

/* ---------- seções ---------- */
.sec{padding:60px 0;}
@media (min-width:760px){.sec{padding:88px 0;}}
.sec--esc{background:var(--tinta);color:var(--branco);}
.sec__cab{max-width:720px;margin-bottom:34px;}
.sec__cab h2{font-size:clamp(25px,5.6vw,40px);line-height:1.16;font-weight:800;letter-spacing:-.4px;}
.sec__sub{margin-top:14px;font-size:17px;color:var(--cinza);}
.sec__cab--claro .sec__sub{color:var(--cinza-c);}

/* ---------- cards de serviço ---------- */
.cards{display:grid;gap:14px;}
@media (min-width:620px){.cards{grid-template-columns:repeat(2,1fr);gap:16px;}}
@media (min-width:1000px){.cards{grid-template-columns:repeat(4,1fr);}}
.card{
  background:var(--creme);border:1px solid var(--creme-2);border-radius:var(--r-m);
  padding:22px 20px;transition:transform .18s ease,box-shadow .18s ease,border-color .18s ease;
}
.card:hover{transform:translateY(-3px);box-shadow:var(--sombra);border-color:var(--verde);}
.card__ic{
  display:flex;align-items:center;justify-content:center;width:52px;height:52px;
  border-radius:15px;background:#fff;border:1px solid var(--creme-2);color:var(--verde-esc);margin-bottom:15px;
}
.card__ic svg{width:28px;height:28px;}
.card h3{font-size:18px;font-weight:800;line-height:1.28;margin-bottom:7px;}
.card p{font-size:15.4px;color:var(--cinza);line-height:1.56;}
.card p a{color:var(--verde-esc);font-weight:700;text-decoration:underline;text-underline-offset:3px;}
.nota-serv{margin-top:24px;font-size:16px;color:var(--cinza);}
.nota-serv a{color:var(--verde-esc);font-weight:700;text-decoration:underline;text-underline-offset:3px;}

/* ---------- IA ---------- */
.sec--ia{background:var(--tinta-2);color:var(--branco);}
.ia__in{display:grid;gap:34px;align-items:center;}
.ia__txt h2{font-size:clamp(25px,5.6vw,38px);line-height:1.16;font-weight:800;letter-spacing:-.4px;margin-bottom:16px;}
.ia__txt > p{color:var(--cinza-c);font-size:17px;}
.lista{margin:22px 0 26px;display:grid;gap:11px;}
.lista li{position:relative;padding-left:30px;color:var(--creme);font-size:16px;line-height:1.55;}
.lista li::before{
  content:"";position:absolute;left:0;top:8px;width:16px;height:16px;border-radius:50%;
  background:var(--verde);
}
.lista li::after{
  content:"";position:absolute;left:5px;top:12.5px;width:6px;height:3.4px;
  border-left:2px solid #06170F;border-bottom:2px solid #06170F;transform:rotate(-45deg);
}
.ia__fig svg{width:100%;height:auto;display:block;}
@media (min-width:900px){
  .ia__in{grid-template-columns:1.05fr .95fr;gap:56px;}
}

/* ---------- passos ---------- */
.passos{display:grid;gap:16px;counter-reset:p;}
@media (min-width:620px){.passos{grid-template-columns:repeat(2,1fr);}}
@media (min-width:1000px){.passos{grid-template-columns:repeat(4,1fr);}}
.passos li{
  position:relative;background:#fff;border:1px solid var(--creme-2);border-radius:var(--r-m);
  padding:24px 20px 22px;
}
.passos__n{
  display:flex;align-items:center;justify-content:center;width:42px;height:42px;border-radius:13px;
  background:var(--verde);color:#06170F;font-weight:800;font-size:19px;margin-bottom:14px;
}
.passos h3{font-size:17.5px;font-weight:800;line-height:1.3;margin-bottom:7px;}
.passos p{font-size:15.4px;color:var(--cinza);line-height:1.56;}

/* ---------- formatos ---------- */
.formatos{display:grid;gap:16px;}
@media (min-width:560px){.formatos{grid-template-columns:repeat(2,1fr);}}
@media (min-width:960px){.formatos{grid-template-columns:repeat(3,1fr);}}
.fmt{
  background:rgba(255,255,255,.045);border:1px solid var(--borda-esc);
  border-radius:var(--r-m);padding:18px;transition:border-color .18s ease,transform .18s ease;
}
.fmt:hover{border-color:var(--verde);transform:translateY(-3px);}
.fmt__art{
  display:flex;align-items:center;justify-content:center;
  background:#0A1310;border-radius:var(--r-p);padding:16px;margin-bottom:15px;height:200px;
}
.fmt__art svg{border-radius:8px;display:block;max-height:168px;}
.fmt__art--quad svg{width:150px;height:150px;}
.fmt__art--vert svg{width:auto;height:168px;}
.fmt__art--card svg{width:190px;height:auto;}
.fmt__art--wide svg{width:100%;height:auto;}
.fmt h3{font-size:17px;font-weight:800;margin-bottom:3px;}
.fmt p{font-size:14.5px;color:var(--cinza-c);}
.nota-fmt{margin-top:22px;font-size:15px;color:var(--cinza-c);}
.nota-fmt b{color:var(--verde);}

/* ---------- motivos ---------- */
.motivos{display:grid;gap:14px;}
@media (min-width:620px){.motivos{grid-template-columns:repeat(2,1fr);gap:18px;}}
.motivos li{
  border-left:4px solid var(--verde);background:var(--creme);
  border-radius:0 var(--r-m) var(--r-m) 0;padding:20px 22px;
}
.motivos h3{font-size:18px;font-weight:800;margin-bottom:6px;}
.motivos p{font-size:15.6px;color:var(--cinza);line-height:1.56;}

/* ---------- formulário ---------- */
.sec--form{background:var(--tinta);color:var(--branco);}
.form__in{display:grid;gap:30px;}
.form__txt h2{font-size:clamp(25px,5.6vw,38px);line-height:1.16;font-weight:800;letter-spacing:-.4px;margin-bottom:14px;}
.form__txt > p{color:var(--cinza-c);margin-bottom:22px;}
.form{
  background:rgba(255,255,255,.045);border:1px solid var(--borda-esc);
  border-radius:var(--r-g);padding:22px;display:grid;gap:15px;
}
.campo{display:grid;gap:7px;}
.campo label{font-size:14.5px;font-weight:700;color:var(--creme);}
.campo input,.campo select,.campo textarea{
  width:100%;padding:14px 15px;border-radius:var(--r-p);
  border:1.6px solid var(--borda-esc);background:#0A1310;color:var(--branco);
  font-size:16px;transition:border-color .15s ease;
}
.campo textarea{resize:vertical;min-height:104px;line-height:1.5;}
.campo input::placeholder,.campo textarea::placeholder{color:#6E8579;}
.campo input:focus,.campo select:focus,.campo textarea:focus{border-color:var(--verde);outline:none;}
.campo select{appearance:none;-webkit-appearance:none;
  background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%231FCE7C'><path d='M7 10l5 5 5-5z'/></svg>");
  background-repeat:no-repeat;background-position:right 12px center;background-size:22px;padding-right:42px;}
.campo.is-erro input,.campo.is-erro select{border-color:#FF6B6B;}
.form__aviso{font-size:13.5px;color:var(--cinza-c);text-align:center;line-height:1.5;}
.form__erro{background:rgba(255,107,107,.14);border:1px solid rgba(255,107,107,.45);color:#FFC9C9;border-radius:var(--r-p);padding:11px 14px;font-size:14.5px;}
@media (min-width:900px){
  .form__in{grid-template-columns:.9fr 1.1fr;gap:52px;align-items:center;}
  .form{padding:30px;}
}

/* ---------- FAQ ---------- */
.faq{display:grid;gap:11px;}
.faq details{
  background:var(--creme);border:1px solid var(--creme-2);border-radius:var(--r-m);
  padding:4px 20px;transition:border-color .18s ease;
}
.faq details[open]{border-color:var(--verde);background:#fff;}
.faq summary{
  list-style:none;cursor:pointer;padding:16px 34px 16px 0;position:relative;
  font-weight:800;font-size:16.5px;line-height:1.4;
}
.faq summary::-webkit-details-marker{display:none;}
.faq summary::after{
  content:"";position:absolute;right:2px;top:50%;width:11px;height:11px;
  border-right:2.6px solid var(--verde-esc);border-bottom:2.6px solid var(--verde-esc);
  transform:translateY(-70%) rotate(45deg);transition:transform .2s ease;
}
.faq details[open] summary::after{transform:translateY(-20%) rotate(-135deg);}
.faq details p{padding:0 0 18px;color:var(--cinza);font-size:16px;line-height:1.6;}

/* ---------- CTA final ---------- */
.sec--cta{background:linear-gradient(160deg,#0D2B1D 0%,#0A1310 70%);color:var(--branco);text-align:center;}
.cta__in{max-width:760px;margin:0 auto;}
.cta__in h2{font-size:clamp(25px,5.8vw,40px);line-height:1.16;font-weight:800;letter-spacing:-.4px;}
.cta__in > p{margin-top:15px;color:var(--cinza-c);font-size:17px;}
.cta__acoes{display:flex;flex-wrap:wrap;gap:12px;justify-content:center;margin-top:28px;}
.cta__acoes .btn{flex:1 1 250px;}
.cta__local{margin-top:22px;font-size:14.5px;color:var(--cinza-c);letter-spacing:.3px;}
@media (min-width:640px){.cta__acoes .btn{flex:0 0 auto;}}

/* ---------- rodapé ---------- */
.rodape{background:#06100C;color:var(--cinza-c);padding:38px 0 96px;}
.rodape__in{display:grid;gap:18px;}
.rodape__marca{color:var(--branco);font-weight:800;font-size:18px;margin-bottom:4px;}
.rodape p{font-size:14.6px;line-height:1.55;}
.rodape__nav{display:flex;flex-wrap:wrap;gap:8px 20px;}
.rodape__nav a{font-size:14.6px;font-weight:600;}
.rodape__nav a:hover{color:var(--verde);}
.rodape__cred{border-top:1px solid rgba(255,255,255,.09);padding-top:16px;font-size:13.4px;}
@media (min-width:760px){
  .rodape{padding-bottom:44px;}
  .rodape__in{grid-template-columns:1fr auto;align-items:start;}
  .rodape__cred{grid-column:1/-1;}
}

/* ---------- botão flutuante ---------- */
.zap-flut{
  position:fixed;right:16px;bottom:16px;z-index:95;
  display:inline-flex;align-items:center;gap:9px;
  background:var(--zap);color:#fff;font-weight:800;font-size:15px;
  padding:14px 18px;border-radius:999px;box-shadow:0 14px 30px rgba(37,211,102,.42);
  transition:transform .16s ease,background .16s ease;
}
.zap-flut:hover{transform:translateY(-2px);background:var(--zap-esc);}
.zap-flut svg{width:23px;height:23px;fill:currentColor;flex:none;}
.zap-flut span{display:none;}
@media (min-width:520px){.zap-flut span{display:inline;}}

@media (prefers-reduced-motion:reduce){
  *{animation-duration:.001ms !important;animation-iteration-count:1 !important;transition-duration:.001ms !important;}
  html{scroll-behavior:auto;}
}