/* ============================================================
   SECRETIX — Design System
   "A luz que fica acesa."
   Grafite · Papel · Âmbar Vigília. 60/30/10.
   ============================================================ */

/* ---- Fontes ---------------------------------------------- */
@import url('https://api.fontshare.com/v2/css?f[]=clash-display@600,700&f[]=satoshi@400,500,700&display=swap');
@import url('https://fonts.googleapis.com/css2?family=JetBrains+Mono:wght@400;500&display=swap');

/* Fallback local do display (caso a CDN não carregue) */
@font-face{
  font-family:'Clash Local';
  font-weight:700;font-style:normal;font-display:swap;
  src:url('../assets/ClashDisplay-Bold.woff2') format('woff2');
}

/* ---- Tokens ---------------------------------------------- */
:root{
  /* Base */
  --grafite:#14161F;
  --grafite-elevado:#1E212C;
  --grafite-2:#272B38;
  --papel:#F7F5F1;
  --papel-2:#EFEBE3;
  --branco:#FFFFFF;

  /* Acento único */
  --ambar:#FFB224;
  --ambar-profundo:#D98A00;

  /* Apoio */
  --aco:#5A6472;
  --aco-claro:#8C93A0;
  --nevoa:#DDD9D2;
  --nevoa-escura:#3A3E4C;      /* borda sobre grafite */
  --verde:#1FA97A;
  --vermelho:#D93A3F;

  /* Tipografia */
  --display:'Clash Display','Clash Local','Space Grotesk',system-ui,sans-serif;
  --sans:'Satoshi','Inter',system-ui,sans-serif;
  --mono:'JetBrains Mono',ui-monospace,monospace;

  /* Layout */
  --wrap:1160px;
  --radius-s:8px;
  --radius:12px;
  --radius-l:16px;
  --radius-xl:24px;
  --shadow:0 24px 60px -24px rgba(20,22,31,.28);
  --shadow-soft:0 12px 32px -18px rgba(20,22,31,.35);
  --ease:cubic-bezier(.22,.61,.36,1);
}

/* ---- Reset ----------------------------------------------- */
*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
body{
  font-family:var(--sans);
  color:var(--grafite);
  background:var(--papel);
  line-height:1.6;
  font-size:16px;
  -webkit-font-smoothing:antialiased;
  text-rendering:optimizeLegibility;
  overflow-x:hidden;
}
img,svg{display:block;max-width:100%}
a{text-decoration:none;color:inherit}
button{font-family:inherit;cursor:pointer;border:none;background:none}
ul{list-style:none}
::selection{background:var(--ambar);color:var(--grafite)}

/* ---- Tipografia ------------------------------------------ */
h1,h2,h3,h4,.display{
  font-family:var(--display);
  font-weight:700;
  line-height:1.08;
  letter-spacing:-.02em;
  color:var(--grafite);
}
.mono{font-family:var(--mono);font-size:.82em;letter-spacing:.02em}
.wrap{max-width:var(--wrap);margin:0 auto;padding:0 24px}

/* ---- Ponto Aceso (assinatura de movimento) --------------- */
.ponto{
  display:inline-block;width:.62em;height:.62em;border-radius:50%;
  background:var(--ambar);
  box-shadow:0 0 0 3px rgba(255,178,36,.18);
  animation:respira 2.6s var(--ease) infinite;
  vertical-align:baseline;
}
@keyframes respira{
  0%,100%{opacity:1;box-shadow:0 0 0 3px rgba(255,178,36,.16)}
  50%{opacity:.72;box-shadow:0 0 0 6px rgba(255,178,36,.05)}
}

/* ---- Logo (imagem oficial) ------------------------------- */
.brand{display:inline-flex;align-items:center;gap:12px}
.logo-img{flex:none;height:23px;width:126px;display:block}
.site-footer .logo-img,.mobile-menu .logo-img{height:24px;width:132px}
.brand .niche{
  font-family:var(--mono);font-size:12px;font-weight:500;letter-spacing:.06em;
  color:var(--ambar-profundo);background:rgba(255,178,36,.12);
  padding:3px 9px;border-radius:999px;text-transform:lowercase;
}
.brand.on-dark .niche{color:var(--ambar);background:rgba(255,178,36,.14)}

/* ---- Botões ---------------------------------------------- */
.btn{
  display:inline-flex;align-items:center;justify-content:center;gap:9px;
  font-family:var(--sans);font-weight:700;font-size:15.5px;
  padding:14px 26px;border-radius:var(--radius);
  transition:transform .2s var(--ease),background .2s var(--ease),box-shadow .2s var(--ease),border-color .2s var(--ease),color .2s var(--ease);
  white-space:nowrap;
}
.btn svg{width:18px;height:18px}
.btn-amber{background:var(--ambar);color:var(--grafite);box-shadow:0 10px 26px -12px rgba(255,178,36,.7)}
.btn-amber:hover{background:var(--ambar-profundo);color:var(--papel);transform:translateY(-2px)}
.btn-solid{background:var(--grafite);color:var(--papel)}
.btn-solid:hover{background:var(--grafite-elevado);transform:translateY(-2px)}
.btn-ghost{background:transparent;color:var(--grafite);border:1.5px solid var(--nevoa)}
.btn-ghost:hover{border-color:var(--grafite);transform:translateY(-2px)}
.on-dark .btn-ghost,.btn-ghost.on-dark{color:var(--papel);border-color:var(--nevoa-escura)}
.on-dark .btn-ghost:hover,.btn-ghost.on-dark:hover{border-color:var(--papel)}
.btn-sm{padding:10px 18px;font-size:14.5px}

/* ---- Eyebrow / kicker ------------------------------------ */
.kicker{
  display:inline-flex;align-items:center;gap:8px;
  font-family:var(--mono);font-size:12.5px;font-weight:500;letter-spacing:.14em;
  text-transform:uppercase;color:var(--ambar-profundo);
  margin-bottom:18px;
}
.kicker::before{content:"";width:7px;height:7px;border-radius:50%;background:var(--ambar);box-shadow:0 0 0 3px rgba(255,178,36,.16)}
.on-dark .kicker,.kicker.on-dark{color:var(--ambar)}

/* ---- Header ---------------------------------------------- */
.site-header{
  position:sticky;top:0;z-index:100;
  background:rgba(247,245,241,.82);
  backdrop-filter:saturate(140%) blur(14px);
  border-bottom:1px solid transparent;
  transition:border-color .3s,background .3s;
}
.site-header.scrolled{border-bottom-color:var(--nevoa)}
.nav{display:flex;align-items:center;justify-content:space-between;height:76px;gap:24px}
.nav-links{display:flex;align-items:center;gap:30px}
.nav-links a{font-size:15px;font-weight:500;color:var(--aco);transition:color .2s}
.nav-links a:hover{color:var(--grafite)}
.nav-cta{display:flex;align-items:center;gap:12px}
.nav-toggle{display:none;width:44px;height:44px;border-radius:10px;align-items:center;justify-content:center;color:var(--grafite)}
.nav-toggle svg{width:24px;height:24px}

/* Dropdown de verticais */
.has-menu{position:relative}
.menu-trigger{display:inline-flex;align-items:center;gap:5px;font-size:15px;font-weight:500;color:var(--aco)}
.menu-trigger:hover{color:var(--grafite)}
.menu-trigger svg{width:15px;height:15px;transition:transform .25s}
.has-menu:hover .menu-trigger svg{transform:rotate(180deg)}
.dropdown{
  position:absolute;top:calc(100% + 10px);left:50%;transform:translateX(-50%) translateY(8px);
  background:var(--branco);border:1px solid var(--nevoa);border-radius:var(--radius-l);
  padding:8px;width:290px;box-shadow:var(--shadow);
  opacity:0;visibility:hidden;transition:.24s var(--ease);
}
.has-menu:hover .dropdown{opacity:1;visibility:visible;transform:translateX(-50%) translateY(0)}
.dropdown a{display:flex;gap:12px;align-items:flex-start;padding:12px;border-radius:10px;transition:background .18s}
.dropdown a:hover{background:var(--papel)}
.dropdown .di{flex:none;width:38px;height:38px;border-radius:10px;background:var(--papel);display:flex;align-items:center;justify-content:center;color:var(--grafite);border:1px solid var(--nevoa)}
.dropdown .di svg{width:19px;height:19px}
.dropdown strong{display:block;font-size:14.5px;color:var(--grafite);font-weight:700}
.dropdown small{font-size:12.5px;color:var(--aco)}

/* ---- Seções ---------------------------------------------- */
section{position:relative}
.sec{padding:104px 0}
.sec-tight{padding:76px 0}
.dark{background:var(--grafite);color:var(--papel)}
.dark h1,.dark h2,.dark h3,.dark h4{color:var(--papel)}
.dark .lead,.dark p{color:#B7BCC7}
.center{text-align:center}
.sec-head{max-width:660px;margin:0 auto 60px}
.sec-head.center{margin-inline:auto}
.sec-head h2{font-size:clamp(30px,4.4vw,44px);margin-bottom:16px}
.sec-head .lead{font-size:19px;color:var(--aco)}
.dark .sec-head .lead{color:#B7BCC7}
.lead{font-size:19px;line-height:1.62;color:var(--aco)}

/* ---- Hero ------------------------------------------------ */
.hero{position:relative;background:var(--grafite);color:var(--papel);overflow:hidden}
.hero-inner{
  position:relative;z-index:3;
  display:grid;grid-template-columns:1.02fr .98fr;gap:56px;align-items:center;
  min-height:clamp(560px,82vh,760px);padding:64px 0 80px;
}
.hero h1{font-size:clamp(38px,5.6vw,68px);color:var(--papel);margin-bottom:22px}
.hero h1 .hl{position:relative;color:var(--papel)}
.hero h1 .hl .ponto{width:.34em;height:.34em;margin-left:.04em;vertical-align:.14em}
.hero .lead{color:#C3C8D2;max-width:520px;margin-bottom:34px;font-size:clamp(17px,2.1vw,20px)}
.hero-cta{display:flex;gap:14px;flex-wrap:wrap;margin-bottom:26px}
.hero-note{display:flex;align-items:center;gap:9px;font-size:14px;color:#9AA0AD}
.hero-note svg{width:17px;height:17px;color:var(--verde)}
.hero-glow{position:absolute;inset:0;z-index:1;pointer-events:none;
  background:radial-gradient(680px 420px at 78% 8%,rgba(255,178,36,.13),transparent 60%),
             radial-gradient(600px 500px at 12% 100%,rgba(31,169,122,.06),transparent 55%);}

/* trust bar */
.trust{border-top:1px solid var(--nevoa-escura);position:relative;z-index:3}
.trust .wrap{display:flex;align-items:center;gap:14px 40px;flex-wrap:wrap;padding-top:26px;padding-bottom:26px}
.trust span{font-family:var(--mono);font-size:12.5px;letter-spacing:.08em;color:#8991a0;text-transform:uppercase}
.trust .pill{display:inline-flex;align-items:center;gap:8px;font-family:var(--sans);font-size:14px;color:#C3C8D2;font-weight:500;letter-spacing:0;text-transform:none}
.trust .pill svg{width:17px;height:17px;color:var(--ambar)}

/* =====================================================================
   CINEMA — hero: conversa de WhatsApp animada (rola para cima)
   ===================================================================== */
.cinema{position:relative;width:100%;aspect-ratio:5/6;max-width:440px;margin:0 auto;
  border-radius:var(--radius-xl);overflow:hidden;
  background:radial-gradient(130% 130% at 50% -10%,#1b1e29,#0e1017 72%);
  box-shadow:0 40px 90px -40px rgba(0,0,0,.7);border:1px solid var(--nevoa-escura);
}
.cine-badge{position:absolute;top:16px;left:16px;z-index:20;display:flex;align-items:center;gap:7px;
  font-family:var(--mono);font-size:10.5px;letter-spacing:.1em;text-transform:uppercase;color:#aeb4c0;
  background:rgba(20,22,31,.55);border:1px solid var(--nevoa-escura);border-radius:999px;padding:5px 11px;backdrop-filter:blur(4px)}
.cine-badge i{width:6px;height:6px;border-radius:50%;background:var(--ambar);animation:respira 2.6s infinite}

/* --- Telefone (centrado, cabe inteiro) --- */
.phone{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);
  height:94%;aspect-ratio:9/19;background:#05070c;border-radius:34px;padding:8px;
  box-shadow:0 30px 60px -22px rgba(0,0,0,.75);border:1px solid #2a2e3b;z-index:10}
.phone-screen{position:relative;width:100%;height:100%;background:#0c0e14;border-radius:27px;overflow:hidden;display:flex;flex-direction:column}
.wa-top{flex:none;background:#1f2530;color:#fff;padding:12px 14px 11px;display:flex;align-items:center;gap:9px;border-bottom:1px solid rgba(255,255,255,.05);z-index:2}
.wa-top .av{width:32px;height:32px;border-radius:50%;background:linear-gradient(145deg,#2a2f3d,#1a1e28);display:flex;align-items:center;justify-content:center;position:relative}
.wa-top .av .d{width:9px;height:9px;border-radius:50%;background:var(--ambar);box-shadow:0 0 0 2px #1f2530;position:absolute;bottom:0;right:0}
.wa-top b{font-size:13px;font-weight:600;display:block;line-height:1.2}
.wa-top s{font-family:var(--mono);font-size:9.5px;color:var(--ambar);text-decoration:none;letter-spacing:.04em}
.wa-body{flex:1;padding:14px 12px 16px;display:flex;flex-direction:column;gap:8px;justify-content:flex-start;
  overflow-y:auto;scroll-behavior:smooth;-ms-overflow-style:none;scrollbar-width:none;
  background:linear-gradient(180deg,#0c0e14,#0a0c11)}
.wa-body::-webkit-scrollbar{width:0;height:0;display:none}
.wa-day{flex:none;align-self:center;font-family:var(--mono);font-size:9px;color:#5a6472;background:rgba(255,255,255,.04);padding:3px 9px;border-radius:8px;margin-bottom:4px}
.msg{flex:none;max-width:82%;padding:8px 11px;font-size:12px;line-height:1.4;border-radius:13px;opacity:0;transform:translateY(9px) scale(.98);
  transition:opacity .4s var(--ease),transform .4s var(--ease)}
.msg.show{opacity:1;transform:none}
.msg.in{align-self:flex-start;background:#20242f;color:#e8eaef;border-bottom-left-radius:4px}
.msg.out{align-self:flex-end;background:#3a2f14;color:#ffe9c2;border-bottom-right-radius:4px;border:1px solid rgba(255,178,36,.22)}
.msg .t{display:block;font-family:var(--mono);font-size:8px;margin-top:3px;opacity:.5;text-align:right}
.typing{flex:none;align-self:flex-start;display:inline-flex;gap:3px;align-items:center;padding:10px 12px;background:#20242f;border-radius:13px;border-bottom-left-radius:4px}
.typing i{width:5px;height:5px;border-radius:50%;background:#8991a0;animation:blink 1.2s infinite}
.typing i:nth-child(2){animation-delay:.2s}.typing i:nth-child(3){animation-delay:.4s}
@keyframes blink{0%,60%,100%{opacity:.3;transform:translateY(0)}30%{opacity:1;transform:translateY(-3px)}}

/* --- Camada de "IA interpretando" (varredura âmbar + intenção extraída) --- */
.analysis{position:absolute;left:0;right:0;top:55px;bottom:0;z-index:14;opacity:0;visibility:hidden;
  transition:opacity .4s ease,visibility .4s;background:rgba(10,12,18,.52)}
.analysis.on{opacity:1;visibility:visible}
.scanline{position:absolute;left:0;right:0;top:0;height:30%;
  background:linear-gradient(180deg,transparent,rgba(255,178,36,.14) 70%,transparent);
  border-bottom:1px solid rgba(255,178,36,.6);box-shadow:0 0 18px rgba(255,178,36,.22)}
.a-label{position:absolute;top:16px;left:0;right:0;display:flex;align-items:center;justify-content:center;gap:6px;
  font-family:var(--mono);font-size:9.5px;letter-spacing:.16em;text-transform:uppercase;color:var(--ambar)}
.a-label .dot{width:5px;height:5px;border-radius:50%;background:var(--ambar);animation:respira 1.4s infinite}
.chips{position:absolute;left:16px;right:16px;top:50%;transform:translateY(-50%);display:flex;flex-wrap:wrap;gap:6px;justify-content:center}
.chip{font-family:var(--mono);font-size:10px;color:var(--grafite);background:var(--ambar);
  padding:4px 10px;border-radius:8px;opacity:0;transform:translateY(8px) scale(.9);
  box-shadow:0 8px 18px -6px rgba(255,178,36,.55);white-space:nowrap;
  transition:opacity .3s var(--ease),transform .3s var(--ease)}
.chip.show{opacity:1;transform:none}
.chip b{font-weight:700}

/* progresso do ciclo (fininho, embaixo) */
.cine-track{position:absolute;left:0;bottom:0;height:2px;width:100%;background:rgba(255,255,255,.06);z-index:25}
.cine-fill{height:100%;width:0;background:var(--ambar);box-shadow:0 0 8px rgba(255,178,36,.6)}
.cine-replay{position:absolute;right:16px;top:16px;z-index:22;width:30px;height:30px;border-radius:50%;
  background:rgba(20,22,31,.55);border:1px solid var(--nevoa-escura);display:flex;align-items:center;justify-content:center;
  color:#aeb4c0;cursor:pointer;backdrop-filter:blur(4px);opacity:.55;transition:opacity .2s}
.cine-replay:hover{opacity:1}
.cine-replay svg{width:15px;height:15px}

/* ---- Cards genéricos ------------------------------------- */
.grid{display:grid;gap:22px}
.g-3{grid-template-columns:repeat(3,1fr)}
.g-2{grid-template-columns:repeat(2,1fr)}
.g-4{grid-template-columns:repeat(4,1fr)}
.card{background:var(--branco);border:1px solid var(--nevoa);border-radius:var(--radius-l);padding:30px;transition:transform .3s var(--ease),box-shadow .3s var(--ease),border-color .3s}
.card:hover{transform:translateY(-4px);box-shadow:var(--shadow-soft);border-color:#cdc8bf}
.dark .card{background:var(--grafite-elevado);border-color:var(--nevoa-escura)}
.dark .card:hover{border-color:#454a5a}
.ico{width:46px;height:46px;border-radius:12px;display:flex;align-items:center;justify-content:center;
  background:var(--papel);border:1px solid var(--nevoa);color:var(--grafite);margin-bottom:20px}
.ico svg{width:22px;height:22px;stroke-width:1.6}
.dark .ico{background:var(--grafite-2);border-color:var(--nevoa-escura);color:var(--papel)}
.ico.amber{background:rgba(255,178,36,.12);border-color:rgba(255,178,36,.28);color:var(--ambar-profundo)}
.dark .ico.amber{color:var(--ambar)}
.card h3{font-size:20px;margin-bottom:9px}
.card p{color:var(--aco);font-size:15.5px}
.dark .card p{color:#B7BCC7}

/* ---- Manifesto ------------------------------------------- */
.manifesto{padding:120px 0}
.manifesto .wrap{max-width:900px}
.manifesto p{font-family:var(--display);font-weight:600;font-size:clamp(26px,3.8vw,40px);line-height:1.24;letter-spacing:-.02em;color:var(--papel)}
.manifesto .dim{color:#6b7280}
.manifesto .amb{color:var(--ambar)}
.manifesto .sig{margin-top:36px;font-family:var(--mono);font-size:14px;letter-spacing:.12em;text-transform:uppercase;color:var(--ambar)}

/* ---- Passos (como funciona) ------------------------------ */
.steps{counter-reset:step;display:grid;grid-template-columns:repeat(3,1fr);gap:26px}
.step{position:relative;padding:34px 30px;background:var(--branco);border:1px solid var(--nevoa);border-radius:var(--radius-l)}
.dark .step{background:var(--grafite-elevado);border-color:var(--nevoa-escura)}
.step .num{font-family:var(--mono);font-size:13px;color:var(--ambar-profundo);letter-spacing:.1em}
.dark .step .num{color:var(--ambar)}
.step h3{font-size:21px;margin:14px 0 10px}
.step p{color:var(--aco);font-size:15.5px}
.dark .step p{color:#B7BCC7}
.step .line{position:absolute;top:50px;right:-13px;width:26px;height:1px;background:var(--nevoa);z-index:2}
.dark .step .line{background:var(--nevoa-escura)}
.step:last-child .line{display:none}

/* ---- Split (imagem/texto) -------------------------------- */
.split{display:grid;grid-template-columns:1fr 1fr;gap:60px;align-items:center}
.split.rev .split-media{order:2}
.feature-list{margin-top:26px;display:flex;flex-direction:column;gap:18px}
.feature-list li{display:flex;gap:14px;align-items:flex-start}
.feature-list .fi{flex:none;width:30px;height:30px;border-radius:9px;background:rgba(255,178,36,.12);border:1px solid rgba(255,178,36,.28);display:flex;align-items:center;justify-content:center;color:var(--ambar-profundo)}
.feature-list .fi svg{width:16px;height:16px;stroke-width:2}
.feature-list b{display:block;font-size:16px;color:var(--grafite);font-weight:700}
.dark .feature-list b{color:var(--papel)}
.feature-list p{font-size:14.5px;color:var(--aco);margin-top:2px}
.dark .feature-list p{color:#B7BCC7}

/* mini painel / mockup genérico */
.panel{background:var(--branco);border:1px solid var(--nevoa);border-radius:var(--radius-l);box-shadow:var(--shadow-soft);overflow:hidden}
.panel-top{display:flex;align-items:center;gap:8px;padding:14px 16px;border-bottom:1px solid var(--nevoa);background:var(--papel)}
.panel-top i{width:11px;height:11px;border-radius:50%;background:var(--nevoa)}
.panel-top i:nth-child(1){background:#e6b3b3}.panel-top i:nth-child(2){background:#e6d3a0}.panel-top i:nth-child(3){background:#b3d9c4}
.panel-top span{margin-left:8px;font-family:var(--mono);font-size:11px;color:var(--aco)}
.panel-body{padding:18px}
.row{display:flex;align-items:center;gap:12px;padding:12px 14px;border:1px solid var(--nevoa);border-radius:10px;margin-bottom:10px;background:var(--papel)}
.row:last-child{margin-bottom:0}
.row .av{flex:none;width:34px;height:34px;border-radius:9px;background:var(--grafite);color:var(--papel);display:flex;align-items:center;justify-content:center;font-family:var(--display);font-weight:700;font-size:14px}
.row .info{flex:1;min-width:0}
.row .info b{font-size:14px;display:block}
.row .info small{font-size:12px;color:var(--aco)}
.row .st{font-family:var(--mono);font-size:10.5px;padding:4px 8px;border-radius:7px;white-space:nowrap}
.st.ok{background:rgba(31,169,122,.12);color:var(--verde)}
.st.wait{background:rgba(255,178,36,.14);color:var(--ambar-profundo)}

/* ---- Números / prova ------------------------------------- */
.stats{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}
.stat{text-align:center;padding:20px}
.stat .big{font-family:var(--display);font-weight:700;font-size:clamp(38px,5vw,54px);letter-spacing:-.03em;color:var(--grafite)}
.dark .stat .big{color:var(--papel)}
.stat .big .u{color:var(--ambar)}
.stat p{margin-top:6px;font-size:15px;color:var(--aco)}
.dark .stat p{color:#B7BCC7}

/* ---- Verticais (home) ------------------------------------ */
.verticals{display:grid;grid-template-columns:repeat(3,1fr);gap:22px}
.vert{position:relative;display:block;background:var(--branco);border:1px solid var(--nevoa);border-radius:var(--radius-l);padding:32px 30px 30px;overflow:hidden;transition:transform .3s var(--ease),box-shadow .3s var(--ease),border-color .3s}
.vert:hover{transform:translateY(-5px);box-shadow:var(--shadow);border-color:#cdc8bf}
.vert .vi{width:52px;height:52px;border-radius:14px;display:flex;align-items:center;justify-content:center;background:var(--grafite);color:var(--papel);margin-bottom:22px}
.vert .vi svg{width:26px;height:26px;stroke-width:1.5}
.vert h3{font-size:23px;margin-bottom:8px}
.vert p{color:var(--aco);font-size:15.5px;margin-bottom:20px}
.vert .go{display:inline-flex;align-items:center;gap:8px;font-weight:700;font-size:15px;color:var(--grafite)}
.vert .go svg{width:17px;height:17px;transition:transform .25s}
.vert:hover .go svg{transform:translateX(4px)}
.vert .go .arw{color:var(--ambar-profundo)}
.vert::after{content:"";position:absolute;inset:0;border-radius:inherit;border:1.5px solid transparent;transition:border-color .3s;pointer-events:none}
.vert:hover::after{border-color:rgba(255,178,36,.4)}

/* ---- Faixa CTA ------------------------------------------- */
.cta-band{position:relative;background:var(--grafite);border-radius:var(--radius-xl);padding:72px 56px;text-align:center;overflow:hidden}
.cta-band::before{content:"";position:absolute;inset:0;background:radial-gradient(600px 300px at 50% -20%,rgba(255,178,36,.16),transparent 60%);pointer-events:none}
.cta-band>*{position:relative}
.cta-band h2{color:var(--papel);font-size:clamp(28px,4vw,42px);margin-bottom:16px}
.cta-band p{color:#B7BCC7;font-size:19px;max-width:560px;margin:0 auto 30px}

/* ---- FAQ ------------------------------------------------- */
.faq{max-width:760px;margin:0 auto}
.faq-item{border-bottom:1px solid var(--nevoa)}
.faq-q{width:100%;display:flex;align-items:center;justify-content:space-between;gap:16px;
  padding:24px 0;text-align:left;font-family:var(--display);font-weight:600;font-size:19px;color:var(--grafite)}
.faq-q .pm{flex:none;width:28px;height:28px;border-radius:8px;border:1px solid var(--nevoa);display:flex;align-items:center;justify-content:center;transition:.25s;color:var(--aco)}
.faq-q .pm svg{width:16px;height:16px;transition:transform .3s}
.faq-item.open .pm{background:var(--ambar);border-color:var(--ambar);color:var(--grafite)}
.faq-item.open .pm svg{transform:rotate(45deg)}
.faq-a{max-height:0;overflow:hidden;transition:max-height .35s var(--ease)}
.faq-a p{padding:0 0 24px;color:var(--aco);font-size:16px;max-width:660px}

/* ---- Nota / ética ---------------------------------------- */
.note{display:flex;gap:16px;align-items:flex-start;background:var(--branco);border:1px solid var(--nevoa);border-left:3px solid var(--ambar);border-radius:var(--radius);padding:22px 24px}
.note .ni{flex:none;width:38px;height:38px;border-radius:10px;background:rgba(255,178,36,.12);display:flex;align-items:center;justify-content:center;color:var(--ambar-profundo)}
.note .ni svg{width:20px;height:20px}
.note p{font-size:15px;color:var(--aco)}
.note b{color:var(--grafite)}
.dark .note{background:var(--grafite-elevado);border-color:var(--nevoa-escura);border-left-color:var(--ambar)}
.dark .note p{color:#B7BCC7}.dark .note b{color:var(--papel)}

/* ---- Footer ---------------------------------------------- */
.site-footer{background:var(--grafite);color:#9AA0AD;padding:72px 0 36px}
.foot-grid{display:grid;grid-template-columns:1.4fr 1fr 1fr 1fr;gap:40px}
.foot-brand p{margin-top:16px;font-size:14.5px;color:#9AA0AD;max-width:280px}
.foot-col h4{font-family:var(--mono);font-size:12px;letter-spacing:.1em;text-transform:uppercase;color:#6b7280;margin-bottom:16px;font-weight:500}
.foot-col a{display:block;font-size:14.5px;color:#B7BCC7;padding:6px 0;transition:color .2s}
.foot-col a:hover{color:var(--papel)}
.foot-bottom{margin-top:52px;padding-top:26px;border-top:1px solid var(--nevoa-escura);display:flex;justify-content:space-between;gap:16px;flex-wrap:wrap;font-size:13px;color:#6b7280}
.foot-bottom .mono{font-family:var(--mono)}

/* ---- Reveal on scroll ------------------------------------ */
.reveal{opacity:0;transform:translateY(22px);transition:opacity .7s var(--ease),transform .7s var(--ease)}
.reveal.in{opacity:1;transform:none}
.reveal[data-d="1"]{transition-delay:.08s}
.reveal[data-d="2"]{transition-delay:.16s}
.reveal[data-d="3"]{transition-delay:.24s}

/* ---- Mobile menu ----------------------------------------- */
.mobile-menu{position:fixed;inset:0;z-index:200;background:var(--grafite);color:var(--papel);
  padding:24px;display:flex;flex-direction:column;transform:translateX(100%);transition:transform .34s var(--ease);visibility:hidden}
.mobile-menu.open{transform:none!important;visibility:visible!important}
.mm-top{display:flex;align-items:center;justify-content:space-between;height:52px}
.mm-close{width:44px;height:44px;color:var(--papel);display:flex;align-items:center;justify-content:center}
.mm-close svg{width:26px;height:26px}
.mm-links{margin-top:30px;display:flex;flex-direction:column;gap:4px}
.mm-links a{font-family:var(--display);font-weight:600;font-size:26px;color:var(--papel);padding:12px 0;border-bottom:1px solid var(--nevoa-escura)}
.mm-links a small{display:block;font-family:var(--mono);font-size:12px;color:var(--ambar);font-weight:400;letter-spacing:.05em}
.mm-cta{margin-top:auto;display:flex;flex-direction:column;gap:12px;padding-top:24px}

/* ============================================================
   Responsivo
   ============================================================ */
@media(max-width:980px){
  .hero-inner{grid-template-columns:1fr;gap:40px;text-align:center;min-height:0;padding-top:48px}
  .hero .lead{margin-inline:auto}
  .hero-cta,.hero-note{justify-content:center}
  .cinema{margin-top:8px}
  .split{grid-template-columns:1fr;gap:40px}
  .split.rev .split-media{order:0}
  .g-4{grid-template-columns:repeat(2,1fr)}
}
@media(max-width:820px){
  .nav-links,.nav-cta .btn{display:none}
  .nav-toggle{display:flex}
  .sec{padding:72px 0}
  .manifesto{padding:80px 0}
  .g-3,.g-2,.verticals,.steps,.stats{grid-template-columns:1fr}
  .step .line{display:none}
  .foot-grid{grid-template-columns:1fr 1fr;gap:32px}
  .foot-brand{grid-column:1/-1}
  .cta-band{padding:52px 26px}
  .trust .wrap{gap:12px 24px}
}
@media(max-width:520px){
  .wrap{padding:0 20px}
  .g-4{grid-template-columns:1fr}
  .foot-grid{grid-template-columns:1fr}
  .btn{width:100%}
  .nav-cta{display:none}
}

/* ---- Movimento reduzido ---------------------------------- */
@media(prefers-reduced-motion:reduce){
  *{animation-duration:.001ms!important;animation-iteration-count:1!important;transition-duration:.001ms!important;scroll-behavior:auto!important}
  .reveal{opacity:1;transform:none}
}