/* ============================================================
   APEX — FOLHA DE ESTILO
   Cores retiradas do arquivo oficial da logomarca:
   verde neon #77E705 · azul neon #0358FA · carbono #070B09
   ============================================================ */

@property --giro { syntax: "<angle>"; initial-value: 0deg; inherits: false; }

:root{
  /* --- neon da marca --- */
  --verde:      #77E705;
  --verde-luz:  #9BFF3A;
  --verde-esc:  #4A9403;
  --verde-fundo:#2F5A04;
  --azul:       #0358FA;
  --azul-luz:   #0497FA;
  --azul-esc:   #0134A0;

  /* --- titânio e carbono --- */
  --carbono:    #070B09;
  --carbono-2:  #0B100D;
  --titanio:    #121815;
  --titanio-2:  #1A231E;
  --titanio-3:  #232E28;
  --linha:      #222D27;
  --linha-2:    #34433B;

  /* --- texto --- */
  --txt:        #EDF2EF;
  --txt-2:      #A6B2AC;
  --txt-3:      #808E87;
  --txt-4:      #616F68;

  --alerta:     #FF5A46;

  /* --- forma --- */
  --r-p:        12px;
  --r:          18px;
  --r-g:        26px;
  --r-max:      999px;

  --max:        1240px;
  --gut:        clamp(22px, 5vw, 72px);
  --topo:       104px;
  --leitura:    58ch;
}

*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth;scroll-padding-top:130px;background:var(--carbono)}

body{
  background:var(--carbono);
  color:var(--txt);
  font-family:"IBM Plex Sans",system-ui,-apple-system,sans-serif;
  font-size:19px;
  line-height:1.75;
  -webkit-font-smoothing:antialiased;
  overflow-x:hidden;
}

img,svg{max-width:100%;display:block}
a{color:inherit}
button{font:inherit;color:inherit;background:none;border:0;cursor:pointer}
::selection{background:var(--verde);color:#06210A}
:focus-visible{outline:2px solid var(--verde);outline-offset:4px;border-radius:6px}

/* ---------- tipografia ---------- */
h1,h2,h3,.disp{
  font-family:Archivo,system-ui,sans-serif;
  font-weight:900;line-height:1;letter-spacing:-.042em;
}
h1{font-size:clamp(40px,7vw,90px)}
h2{font-size:clamp(30px,5vw,60px);line-height:1.02}
h3{font-family:Archivo;font-weight:800;font-size:clamp(20px,2.2vw,27px);line-height:1.14;letter-spacing:-.028em}

p{max-width:var(--leitura)}
strong,b{font-weight:600;color:var(--txt)}

.wrap{max-width:var(--max);margin:0 auto;padding:0 var(--gut);position:relative;z-index:2}
.estreito{max-width:900px;margin:0 auto;padding:0 var(--gut);position:relative;z-index:2}

.mono{font-family:"IBM Plex Mono",ui-monospace,monospace}

.olho{
  font-family:"IBM Plex Mono",ui-monospace,monospace;
  font-size:11px;font-weight:500;letter-spacing:.26em;text-transform:uppercase;
  color:var(--verde);display:inline-flex;align-items:center;gap:12px;
}
.olho::before{
  content:"";width:26px;height:2px;border-radius:2px;flex:none;
  background:linear-gradient(90deg,transparent,var(--verde));
  box-shadow:0 0 10px rgba(119,231,5,.8);
}

.corpo{color:var(--txt-2);font-size:clamp(18px,1.5vw,21px);margin-top:26px;line-height:1.75}
.corpo + .corpo{margin-top:20px}

/* ============================================================
   AMBIENTE — o fundo que se move em cada seção
   ============================================================ */
.palco{position:relative;overflow:hidden;isolation:isolate}

.ambiente{position:absolute;inset:0;z-index:0;pointer-events:none;overflow:hidden}
.ambiente i{
  position:absolute;display:block;border-radius:50%;
  filter:blur(90px);will-change:transform;
}
.ambiente i:nth-child(1){
  width:46vw;height:46vw;max-width:640px;max-height:640px;
  background:radial-gradient(circle,rgba(119,231,5,.11),transparent 72%);
  top:-14%;left:-10%;animation:vagar1 26s ease-in-out infinite alternate;
}
.ambiente i:nth-child(2){
  width:52vw;height:52vw;max-width:720px;max-height:720px;
  background:radial-gradient(circle,rgba(3,88,250,.16),transparent 72%);
  bottom:-20%;right:-12%;animation:vagar2 32s ease-in-out infinite alternate;
}
.ambiente i:nth-child(3){
  width:30vw;height:30vw;max-width:420px;max-height:420px;
  background:radial-gradient(circle,rgba(4,151,250,.10),transparent 72%);
  top:38%;left:52%;animation:vagar3 24s ease-in-out infinite alternate;
}
@keyframes vagar1{
  0%{transform:translate3d(0,0,0) scale(1)}
  50%{transform:translate3d(14vw,10vh,0) scale(1.14)}
  100%{transform:translate3d(4vw,22vh,0) scale(.94)}
}
@keyframes vagar2{
  0%{transform:translate3d(0,0,0) scale(1)}
  50%{transform:translate3d(-16vw,-12vh,0) scale(1.1)}
  100%{transform:translate3d(-6vw,-24vh,0) scale(.9)}
}
@keyframes vagar3{
  0%{transform:translate3d(0,0,0) scale(.9)}
  100%{transform:translate3d(-18vw,14vh,0) scale(1.2)}
}

/* trama de titânio que desliza devagar */
.trama{position:absolute;inset:0;z-index:0;pointer-events:none;opacity:.5}
.trama::before,.trama::after{content:"";position:absolute;inset:-100%}
.trama::before{
  background-image:
    linear-gradient(90deg,rgba(255,255,255,.035) 1px,transparent 1px),
    linear-gradient(rgba(255,255,255,.022) 1px,transparent 1px);
  background-size:128px 128px,128px 128px;
  animation:desliza 34s linear infinite;
  mask-image:radial-gradient(120% 84% at 50% 0%,#000 12%,transparent 76%);
  -webkit-mask-image:radial-gradient(120% 84% at 50% 0%,#000 12%,transparent 76%);
}
.trama::after{
  background-image:repeating-linear-gradient(58deg,
    rgba(255,255,255,.028) 0 1px,
    transparent 1px 9px);
  animation:desliza2 46s linear infinite;
  mask-image:radial-gradient(110% 78% at 50% 40%,#000 6%,transparent 72%);
  -webkit-mask-image:radial-gradient(110% 78% at 50% 40%,#000 6%,transparent 72%);
}
@keyframes desliza{to{transform:translate3d(128px,128px,0)}}
@keyframes desliza2{to{transform:translate3d(0,-180px,0)}}

/* raio de varredura, passa de vez em quando */
.varre{position:absolute;inset:0;z-index:0;pointer-events:none;overflow:hidden}
.varre::before{
  content:"";position:absolute;top:0;bottom:0;width:42%;left:-46%;
  background:linear-gradient(90deg,transparent,rgba(119,231,5,.075),rgba(4,151,250,.065),transparent);
  animation:varrer 11s ease-in-out infinite;
}
@keyframes varrer{
  0%,68%{left:-46%}
  100%{left:110%}
}

/* ============================================================
   CAIXAS COM NEON PERCORRENDO A BORDA
   ============================================================ */
.caixa{
  position:relative;border-radius:var(--r);
  background:linear-gradient(168deg,var(--titanio),var(--carbono-2));
  border:1px solid var(--linha);
  overflow:hidden;isolation:isolate;
}
.caixa::before{
  content:"";position:absolute;inset:0;border-radius:inherit;padding:1.5px;
  background:linear-gradient(112deg,
    transparent 24%,
    var(--verde) 40%,
    var(--verde-luz) 46%,
    var(--azul-luz) 54%,
    var(--azul) 60%,
    transparent 76%);
  background-size:280% 100%;
  animation:correBorda 6.5s linear infinite;
  -webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);
  -webkit-mask-composite:xor;mask-composite:exclude;
  pointer-events:none;z-index:3;
}
@keyframes correBorda{
  from{background-position:190% 0}
  to{background-position:-90% 0}
}
.caixa.lento::before{animation-duration:11s}
.caixa.brilho{box-shadow:0 0 0 1px rgba(119,231,5,.06),0 24px 60px rgba(0,0,0,.5)}

/* brilho interno que respira */
.caixa::after{
  content:"";position:absolute;inset:0;border-radius:inherit;pointer-events:none;z-index:0;
  background:radial-gradient(120% 80% at 12% 0%,rgba(119,231,5,.035),transparent 58%),
             radial-gradient(110% 80% at 92% 100%,rgba(3,88,250,.05),transparent 58%);
  animation:respira 9s ease-in-out infinite alternate;
}
@keyframes respira{from{opacity:.55}to{opacity:1}}

/* ============================================================
   BOTÕES
   Relevo de tecla, sem halo aceso em volta.
   A única luz é a que atravessa por dentro, de vez em quando.
   ============================================================ */
.btn{
  position:relative;display:inline-flex;align-items:center;justify-content:center;gap:11px;
  border-radius:var(--r-max);padding:16px 30px;
  font-weight:600;font-size:15.5px;text-decoration:none;
  color:#06210A;border:0;
  background:linear-gradient(180deg,var(--verde-luz) 0%,var(--verde) 48%,var(--verde-esc) 100%);
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.5),
    inset 0 -2px 3px rgba(0,0,0,.24),
    0 4px 0 #2C5D02,
    0 8px 16px rgba(0,0,0,.45);
  transform:translateY(0);
  transition:transform .14s ease,box-shadow .18s ease,filter .18s ease;
  isolation:isolate;overflow:hidden;
}

/* a luz que passa por dentro */
.btn::after{
  content:"";position:absolute;inset:0;border-radius:inherit;pointer-events:none;
  background:linear-gradient(102deg,
    transparent 40%,
    rgba(255,255,255,.34) 49%,
    rgba(255,255,255,.05) 55%,
    transparent 64%);
  background-size:240% 100%;background-position:180% 0;
  animation:passaLuz 7s ease-in-out infinite;
}
@keyframes passaLuz{
  0%,64%{background-position:180% 0}
  100%{background-position:-80% 0}
}

.btn:hover{
  transform:translateY(-2px);filter:brightness(1.05);
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.55),
    inset 0 -2px 3px rgba(0,0,0,.24),
    0 6px 0 #2C5D02,
    0 12px 22px rgba(0,0,0,.5);
}
.btn:active{
  transform:translateY(4px);
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.34),
    inset 0 3px 8px rgba(0,0,0,.36),
    0 0 0 #2C5D02,
    0 3px 8px rgba(0,0,0,.4);
}
.btn .seta{transition:transform .2s ease}
.btn:hover .seta{transform:translateX(4px)}

/* azul */
.btn.azul{
  color:#F2F8FF;
  background:linear-gradient(180deg,var(--azul-luz) 0%,var(--azul) 50%,var(--azul-esc) 100%);
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.38),
    inset 0 -2px 3px rgba(0,0,0,.3),
    0 4px 0 #01235E,
    0 8px 16px rgba(0,0,0,.45);
}
.btn.azul:hover{
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.45),
    inset 0 -2px 3px rgba(0,0,0,.3),
    0 6px 0 #01235E,
    0 12px 22px rgba(0,0,0,.5);
}
.btn.azul:active{
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.28),
    inset 0 3px 8px rgba(0,0,0,.4),
    0 0 0 #01235E,
    0 3px 8px rgba(0,0,0,.4);
}

/* titânio */
.btn.linha{
  color:var(--txt);
  background:linear-gradient(180deg,var(--titanio-3),var(--titanio));
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.09),
    inset 0 -2px 3px rgba(0,0,0,.4),
    0 4px 0 #0A0F0C,
    0 8px 16px rgba(0,0,0,.5);
}
.btn.linha::after{
  background:linear-gradient(102deg,
    transparent 40%,
    rgba(119,231,5,.20) 49%,
    rgba(4,151,250,.12) 55%,
    transparent 64%);
  background-size:240% 100%;background-position:180% 0;
}
.btn.linha:hover{
  color:var(--verde);filter:none;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.12),
    inset 0 -2px 3px rgba(0,0,0,.4),
    0 6px 0 #0A0F0C,
    0 12px 22px rgba(0,0,0,.55);
}
.btn.linha:active{
  box-shadow:
    inset 0 2px 6px rgba(0,0,0,.5),
    0 0 0 #0A0F0C,
    0 3px 8px rgba(0,0,0,.4);
}

.btn.largo{width:100%}
.btn.pequeno{padding:12px 22px;font-size:14px}

/* ============================================================
   TOPO E RÉGUA DO DIA
   ============================================================ */
.topo{
  position:sticky;top:0;z-index:90;
  background:rgba(7,11,9,.78);
  backdrop-filter:blur(20px) saturate(150%);
  -webkit-backdrop-filter:blur(20px) saturate(150%);
}
.topo .nav{display:flex;align-items:center;gap:clamp(18px,3vw,48px);height:var(--topo)}

.marca{display:flex;align-items:center;gap:11px;text-decoration:none;flex:none}
.marca img{height:78px;width:auto}


.menu{display:flex;list-style:none;font-size:15px;justify-content:space-evenly;flex:1;gap:clamp(10px,1.4vw,22px)}
.menu a{text-decoration:none;color:var(--txt-3);padding:6px 2px;position:relative;transition:color .2s ease}
.menu a::after{
  content:"";position:absolute;left:0;right:100%;bottom:0;height:2px;border-radius:2px;
  background:var(--verde);box-shadow:0 0 8px var(--verde);transition:right .28s ease;
}
.menu a:hover{color:var(--txt)}
.menu a:hover::after,.menu a.aqui::after{right:0}
.menu a.aqui{color:var(--txt)}

.leitura-topo{
  display:flex;align-items:baseline;gap:11px;flex:none;
  font-family:"IBM Plex Mono",monospace;font-size:11.5px;letter-spacing:.1em;
}
.leitura-topo b{color:var(--verde);font-weight:500;font-variant-numeric:tabular-nums}
.leitura-topo span{color:var(--txt-4);text-transform:uppercase;letter-spacing:.16em;font-size:10.5px}

.regua{position:relative;height:2px;background:var(--linha)}
.regua i{
  position:absolute;left:0;top:0;height:2px;width:var(--p,0%);
  background:linear-gradient(90deg,var(--azul),var(--azul-luz) 40%,var(--verde));
  box-shadow:0 0 14px rgba(119,231,5,.7);
}
.regua i::after{
  content:"";position:absolute;right:-2px;top:-3px;width:4px;height:8px;border-radius:2px;
  background:var(--verde-luz);box-shadow:0 0 14px 2px rgba(119,231,5,.95);
}

.abre-menu{display:none;width:44px;height:44px;align-items:center;justify-content:center;flex:none;border-radius:var(--r-p)}
.abre-menu span{display:block;width:20px;height:2px;border-radius:2px;background:var(--txt);position:relative;transition:background .2s}
.abre-menu span::before,.abre-menu span::after{
  content:"";position:absolute;left:0;width:20px;height:2px;border-radius:2px;background:var(--txt);transition:transform .28s ease;
}
.abre-menu span::before{top:-6px}
.abre-menu span::after{top:6px}
.abre-menu[aria-expanded="true"] span{background:transparent}
.abre-menu[aria-expanded="true"] span::before{transform:translateY(6px) rotate(45deg)}
.abre-menu[aria-expanded="true"] span::after{transform:translateY(-6px) rotate(-45deg)}

.gaveta{display:none;background:var(--carbono);border-bottom:1px solid var(--linha);padding:10px var(--gut) 26px}
.gaveta.aberta{display:block}
.gaveta ul{list-style:none}
.gaveta a{display:block;text-decoration:none;padding:15px 0;font-size:18px;border-bottom:1px solid var(--linha);color:var(--txt-2)}
.gaveta .btn{margin-top:20px}

/* ============================================================
   HERÓI
   ============================================================ */
.heroi{padding:clamp(44px,5vw,72px) 0 clamp(52px,6vw,84px)}
.heroi-grade{
  display:grid;grid-template-columns:minmax(0,1.06fr) minmax(0,.94fr);
  gap:clamp(38px,6vw,80px);align-items:center;
}
.heroi h1{margin-top:26px;max-width:13ch}
.heroi h1 mark{
  background:none;
  background-image:linear-gradient(102deg,var(--verde) 10%,var(--verde-luz) 44%,var(--azul-luz) 92%);
  -webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;
}
.heroi .sub{margin-top:28px;font-size:clamp(18px,1.6vw,21.5px);line-height:1.68;color:var(--txt-2);max-width:48ch}
.heroi .sub b{color:var(--txt)}
.heroi .acoes{display:flex;gap:14px;flex-wrap:wrap;margin-top:38px}

.assinatura-heroi{
  margin-top:clamp(44px,6vw,72px);padding-top:22px;border-top:1px solid var(--linha);
  display:flex;gap:12px 26px;flex-wrap:wrap;align-items:center;
  font-family:"IBM Plex Mono",monospace;font-size:11px;letter-spacing:.16em;
  text-transform:uppercase;color:var(--txt-4);
}
.assinatura-heroi span{display:inline-flex;align-items:center;gap:9px}
.assinatura-heroi span::before{
  content:"";width:5px;height:5px;border-radius:50%;background:var(--verde);
  box-shadow:0 0 8px var(--verde);flex:none;
}
@media(max-width:940px){
  .heroi-grade{grid-template-columns:1fr;gap:42px}
  .heroi h1{max-width:15ch}
}

/* ---------- o celular apitando ---------- */
.avisos-topo{
  display:flex;align-items:center;justify-content:space-between;gap:14px;
  padding:17px 22px;border-bottom:1px solid var(--linha);position:relative;z-index:2;
  font-family:"IBM Plex Mono",monospace;font-size:10.5px;letter-spacing:.18em;
  text-transform:uppercase;color:var(--txt-3);
}
.avisos-topo b{
  color:var(--alerta);font-weight:500;font-size:17px;letter-spacing:.02em;
  font-variant-numeric:tabular-nums;text-shadow:0 0 16px rgba(255,90,70,.55);
}
.avisos-lista{
  padding:6px 0;min-height:270px;display:flex;flex-direction:column;justify-content:flex-end;
  overflow:hidden;position:relative;z-index:2;
}
.aviso{
  display:grid;grid-template-columns:54px 1fr;gap:14px;align-items:baseline;
  padding:12px 22px;animation:entrar .5s cubic-bezier(.2,.75,.3,1) both;
}
.aviso .h{font-family:"IBM Plex Mono",monospace;font-size:11.5px;color:var(--txt-4);font-variant-numeric:tabular-nums}
.aviso .q{font-size:15.5px;line-height:1.5;color:var(--txt-2)}
.aviso .q b{display:block;color:var(--txt);font-weight:600;font-size:13px;margin-bottom:1px}
.aviso.saindo{animation:sumir .45s ease forwards}
@keyframes entrar{from{opacity:0;transform:translateY(16px)}to{opacity:1;transform:none}}
@keyframes sumir{to{opacity:0;transform:translateY(-12px);max-height:0;padding-top:0;padding-bottom:0}}

.avisos-pe{
  padding:16px 22px;border-top:1px solid var(--linha);position:relative;z-index:2;
  display:flex;align-items:center;gap:12px;font-size:13.5px;color:var(--txt-3);
}
.pisca{
  width:8px;height:8px;border-radius:50%;background:var(--alerta);flex:none;
  box-shadow:0 0 12px rgba(255,90,70,.9);animation:bater 1.9s infinite ease-in-out;
}
.avisos-pe.calmo .pisca{background:var(--verde);box-shadow:0 0 14px rgba(119,231,5,.9);animation:none}
@keyframes bater{0%,100%{opacity:.35;transform:scale(1)}50%{opacity:1;transform:scale(1.35)}}

/* ============================================================
   ATOS
   ============================================================ */
.ato{padding:clamp(58px,7.5vw,104px) 0;position:relative}
.ato.compacto{padding:clamp(48px,5.5vw,76px) 0}

.tese{
  font-family:Archivo;font-weight:900;letter-spacing:-.042em;line-height:1.02;
  font-size:clamp(30px,4.8vw,58px);max-width:17ch;margin-top:26px;
}
.tese em{font-style:normal;color:var(--txt-3)}
.tese mark{background:none;color:var(--verde)}

.duas{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:clamp(30px,5vw,72px)}
@media(max-width:880px){.duas{grid-template-columns:1fr;gap:34px}}

/* ---------- detalhe sob demanda ---------- */
.mais{margin-top:32px}
.mais-btn{
  display:inline-flex;align-items:center;gap:11px;border-radius:var(--r-max);
  font-family:"IBM Plex Mono",monospace;font-size:11px;letter-spacing:.18em;
  text-transform:uppercase;color:var(--txt-3);
  padding:12px 22px;background:var(--titanio);border:1px solid var(--linha-2);
  transition:color .22s ease,border-color .22s ease,box-shadow .22s ease,transform .16s ease;
}
.mais-btn:hover{
  color:var(--verde);border-color:rgba(119,231,5,.45);transform:translateY(-1px);
  background:var(--titanio-2);
}
.mais-btn .cruz{position:relative;width:10px;height:10px;flex:none}
.mais-btn .cruz::before,.mais-btn .cruz::after{content:"";position:absolute;background:currentColor;border-radius:2px;transition:transform .3s ease,opacity .3s ease}
.mais-btn .cruz::before{left:0;top:4px;width:10px;height:2px}
.mais-btn .cruz::after{left:4px;top:0;width:2px;height:10px}
.mais.aberto .mais-btn .cruz::after{transform:rotate(90deg);opacity:0}
.mais.aberto .mais-btn{color:var(--verde);border-color:rgba(119,231,5,.5)}

.mais-corpo{display:grid;grid-template-rows:0fr;transition:grid-template-rows .5s cubic-bezier(.2,.7,.3,1)}
.mais.aberto .mais-corpo{grid-template-rows:1fr}
.mais-corpo > .dentro{overflow:hidden}
.mais-corpo .pad{padding-top:30px}

/* ---------- o log do dia ---------- */
.log{margin-top:44px;border-radius:var(--r);overflow:hidden}
.log-linha{
  display:grid;grid-template-columns:70px 1fr auto;gap:10px 22px;align-items:baseline;
  padding:18px 22px;border-bottom:1px solid var(--linha);position:relative;z-index:2;
  transition:background .25s ease;
}
.log-linha:last-child{border-bottom:0}
.log-linha:hover{background:rgba(119,231,5,.04)}
.log-linha .h{
  font-family:"IBM Plex Mono",monospace;font-size:12px;color:var(--verde);
  font-variant-numeric:tabular-nums;letter-spacing:.04em;
}
.log-linha .o{font-size:18px;color:var(--txt-2);line-height:1.55}
.log-linha .m{
  font-family:"IBM Plex Mono",monospace;font-size:10.5px;letter-spacing:.14em;
  text-transform:uppercase;color:var(--txt-4);text-align:right;white-space:nowrap;
}
@media(max-width:720px){
  .log-linha{grid-template-columns:58px 1fr;padding:16px 18px}
  .log-linha .m{grid-column:2;text-align:left}
}
.log-fim{
  margin-top:36px;font-family:Archivo;font-weight:800;letter-spacing:-.03em;
  font-size:clamp(20px,2.6vw,30px);line-height:1.2;max-width:26ch;
}
.log-fim mark{background:none;color:var(--alerta)}

/* ============================================================
   FERRAMENTA E AGENTE
   ============================================================ */
.confronto{display:grid;grid-template-columns:1fr 1fr;gap:clamp(18px,2.4vw,28px);margin-top:52px}
.lado{padding:clamp(24px,3vw,36px);border-radius:var(--r)}
.lado.frio{background:rgba(18,24,21,.55);border:1px solid var(--linha)}
.lado .sel{
  font-family:"IBM Plex Mono",monospace;font-size:10.5px;letter-spacing:.2em;
  text-transform:uppercase;margin-bottom:20px;display:block;position:relative;z-index:2;
}
.lado.frio .sel{color:var(--txt-4)}
.lado.vivo .sel{color:var(--verde)}
.lado h3{margin-bottom:20px;position:relative;z-index:2}
.lado.frio h3{color:var(--txt-3)}
.lado ul{list-style:none;position:relative;z-index:2}
.lado li{padding:15px 0;border-top:1px solid var(--linha);font-size:17.5px;line-height:1.55;position:relative}
.lado.frio li{color:var(--txt-4)}
.lado.vivo li{color:var(--txt-2);padding-left:24px}
.lado.vivo li::before{
  content:"";position:absolute;left:0;top:23px;width:7px;height:7px;border-radius:50%;
  background:var(--verde);box-shadow:0 0 10px var(--verde);
}
@media(max-width:880px){.confronto{grid-template-columns:1fr}}

/* ============================================================
   O AGENTE EM AÇÃO
   ============================================================ */
.chips{display:flex;gap:9px;flex-wrap:wrap;margin-top:40px}
.chip{
  font-family:"IBM Plex Mono",monospace;font-size:11px;letter-spacing:.14em;
  text-transform:uppercase;color:var(--txt-3);border-radius:var(--r-max);
  border:1px solid var(--linha-2);padding:12px 20px;
  background:linear-gradient(180deg,var(--titanio-2),var(--titanio));
  box-shadow:inset 0 1px 0 rgba(255,255,255,.06),0 3px 0 #0A0F0C;
  transition:color .2s ease,border-color .2s ease,transform .16s ease,box-shadow .2s ease;
}
.chip:hover{color:var(--txt);border-color:var(--txt-4);transform:translateY(-1px)}
.chip[aria-selected="true"]{
  color:#06210A;border-color:var(--verde);
  background:linear-gradient(180deg,var(--verde-luz),var(--verde-esc));
  box-shadow:inset 0 1px 0 rgba(255,255,255,.5),0 3px 0 #2C5D02,0 7px 14px rgba(0,0,0,.4);
}

.janela{margin-top:26px;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,.76fr)}
@media(max-width:940px){.janela{grid-template-columns:1fr}}

.janela-cab{
  grid-column:1/-1;display:flex;align-items:center;gap:14px;flex-wrap:wrap;
  padding:16px 22px;border-bottom:1px solid var(--linha);position:relative;z-index:2;
  background:rgba(26,35,30,.55);
}
.janela-cab .nome{font-size:15.5px;font-weight:600;color:var(--txt)}
.janela-cab .papel{
  font-family:"IBM Plex Mono",monospace;font-size:10.5px;letter-spacing:.16em;
  text-transform:uppercase;color:var(--txt-3);
}
.janela-cab .sinal{
  margin-left:auto;display:inline-flex;align-items:center;gap:9px;
  font-family:"IBM Plex Mono",monospace;font-size:10.5px;letter-spacing:.16em;
  text-transform:uppercase;color:var(--verde);
}
.janela-cab .sinal::before{
  content:"";width:7px;height:7px;border-radius:50%;background:var(--verde);
  box-shadow:0 0 12px var(--verde);animation:bater 2s infinite;
}
.janela-cab .quando{font-family:"IBM Plex Mono",monospace;font-size:11px;color:var(--txt-4)}

.conversa{
  padding:24px;display:flex;flex-direction:column;gap:12px;min-height:340px;
  border-right:1px solid var(--linha);position:relative;z-index:2;
}
@media(max-width:940px){.conversa{border-right:0;border-bottom:1px solid var(--linha);min-height:340px}}

.msg{
  max-width:86%;padding:14px 18px;font-size:16px;line-height:1.6;
  animation:entrar .4s cubic-bezier(.2,.75,.3,1) both;
}
.msg.cliente{align-self:flex-start;background:var(--titanio-3);color:var(--txt);border-radius:4px 16px 16px 16px}
.msg.agente{
  align-self:flex-end;color:#E4FBD2;border-radius:16px 4px 16px 16px;
  background:linear-gradient(150deg,rgba(119,231,5,.16),rgba(74,148,3,.1));
  border:1px solid rgba(119,231,5,.28);
  box-shadow:0 0 26px rgba(119,231,5,.12);
}
.msg .h{display:block;font-family:"IBM Plex Mono",monospace;font-size:10px;color:var(--txt-4);margin-top:7px;text-align:right}
.msg.marco{
  align-self:stretch;max-width:100%;background:none;padding:14px 0;border-radius:0;border:0;
  border-top:1px solid var(--linha);box-shadow:none;
  font-family:"IBM Plex Mono",monospace;font-size:10.5px;letter-spacing:.14em;
  text-transform:uppercase;color:var(--txt-4);text-align:center;
}
.msg.marco b{color:var(--verde);font-weight:500}

.digitando{
  align-self:flex-end;display:flex;gap:5px;padding:15px 18px;border-radius:16px 4px 16px 16px;
  background:rgba(119,231,5,.12);border:1px solid rgba(119,231,5,.24);
}
.digitando i{width:6px;height:6px;border-radius:50%;background:var(--verde);box-shadow:0 0 8px var(--verde);animation:saltar 1.1s infinite}
.digitando i:nth-child(2){animation-delay:.15s}
.digitando i:nth-child(3){animation-delay:.3s}
@keyframes saltar{0%,60%,100%{opacity:.3;transform:translateY(0)}30%{opacity:1;transform:translateY(-5px)}}

.espelho-dono{padding:24px;display:flex;flex-direction:column;position:relative;z-index:2}
.espelho-dono .tit{
  font-family:"IBM Plex Mono",monospace;font-size:10.5px;letter-spacing:.18em;
  text-transform:uppercase;color:var(--txt-3);padding-bottom:16px;border-bottom:1px solid var(--linha);
}
.evento{
  display:flex;gap:13px;align-items:flex-start;padding:16px 0;border-bottom:1px solid var(--linha);
  animation:entrar .5s ease both;
}
.evento .pt{width:7px;height:7px;border-radius:50%;background:var(--verde);margin-top:8px;flex:none;box-shadow:0 0 12px var(--verde)}
.evento .tx{font-size:15.5px;line-height:1.55;color:var(--txt-3)}
.evento .tx b{display:block;color:var(--txt);font-weight:600;font-size:14.5px;margin-bottom:2px}
.espelho-vazio{
  margin:auto 0;padding:30px 0;text-align:center;color:var(--txt-4);
  font-family:"IBM Plex Mono",monospace;letter-spacing:.14em;text-transform:uppercase;font-size:10.5px;
}

.demo-pe{
  grid-column:1/-1;display:flex;align-items:center;justify-content:space-between;gap:16px;flex-wrap:wrap;
  padding:15px 22px;border-top:1px solid var(--linha);position:relative;z-index:2;
  background:rgba(26,35,30,.5);
  font-family:"IBM Plex Mono",monospace;font-size:10px;letter-spacing:.12em;
  text-transform:uppercase;color:var(--txt-4);
}
.repetir{color:var(--verde);letter-spacing:.14em;transition:text-shadow .2s}
.repetir:hover{text-shadow:0 0 12px rgba(119,231,5,.7)}

/* ---------- fluxo ---------- */
.fluxo{margin-top:clamp(48px,7vw,84px)}
.fluxo-trilho{display:grid;grid-template-columns:repeat(5,1fr);position:relative;padding-top:28px}
.fluxo-trilho::before{content:"";position:absolute;left:0;right:0;top:0;height:2px;border-radius:2px;background:var(--linha)}
.fluxo-trilho::after{
  content:"";position:absolute;left:0;top:0;height:2px;width:0;border-radius:2px;
  background:linear-gradient(90deg,var(--azul),var(--azul-luz),var(--verde));
  box-shadow:0 0 14px rgba(119,231,5,.6);
}
.fluxo.corre .fluxo-trilho::after{animation:atravessar 2.6s cubic-bezier(.35,.1,.3,1) forwards}
@keyframes atravessar{to{width:100%}}
.passo{padding:0 22px 0 0;position:relative}
.passo::before{
  content:"";position:absolute;left:0;top:-5px;width:9px;height:9px;border-radius:50%;
  background:var(--linha-2);transition:background .3s ease,box-shadow .3s ease;
}
.fluxo.corre .passo::before{background:var(--verde);box-shadow:0 0 14px 2px rgba(119,231,5,.8)}
.fluxo.corre .passo:nth-child(1)::before{transition-delay:.1s}
.fluxo.corre .passo:nth-child(2)::before{transition-delay:.62s}
.fluxo.corre .passo:nth-child(3)::before{transition-delay:1.14s}
.fluxo.corre .passo:nth-child(4)::before{transition-delay:1.7s}
.fluxo.corre .passo:nth-child(5)::before{transition-delay:2.3s}
.passo .p{
  font-family:"IBM Plex Mono",monospace;font-size:10px;letter-spacing:.18em;
  text-transform:uppercase;color:var(--txt-4);margin-bottom:10px;
}
.passo h4{font-family:Archivo;font-weight:800;font-size:16px;letter-spacing:-.02em;line-height:1.2;color:var(--txt)}
.passo small{display:block;margin-top:9px;font-size:15px;line-height:1.6;color:var(--txt-3)}
@media(max-width:900px){
  .fluxo-trilho{grid-template-columns:1fr;gap:26px;padding-top:0;padding-left:24px}
  .fluxo-trilho::before{left:0;right:auto;top:0;bottom:0;width:2px;height:auto}
  .fluxo-trilho::after{display:none}
  .passo{padding:0}
  .passo::before{left:-19px;top:4px}
}

/* ============================================================
   MÉTODO
   ============================================================ */
.regra{
  margin-top:38px;padding:28px 32px;border-radius:var(--r);max-width:44ch;
  border-left:3px solid var(--verde);
  background:linear-gradient(100deg,rgba(119,231,5,.10),transparent 70%);
  box-shadow:inset 0 0 40px rgba(119,231,5,.05);
}
.regra .f{font-family:Archivo;font-weight:900;font-size:clamp(20px,2.5vw,28px);letter-spacing:-.03em;line-height:1.14}
.regra p{margin-top:12px;font-size:15.5px;color:var(--txt-3)}

.etapas{margin-top:clamp(46px,6vw,72px);display:grid;gap:14px}
.etapa{
  display:grid;grid-template-columns:96px minmax(0,1fr);gap:clamp(16px,3vw,40px);
  padding:clamp(20px,2.4vw,28px) clamp(22px,3vw,32px);
}
.etapa .n{
  font-family:"IBM Plex Mono",monospace;font-size:12px;letter-spacing:.16em;
  color:var(--verde);padding-top:7px;position:relative;z-index:2;
}
.etapa > div{position:relative;z-index:2}
.etapa .t{font-size:18px;color:var(--txt-2);margin-top:14px;max-width:52ch;line-height:1.68}
.recebe{
  margin-top:20px;padding:14px 18px;border-radius:var(--r-p);max-width:52ch;
  background:rgba(3,88,250,.08);border:1px solid rgba(4,151,250,.18);
  font-size:16px;color:var(--txt-2);line-height:1.65;
}
.recebe b{color:var(--azul-luz);font-weight:600}
@media(max-width:640px){
  .etapa{grid-template-columns:1fr;gap:8px}
  .etapa .n{padding-top:0}
}

/* ============================================================
   ENTREGAS
   ============================================================ */
.entregas{margin-top:clamp(44px,6vw,68px);display:grid;gap:14px}
.entrega-cab{
  width:100%;display:grid;grid-template-columns:60px minmax(0,1fr) 36px;
  gap:clamp(14px,2.4vw,30px);align-items:center;text-align:left;
  padding:clamp(24px,3vw,32px) clamp(22px,3vw,32px);position:relative;z-index:2;
}
.entrega-cab .n{font-family:"IBM Plex Mono",monospace;font-size:11.5px;letter-spacing:.16em;color:var(--txt-4)}
.entrega-cab h3{transition:color .25s ease}
.entrega-cab:hover h3{color:var(--verde)}
.entrega-cab .l{font-size:16px;color:var(--txt-3);margin-top:8px;line-height:1.5;max-width:52ch;display:block}
.entrega-cab .cruz{position:relative;width:14px;height:14px;justify-self:end;color:var(--txt-3)}
.entrega-cab .cruz::before,.entrega-cab .cruz::after{content:"";position:absolute;background:currentColor;border-radius:2px;transition:transform .35s cubic-bezier(.2,.7,.3,1),opacity .3s}
.entrega-cab .cruz::before{left:0;top:6px;width:14px;height:2px}
.entrega-cab .cruz::after{left:6px;top:0;width:2px;height:14px}
.entrega.aberta .cruz{color:var(--verde)}
.entrega.aberta .cruz::after{transform:rotate(90deg);opacity:0}
.entrega.aberta h3{color:var(--verde)}
.entrega-corpo{display:grid;grid-template-rows:0fr;transition:grid-template-rows .5s cubic-bezier(.2,.7,.3,1);position:relative;z-index:2}
.entrega.aberta .entrega-corpo{grid-template-rows:1fr}
.entrega-corpo > .dentro{overflow:hidden}
.entrega-corpo .pad{padding:0 clamp(22px,3vw,32px) clamp(28px,3.4vw,36px) clamp(74px,8vw,92px)}
.entrega-corpo p{color:var(--txt-2);font-size:18px;line-height:1.7}
.entrega-corpo ul{list-style:none;margin-top:20px;display:grid;gap:2px}
.entrega-corpo li{padding:12px 0 12px 24px;position:relative;font-size:16.5px;color:var(--txt-3)}
.entrega-corpo li::before{
  content:"";position:absolute;left:0;top:20px;width:7px;height:7px;border-radius:50%;
  background:var(--azul-luz);box-shadow:0 0 8px var(--azul-luz);
}
@media(max-width:640px){
  .entrega-cab{grid-template-columns:40px minmax(0,1fr) 24px;gap:12px}
  .entrega-corpo .pad{padding-left:24px}
}

/* ============================================================
   O MOTIVO
   ============================================================ */
.consequencias{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;margin-top:34px}
.consequencia{padding:clamp(22px,2.6vw,30px);border-radius:var(--r)}
.consequencia .k{
  font-family:"IBM Plex Mono",monospace;font-size:10px;letter-spacing:.2em;
  text-transform:uppercase;color:var(--txt-4);display:block;margin-bottom:12px;position:relative;z-index:2;
}
.consequencia h4{font-family:Archivo;font-weight:800;font-size:18px;letter-spacing:-.02em;color:var(--txt);position:relative;z-index:2}
.consequencia p{font-size:16.5px;color:var(--txt-3);line-height:1.62;margin-top:10px;position:relative;z-index:2}
@media(max-width:820px){.consequencias{grid-template-columns:1fr}}

.gigante{
  font-family:Archivo;font-weight:900;letter-spacing:-.05em;line-height:.94;
  font-size:clamp(42px,7.6vw,104px);margin-top:22px;
}
.gigante span{
  display:block;
  background-image:linear-gradient(96deg,var(--verde) 6%,var(--verde-luz) 46%,var(--azul-luz) 96%);
  -webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;
}
.motivo .depois{margin-top:clamp(34px,4vw,52px);max-width:54ch;color:var(--txt-2);font-size:clamp(17px,1.4vw,19.5px)}
.motivo .assina{
  margin-top:34px;font-family:Archivo;font-weight:900;letter-spacing:-.035em;
  font-size:clamp(21px,2.8vw,34px);line-height:1.16;
}

/* ============================================================
   PARA QUEM É
   ============================================================ */
.setores{display:flex;flex-wrap:wrap;gap:8px;margin-top:32px}
.setores span{
  font-family:"IBM Plex Mono",monospace;font-size:10.5px;letter-spacing:.14em;
  text-transform:uppercase;color:var(--txt-3);border-radius:var(--r-max);
  border:1px solid var(--linha-2);padding:9px 16px;background:rgba(18,24,21,.6);
}
.aspas{margin-top:44px;display:grid;grid-template-columns:1fr 1fr;gap:14px}
.aspas blockquote{
  padding:clamp(24px,3vw,32px);border-radius:var(--r);
  font-family:Archivo;font-weight:800;letter-spacing:-.025em;line-height:1.18;
  font-size:clamp(19px,2.2vw,25px);color:var(--txt);
}
.aspas blockquote span{position:relative;z-index:2;display:block}
.aspas blockquote small{
  font-size:11px;
  display:block;margin-top:14px;font-family:"IBM Plex Mono",monospace;font-weight:400;
  font-size:10.5px;letter-spacing:.16em;text-transform:uppercase;color:var(--txt-4);
}
@media(max-width:760px){.aspas{grid-template-columns:1fr}}

/* ============================================================
   PERGUNTAS
   ============================================================ */
.faq{margin-top:44px;display:grid;gap:12px}
.faq details{border-radius:var(--r);overflow:hidden}
.faq summary{
  list-style:none;cursor:pointer;padding:24px 56px 24px clamp(22px,3vw,30px);position:relative;z-index:2;
  font-family:Archivo;font-weight:800;letter-spacing:-.025em;
  font-size:clamp(17px,2vw,21px);line-height:1.28;color:var(--txt-2);
  transition:color .22s ease;
}
.faq summary::-webkit-details-marker{display:none}
.faq summary:hover{color:var(--txt)}
.faq details[open] summary{color:var(--verde)}
.faq summary::before,.faq summary::after{content:"";position:absolute;background:currentColor;border-radius:2px;transition:transform .34s cubic-bezier(.2,.7,.3,1),opacity .3s}
.faq summary::before{right:clamp(20px,2.6vw,28px);top:calc(50% - 1px);width:14px;height:2px}
.faq summary::after{right:calc(clamp(20px,2.6vw,28px) + 6px);top:calc(50% - 7px);width:2px;height:14px}
.faq details[open] summary::after{transform:rotate(90deg);opacity:0}
.faq .resp{
  padding:0 clamp(22px,3vw,30px) 28px;color:var(--txt-2);font-size:18px;line-height:1.72;
  position:relative;z-index:2;animation:entrar .34s ease both;max-width:64ch;
}
.faq .resp strong{color:var(--txt)}

/* ============================================================
   O QUE NÃO PROMETEMOS
   ============================================================ */
.nao{margin-top:46px;list-style:none;display:grid;gap:12px}
.nao li{
  padding:22px 24px 22px 56px;border-radius:var(--r);position:relative;
  border:1px solid var(--linha);background:rgba(18,24,21,.5);
  font-family:Archivo;font-weight:800;letter-spacing:-.028em;line-height:1.22;
  font-size:clamp(17.5px,2.2vw,25px);color:var(--txt-3);
}
.nao li::before{
  content:"";position:absolute;left:24px;top:calc(50% - 1px);width:20px;height:2px;border-radius:2px;
  background:var(--alerta);box-shadow:0 0 10px rgba(255,90,70,.6);
}
.promessa{
  margin-top:48px;font-family:Archivo;font-weight:900;letter-spacing:-.04em;line-height:1.1;
  font-size:clamp(24px,3.6vw,44px);max-width:22ch;
}
.promessa mark{background:none;color:var(--verde)}

/* ============================================================
   FECHAMENTO
   ============================================================ */
.fim{padding:clamp(58px,7.5vw,100px) 0 clamp(48px,6vw,76px);position:relative}
.noite{display:grid;grid-template-columns:minmax(0,.86fr) minmax(0,1.14fr);gap:clamp(34px,5vw,72px);align-items:center}
@media(max-width:940px){.noite{grid-template-columns:1fr;gap:40px}}

.caminhos{margin-top:clamp(40px,5vw,64px);display:grid;gap:12px}
.caminho{
  display:grid;grid-template-columns:minmax(0,1fr) auto;gap:clamp(18px,3vw,44px);
  align-items:center;padding:clamp(24px,3vw,32px) clamp(22px,3vw,32px);
}
.caminho > div{position:relative;z-index:2}
.caminho .btn{position:relative;z-index:2}
.caminho .k{
  font-family:"IBM Plex Mono",monospace;font-size:10px;letter-spacing:.2em;
  text-transform:uppercase;color:var(--txt-4);margin-bottom:10px;display:block;
}
.caminho.marcado .k{color:var(--verde)}
.caminho p{margin-top:10px;font-size:16.5px;color:var(--txt-3);max-width:56ch;line-height:1.62}
@media(max-width:700px){
  .caminho{grid-template-columns:1fr;gap:22px}
  .caminho .btn{justify-self:stretch}
}

.contato-direto{
  margin-top:clamp(48px,6vw,72px);display:flex;align-items:center;gap:clamp(18px,3vw,34px);
  flex-wrap:wrap;padding:clamp(24px,3vw,34px);
}
.contato-direto .quem{position:relative;z-index:2}
.contato-direto .quem b{
  display:block;font-family:Archivo;font-weight:900;letter-spacing:-.02em;
  font-size:clamp(20px,2.4vw,27px);color:var(--txt);
}
.contato-direto .quem span{
  font-family:"IBM Plex Mono",monospace;font-size:10.5px;letter-spacing:.18em;
  text-transform:uppercase;color:var(--verde);
}
.contato-direto .numero{position:relative;z-index:2;margin-left:auto;display:flex;gap:14px;flex-wrap:wrap;align-items:center}
.fone-grande{
  font-family:Archivo;font-weight:900;letter-spacing:-.02em;
  font-size:clamp(22px,2.8vw,32px);color:var(--txt);text-decoration:none;
  display:inline-flex;align-items:center;gap:12px;transition:color .2s ease;
}
.fone-grande:hover{color:var(--verde)}
.fone-grande svg{width:22px;height:22px;color:var(--verde);flex:none}

/* ---------- formulário ---------- */
.form-bloco{
  margin-top:clamp(44px,5vw,70px);display:grid;
  grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr);
  gap:clamp(30px,5vw,64px);padding:clamp(28px,4vw,48px);
}
.form-bloco > div,.form-bloco form{position:relative;z-index:2}
@media(max-width:940px){.form-bloco{grid-template-columns:1fr;gap:34px}}
.form-bloco h3{font-size:clamp(23px,3vw,34px)}
.form-bloco .nota{margin-top:16px;color:var(--txt-3);font-size:17px;line-height:1.68}

form{display:grid;grid-template-columns:1fr 1fr;gap:20px}
.campo{display:flex;flex-direction:column;gap:9px}
.campo.inteiro{grid-column:1/-1}
.campo label{
  font-family:"IBM Plex Mono",monospace;font-size:10px;letter-spacing:.2em;
  text-transform:uppercase;color:var(--txt-4);
}
.campo input,.campo textarea{
  background:rgba(7,11,9,.7);border:1px solid var(--linha-2);border-radius:var(--r-p);
  color:var(--txt);padding:15px 17px;font-family:"IBM Plex Sans",sans-serif;font-size:16.5px;width:100%;
  transition:border-color .25s ease,box-shadow .25s ease;
}
.campo textarea{resize:vertical;min-height:96px;line-height:1.6}
.campo input:focus,.campo textarea:focus{
  border-color:var(--verde);outline:none;
  box-shadow:0 0 0 3px rgba(119,231,5,.12),0 0 22px rgba(119,231,5,.18);
}
.campo input::placeholder,.campo textarea::placeholder{color:var(--txt-4)}
.campo .erro{font-size:12.5px;color:var(--alerta);display:none}
.campo.invalido input,.campo.invalido textarea{border-color:var(--alerta);box-shadow:0 0 18px rgba(255,90,70,.18)}
.campo.invalido .erro{display:block}
.form-pe{grid-column:1/-1;display:flex;align-items:center;gap:20px;flex-wrap:wrap;margin-top:10px}
.form-pe .obs{font-size:13px;color:var(--txt-4);max-width:36ch;line-height:1.5}
.recebido{
  grid-column:1/-1;border-radius:var(--r-p);padding:20px 24px;
  background:rgba(119,231,5,.1);border:1px solid rgba(119,231,5,.35);
  box-shadow:0 0 30px rgba(119,231,5,.15);color:var(--txt);font-size:16px;display:none;
}
.recebido.on{display:block;animation:entrar .45s ease both}
@media(max-width:640px){form{grid-template-columns:1fr}}

/* ---------- marcação de vídeo ---------- */
.filme{
  margin-top:clamp(34px,4vw,50px);border:1px dashed var(--linha-2);border-radius:var(--r);
  padding:20px 24px;display:flex;align-items:center;gap:16px;background:rgba(18,24,21,.4);
}
.filme .tag{
  font-family:"IBM Plex Mono",monospace;font-size:10px;letter-spacing:.2em;
  text-transform:uppercase;color:var(--verde);flex:none;
}
.filme .txt{font-size:13.5px;color:var(--txt-4);line-height:1.55}

/* ============================================================
   RODAPÉ
   ============================================================ */
.rodape{border-top:1px solid var(--linha);padding:clamp(52px,6vw,80px) 0 34px;font-size:16px;color:var(--txt-3);position:relative}
.rodape-grade{display:grid;grid-template-columns:1.5fr 1fr 1fr;gap:44px}
.rodape .marca-pe img{width:180px;height:auto;filter:drop-shadow(0 0 24px rgba(119,231,5,.22))}
.rodape .lema{margin-top:20px;font-family:Archivo;font-weight:800;letter-spacing:-.025em;font-size:19px;color:var(--txt)}
.rodape h4{
  font-family:"IBM Plex Mono",monospace;font-weight:500;font-size:10px;
  letter-spacing:.2em;text-transform:uppercase;color:var(--txt-4);margin-bottom:18px;
}
.rodape ul{list-style:none;display:flex;flex-direction:column;gap:12px}
.rodape a{text-decoration:none;transition:color .2s ease}
.rodape a:hover{color:var(--verde)}
.rodape-fim{
  margin-top:clamp(44px,5vw,64px);padding-top:24px;border-top:1px solid var(--linha);
  display:flex;justify-content:space-between;gap:16px;flex-wrap:wrap;
  font-family:"IBM Plex Mono",monospace;font-size:10.5px;letter-spacing:.12em;color:var(--txt-4);
}
@media(max-width:760px){.rodape-grade{grid-template-columns:1fr;gap:34px}}

/* ---------- whatsapp flutuante ---------- */
.zap{
  position:fixed;right:clamp(16px,3vw,30px);bottom:clamp(16px,3vw,30px);z-index:80;
  display:inline-flex;align-items:center;justify-content:center;
  width:58px;height:58px;border-radius:var(--r-max);overflow:hidden;white-space:nowrap;
  color:#06210A;text-decoration:none;font-weight:600;font-size:14.5px;
  background:linear-gradient(180deg,var(--verde-luz),var(--verde) 50%,var(--verde-esc));
  box-shadow:inset 0 1px 0 rgba(255,255,255,.5),0 5px 0 #2C5D02,0 12px 28px rgba(0,0,0,.55);
  transition:width .32s cubic-bezier(.2,.7,.3,1),box-shadow .22s ease,transform .16s ease;
}
.zap svg{width:24px;height:24px;flex:none}
.zap .rotulo{max-width:0;opacity:0;transition:max-width .32s cubic-bezier(.2,.7,.3,1),opacity .22s ease,margin .32s ease}
.zap:hover,.zap:focus-visible{width:184px;transform:translateY(-2px)}
.zap:hover .rotulo,.zap:focus-visible .rotulo{max-width:124px;opacity:1;margin-left:11px}
.zap:active{transform:translateY(3px);box-shadow:inset 0 2px 8px rgba(0,0,0,.3),0 2px 0 #2C5D02}

/* ---------- revelação ---------- */
.rv{opacity:0;transform:translateY(22px);transition:opacity .8s ease,transform .8s cubic-bezier(.2,.7,.3,1)}
.rv.dentro{opacity:1;transform:none}
.rv.d1{transition-delay:.09s}
.rv.d2{transition-delay:.18s}

/* ============================================================
   TELAS PEQUENAS
   ============================================================ */
@media(max-width:940px){
  .topo .menu{display:none}
  .topo .btn-topo{display:none}
  .topo .leitura-topo{margin-left:auto}
  .topo .abre-menu{display:flex}
}
@media(max-width:640px){
  .avisos-lista{min-height:216px}
  .aviso{grid-template-columns:48px 1fr;gap:12px;padding:11px 17px}
  .avisos-topo,.avisos-pe{padding:14px 17px}
  .heroi .acoes .btn{width:100%}
  .contato-direto .numero{margin-left:0;width:100%}
}

@media(prefers-reduced-motion:reduce){
  *,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important;scroll-behavior:auto!important}
  .rv{opacity:1;transform:none}
  .ambiente,.trama,.varre{display:none}
}

/* ============================================================
   ECONOMIA: só anima o que está na tela
   ============================================================ */
.caixa::before,.caixa::after{animation-play-state:paused}
.caixa.viva::before,.caixa.viva::after{animation-play-state:running}
.ambiente i,.trama::before,.trama::after,.varre::before{animation-play-state:paused}
.palco.viva .ambiente i,
.palco.viva .trama::before,
.palco.viva .trama::after,
.palco.viva .varre::before{animation-play-state:running}

/* ============================================================
   QUEM ATENDE
   ============================================================ */
.atende{margin-top:clamp(44px,5vw,68px);padding-top:clamp(28px,3vw,38px);border-top:1px solid var(--linha)}
.atende-linha{
  display:grid;grid-template-columns:minmax(0,1fr) auto;
  gap:clamp(28px,5vw,64px);align-items:center;margin-top:26px;
}
.atende-nome{
  font-family:Archivo;font-weight:900;letter-spacing:-.03em;
  font-size:clamp(30px,4.2vw,50px);line-height:1;color:var(--txt);
}
.atende-cargo{
  margin-top:10px;font-family:"IBM Plex Mono",monospace;font-size:11px;
  letter-spacing:.22em;text-transform:uppercase;color:var(--verde);
}
.atende-texto{margin-top:20px;font-size:17px;color:var(--txt-2);max-width:44ch;line-height:1.65}
.atende-acoes{display:flex;flex-direction:column;gap:14px;align-items:stretch;min-width:270px}
.atende-fone{
  display:flex;flex-direction:column;gap:5px;text-decoration:none;
  padding:16px 24px;border-radius:var(--r);
  background:linear-gradient(168deg,var(--titanio-2),var(--carbono-2));
  border:1px solid var(--linha-2);
  transition:border-color .22s ease,transform .16s ease;
}
.atende-fone:hover{border-color:rgba(119,231,5,.45);transform:translateY(-2px)}
.atende-fone .rot{
  font-family:"IBM Plex Mono",monospace;font-size:10px;letter-spacing:.2em;
  text-transform:uppercase;color:var(--txt-4);
}
.atende-fone .num{
  font-family:Archivo;font-weight:900;letter-spacing:-.02em;
  font-size:clamp(22px,2.6vw,30px);color:var(--txt);transition:color .2s ease;
}
.atende-fone:hover .num{color:var(--verde)}
@media(max-width:860px){
  .atende-linha{grid-template-columns:1fr;gap:30px}
  .atende-acoes{min-width:0}
}

/* ============================================================
   CONVITE PARA O DIAGNÓSTICO
   ============================================================ */
.convite{display:flex;flex-direction:column;gap:22px}
.convite-passos{list-style:none;counter-reset:passo;display:grid;gap:2px}
.convite-passos li{
  counter-increment:passo;position:relative;padding:15px 0 15px 46px;
  font-size:17px;line-height:1.6;color:var(--txt-2);border-bottom:1px solid var(--linha);
}
.convite-passos li:last-child{border-bottom:0}
.convite-passos li::before{
  content:counter(passo);position:absolute;left:0;top:15px;
  width:28px;height:28px;border-radius:50%;
  display:flex;align-items:center;justify-content:center;
  font-family:"IBM Plex Mono",monospace;font-size:12px;font-weight:500;
  color:var(--verde);border:1px solid rgba(119,231,5,.35);
  background:rgba(119,231,5,.07);
}
.convite-outro{
  text-align:center;font-size:15px;color:var(--txt-3);text-decoration:none;
  padding:6px;transition:color .2s ease;
}
.convite-outro:hover{color:var(--verde)}

/* ---------- retrato de quem atende ---------- */
.atende-quem{display:flex;gap:clamp(20px,3vw,30px);align-items:flex-start}
.atende-foto{
  width:clamp(96px,11vw,132px);height:clamp(96px,11vw,132px);
  border-radius:50%;object-fit:cover;flex:none;
  border:2px solid rgba(119,231,5,.4);
  box-shadow:0 14px 34px rgba(0,0,0,.55);
}
@media(max-width:520px){
  .atende-quem{flex-direction:column;gap:18px}
}
.atende-dados{min-width:0}
.atende-nome{font-size:clamp(26px,3.4vw,42px)}

/* ============================================================
   CARTÃO DE QUEM ATENDE
   ============================================================ */
.atende-cartao{
  margin-top:26px;display:grid;
  grid-template-columns:minmax(0,300px) minmax(0,1fr);
  gap:clamp(26px,4vw,56px);align-items:center;
  padding:clamp(24px,3vw,36px);
}
.atende-retrato{position:relative;z-index:2}
.atende-retrato img{
  width:100%;height:auto;border-radius:var(--r);
  border:1px solid var(--linha-2);
  box-shadow:0 18px 44px rgba(0,0,0,.55);
}
.atende-id{margin-top:20px}
.atende-nome{
  font-family:Archivo;font-weight:900;letter-spacing:-.03em;line-height:1;
  font-size:clamp(24px,2.6vw,32px);color:var(--txt);
}
.atende-cargo{
  margin-top:9px;font-family:"IBM Plex Mono",monospace;font-size:10.5px;
  letter-spacing:.22em;text-transform:uppercase;color:var(--verde);
}
.atende-lado{position:relative;z-index:2;display:flex;flex-direction:column;gap:20px}
.atende-lado .atende-texto{
  margin:0;font-size:clamp(17px,1.6vw,20px);color:var(--txt-2);
  max-width:38ch;line-height:1.65;
}
.atende-lado .atende-fone{margin:0}
@media(max-width:820px){
  .atende-cartao{grid-template-columns:1fr;gap:28px}
  .atende-retrato img{max-width:280px}
}
.topo nav{flex:1;min-width:0}
.topo .marca{margin-right:clamp(8px,2vw,26px)}
