/* ==========================================================================
   UTM Labs — Landing "alto valor" (28/09/2026)
   Vem DEPOIS do landing.css: só acrescenta e sobrescreve o visual.
   ========================================================================== */
:root{ --lp-ease:cubic-bezier(.2,.7,.2,1); }
body{ background:#000; }
.gradient-text{ background:linear-gradient(95deg,#37F5B4 0%,#12E29A 45%,#9BFFDA 100%); -webkit-background-clip:text; background-clip:text; color:transparent; }
h1,h2{ letter-spacing:-.04em; }
.section-head h2{ font-size:clamp(2rem,4.2vw,3.4rem); line-height:1.04; }
.pill{ letter-spacing:.14em; text-transform:uppercase; font-size:.68rem; font-weight:800; }

/* ------------------------------ ÍCONES ----------------------------------- */
.ic{ width:18px; height:18px; flex:none; fill:none; stroke:currentColor; stroke-width:2; stroke-linecap:round; stroke-linejoin:round; }

/* ------------------------------- HERO ------------------------------------ */
.hero.hero-pro{ padding:140px 0 90px; overflow:hidden; isolation:isolate; min-height:min(100vh,960px); display:flex; align-items:center; }
.hero-bg{ position:absolute; inset:0; z-index:-1; }
.hero-bg img{ position:absolute; inset:0; width:100%; height:100%; object-fit:cover; object-position:70% 30%; opacity:.42; transform:scale(1.04); animation:heroZoom 22s ease-in-out infinite alternate; }
.hero-bg::after{ content:""; position:absolute; inset:0;
  background:
    linear-gradient(90deg,#000 0%,rgba(0,0,0,.92) 32%,rgba(0,0,0,.55) 62%,rgba(0,0,0,.8) 100%),
    linear-gradient(0deg,#000 0%,transparent 30%,transparent 80%,rgba(0,0,0,.7) 100%); }
@keyframes heroZoom{ to{ transform:scale(1.12) translateX(-1.5%); } }
.hero-pro h1{ font-size:clamp(2.4rem,4.3vw,3.9rem); line-height:1.02; letter-spacing:-.045em; }
.hero-pro .vsl{ box-shadow:0 50px 120px -30px rgba(18,226,154,.35), 0 0 0 1px rgba(18,226,154,.25); border-radius:24px; }
.float-badge{ font-size:.8rem; padding:12px 16px; border-radius:16px; background:rgba(4,10,8,.82); backdrop-filter:blur(14px); }
.float-badge .fb-ic{ width:32px; height:32px; border-radius:10px; display:grid; place-items:center; background:rgba(18,226,154,.14); border:1px solid rgba(18,226,154,.4); color:var(--green-2); }
.float-badge .fb-ic .ic{ width:16px; height:16px; }
.float-badge .fb-txt{ display:flex; flex-direction:column; line-height:1.25; }
.float-badge .fb-txt small{ color:var(--text-3); font-weight:500; font-size:.7rem; }
.hero-trust{ display:flex; align-items:center; gap:14px; margin-top:34px; padding-top:26px; border-top:1px solid var(--stroke); max-width:520px; }
.hero-trust .av{ display:flex; }
.hero-trust .av img{ width:38px; height:38px; border-radius:50%; object-fit:cover; border:2px solid #000; margin-left:-10px; }
.hero-trust .av img:first-child{ margin-left:0; }
.hero-trust p{ margin:0; font-size:.86rem; color:var(--text-2); }
.hero-trust b{ color:var(--text); }

/* ------------------------- FAIXA DE LOGOS -------------------------------- */
.logos{ padding:34px 0; border-block:1px solid var(--stroke); background:#020403; }
.logos p{ text-align:center; font-size:.7rem; letter-spacing:.24em; text-transform:uppercase; font-weight:700; color:var(--text-3); margin-bottom:18px; }
.logos-mask{ overflow:hidden; mask-image:linear-gradient(90deg,transparent,#000 10%,#000 90%,transparent); -webkit-mask-image:linear-gradient(90deg,transparent,#000 10%,#000 90%,transparent); }
.logos-track{ flex-wrap:nowrap !important; width:max-content; animation:logosRun 38s linear infinite; justify-content:flex-start !important; }
.logos-mask:hover .logos-track{ animation-play-state:paused; }
@keyframes logosRun{ to{ transform:translateX(-50%); } }
.logo-chip{ white-space:nowrap; }

/* ---------------------------- FOTOS -------------------------------------- */
.ph{ position:relative; border-radius:26px; overflow:hidden; border:1px solid var(--stroke); background:#040a08; isolation:isolate; }
.ph > img{ width:100%; height:100%; object-fit:cover; display:block; transition:transform 1.4s var(--lp-ease); }
.ph:hover > img{ transform:scale(1.045); }
.ph::after{ content:""; position:absolute; inset:0; pointer-events:none; border-radius:inherit; box-shadow:inset 0 0 0 1px rgba(255,255,255,.04); }

/* ---------------------- BANNER LABORATÓRIO ------------------------------- */
.lab{ min-height:560px; display:flex; align-items:center; }
.lab > img{ position:absolute; inset:0; }
.lab::before{ content:""; position:absolute; inset:0; z-index:1; background:linear-gradient(90deg,rgba(0,0,0,.94) 0%,rgba(0,0,0,.78) 40%,rgba(0,0,0,.1) 75%); }
.lab-in{ position:relative; z-index:2; padding:clamp(34px,6vw,72px); max-width:620px; }
.lab-in h2{ font-size:clamp(2rem,4.4vw,3.6rem); line-height:1.03; }
.lab-kpis{ display:grid; grid-template-columns:repeat(3,1fr); gap:12px; margin-top:28px; }
.lab-kpi{ padding:16px; border-radius:16px; border:1px solid rgba(18,226,154,.22); background:rgba(4,16,12,.6); backdrop-filter:blur(10px); }
.lab-kpi b{ display:block; font-family:var(--font-display); font-size:1.05rem; color:var(--green-2); }
.lab-kpi span{ font-size:.78rem; color:var(--text-2); }

/* ---------------------- ATRIBUIÇÃO (split) ------------------------------- */
.split{ display:grid; gap:clamp(30px,5vw,70px); align-items:center; }
@media(min-width:960px){ .split{ grid-template-columns:1.1fr 1fr; } .split.inv > :first-child{ order:2; } }
.split h2{ font-size:clamp(2rem,4vw,3.2rem); line-height:1.05; }
.trilha{ display:flex; flex-direction:column; gap:0; margin-top:26px; position:relative; }
.trilha::before{ content:""; position:absolute; left:21px; top:22px; bottom:22px; width:2px; background:linear-gradient(#12E29A,rgba(18,226,154,.1)); }
.trilha-item{ display:flex; gap:16px; align-items:flex-start; padding:12px 0; position:relative; }
.trilha-num{ flex:none; width:44px; height:44px; border-radius:14px; display:grid; place-items:center; background:#04120d; border:1px solid rgba(18,226,154,.4); color:var(--green-2); box-shadow:0 0 22px rgba(18,226,154,.18); }
.trilha-item h4{ margin:2px 0 4px; font-size:1.02rem; }
.trilha-item p{ margin:0; font-size:.92rem; }
.checks{ list-style:none; padding:0; margin:22px 0 0; display:flex; flex-direction:column; gap:12px; }
.checks li{ display:flex; gap:12px; align-items:flex-start; color:var(--text-2); }
.checks li i{ flex:none; width:22px; height:22px; border-radius:50%; display:grid; place-items:center; background:rgba(18,226,154,.12); border:1px solid rgba(18,226,154,.35); color:var(--green-2); margin-top:1px; }
.checks li i .ic{ width:12px; height:12px; stroke-width:3; }

/* --------------------------- RECURSOS ------------------------------------ */
.feature{ background:linear-gradient(160deg,#07110d,#020504); border-radius:22px; position:relative; overflow:hidden; }
.feature::before{ content:""; position:absolute; inset:0; border-radius:inherit; padding:1px; pointer-events:none;
  background:linear-gradient(140deg,rgba(18,226,154,.45),transparent 35%,transparent 65%,rgba(18,226,154,.15));
  -webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0); -webkit-mask-composite:xor; mask-composite:exclude; opacity:.5; transition:opacity .4s; }
.feature:hover::before{ opacity:1; }
.feature::after{ content:""; position:absolute; width:220px; height:220px; right:-90px; top:-90px; border-radius:50%; background:rgba(18,226,154,.10); filter:blur(60px); pointer-events:none; }

/* ------------------------ WAR ROOM (números) ----------------------------- */
.war{ min-height:520px; display:flex; flex-direction:column; justify-content:flex-end; }
.war > img{ position:absolute; inset:0; }
.war::before{ content:""; position:absolute; inset:0; z-index:1; background:linear-gradient(0deg,#000 0%,rgba(0,0,0,.72) 45%,rgba(0,0,0,.25) 100%); }
.war-in{ position:relative; z-index:2; padding:clamp(28px,5vw,56px); }
.war-in h2{ font-size:clamp(2rem,4.2vw,3.4rem); line-height:1.04; max-width:18ch; }
.war .stats{ margin-top:26px; }
.war .stat{ background:rgba(4,12,9,.62); backdrop-filter:blur(12px); border-color:rgba(18,226,154,.2); }

/* ------------------------ PARA QUEM É ------------------------------------ */
.publico{ display:grid; gap:16px; grid-template-columns:repeat(4,1fr); }
@media(max-width:1000px){ .publico{ grid-template-columns:repeat(2,1fr); } }
@media(max-width:520px){ .publico{ grid-template-columns:1fr 1fr; gap:10px; } }
.publico .ph{ aspect-ratio:4/5; }
.publico .ph::before{ content:""; position:absolute; inset:0; z-index:1; background:linear-gradient(0deg,rgba(0,0,0,.92) 0%,rgba(0,0,0,.2) 50%,transparent 70%); }
.publico .cap{ position:absolute; left:0; right:0; bottom:0; z-index:2; padding:clamp(14px,2vw,22px); }
.publico .cap small{ display:block; font-size:.66rem; letter-spacing:.2em; text-transform:uppercase; font-weight:800; color:var(--green-2); margin-bottom:6px; }
.publico .cap b{ display:block; font-family:var(--font-display); font-size:clamp(.95rem,1.4vw,1.15rem); line-height:1.25; }

/* --------------------------- PASSOS -------------------------------------- */
.steps-pro{ display:grid; gap:14px; }
.steps-pro .step{ padding:22px 24px 22px 84px; border-radius:20px; background:linear-gradient(160deg,#07110d,#020504); }
.steps-pro .step::before{ position:absolute; left:22px; top:22px; margin:0; }

/* ------------------------- PREÇOS / FAQ / CTA ---------------------------- */
.plan{ border-radius:26px; background:linear-gradient(170deg,#07110d,#020504); }
.plan.featured{ background:linear-gradient(170deg,rgba(18,226,154,.13),#030806 45%); box-shadow:0 40px 100px -30px rgba(18,226,154,.4); }
.pricing-note{ display:flex; align-items:center; justify-content:center; gap:8px; }
.pricing-note .ic{ color:var(--green-2); width:16px; height:16px; }
.cta-pro{ min-height:480px; display:flex; align-items:center; justify-content:center; text-align:center; }
.cta-pro > img{ position:absolute; inset:0; }
.cta-pro::before{ content:""; position:absolute; inset:0; z-index:1; background:radial-gradient(60% 80% at 50% 50%,rgba(3,20,14,.55),rgba(0,0,0,.9)); }
.cta-pro .cta-in{ position:relative; z-index:2; padding:clamp(36px,6vw,70px) 24px; max-width:760px; }
.cta-pro h2{ font-size:clamp(2rem,4.4vw,3.5rem); line-height:1.04; }
.site-footer{ background:#000; margin-top:0; }

/* --------------------------- ENTRADA ------------------------------------- */
@media (prefers-reduced-motion: reduce){ .hero-bg img, .logos-track{ animation:none; } .reveal{ opacity:1; transform:none; transition:none; } }
@media(max-width:700px){
  .hero.hero-pro{ min-height:0; padding:120px 0 60px; }
  .hero-bg img{ opacity:.3; object-position:65% 20%; }
  .lab{ min-height:0; } .lab::before{ background:linear-gradient(0deg,rgba(0,0,0,.95) 30%,rgba(0,0,0,.55)); }
  .lab-kpis{ grid-template-columns:1fr; }
  .war{ min-height:0; }
  .ph{ border-radius:20px; }
}
.steps.steps-pro{ grid-template-columns:1fr; margin-top:22px; }
.war .stat b{ font-size:clamp(1.5rem,2.4vw,2.1rem); white-space:nowrap; }

/* ======================= RESPONSIVO (28/09) ======================= */
/* foto do topo sem zoom (zoom deixa a foto menos nítida) */
.hero-bg img{ transform:none !important; animation:none !important; }
.nav-entrar{ display:none; }
@media(max-width:900px){
  .nav .nav-entrar{ display:block; color:var(--green-2) !important; font-weight:700; }
  .nav{ box-shadow:0 30px 60px rgba(0,0,0,.7); }
}
@media(max-width:560px){
  /* cabeçalho: logo numa linha só, botão compacto, menu sempre visível */
  .header-inner{ gap:10px; height:66px; }
  .logo{ white-space:nowrap; font-size:1.05rem; gap:8px; }
  .logo-mark{ width:32px; height:32px; }
  .header-actions{ gap:8px; }
  .header-actions .btn-primary{ padding:.62em .95em; font-size:.8rem; white-space:nowrap; }
  .burger{ flex:none; width:40px; height:40px; }
  .nav{ inset:66px 0 auto; }
  /* topo */
  .hero.hero-pro{ padding:100px 0 50px; }
  .hero-cta{ flex-direction:column; align-items:stretch; }
  .hero-cta .btn{ width:100%; justify-content:center; }
  .hero-note{ gap:10px 16px; }
  .hero-trust{ margin-top:26px; padding-top:20px; }
  .hero-trust .av img{ width:32px; height:32px; }
  /* painel de exemplo: 2 números por linha */
  .mock-body{ padding:12px; }
  .mock-kpis{ grid-template-columns:1fr 1fr; gap:8px; }
  .mock-kpi b{ font-size:1rem; white-space:nowrap; }
  .mock-url{ font-size:.62rem; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; max-width:70%; }
  .mock-row{ flex-wrap:wrap; gap:4px 8px; }
  .mock-row b{ margin-left:0; }
  /* central de comando: 2 números por linha */
  .war .stats{ grid-template-columns:1fr 1fr; gap:10px; }
  .war .stat{ padding:18px 10px; }
  .war .stat b{ font-size:1.35rem; }
  .war .stat span{ font-size:.74rem; }
  /* laboratório */
  .lab-in{ padding:26px 20px; }
  /* para quem é: legenda legível */
  .publico .cap b{ font-size:.86rem; }
  .section-head h2{ font-size:clamp(1.7rem,7.5vw,2.2rem); }
  /* planos e rodapé */
  .plan{ padding:26px 20px; }
  .footer-grid{ grid-template-columns:1fr 1fr; gap:26px; }
  .footer-grid > div:first-child{ grid-column:1 / -1; }
}
@media(max-width:380px){
  .header-actions .btn-primary{ padding:.6em .8em; font-size:.74rem; }
  .logo{ font-size:.98rem; }
}
/* preenchimento automático do Chrome não pinta os campos de claro */
input:-webkit-autofill, input:-webkit-autofill:hover, input:-webkit-autofill:focus, input:-webkit-autofill:active{
  -webkit-text-fill-color:#EAF6F1 !important; caret-color:#EAF6F1;
  -webkit-box-shadow:0 0 0 1000px #050a08 inset !important; transition:background-color 99999s ease-in-out 0s;
}