:root{
  --bg:#050505;
  --green:#39FF88;
  --green-2:#19C96B;
  --white:#F5F5F5;
  --gray:#A1A1AA;
  --gray-dark:#18181B;
  --border:rgba(245,245,245,0.09);
  --border-strong:rgba(245,245,245,0.16);
  --green-border:rgba(57,255,136,0.35);
  --shadow-lg:0 40px 90px -30px rgba(0,0,0,0.7);
  --ease:cubic-bezier(.16,.8,.2,1);
  --font-display:'Space Grotesk',ui-sans-serif,sans-serif;
  --font-body:'Inter',ui-sans-serif,sans-serif;
  --font-marker:'Permanent Marker',cursive;
}
*{box-sizing:border-box;}
@media (prefers-reduced-motion: reduce){
  *{animation-duration:.01ms !important;animation-iteration-count:1 !important;transition-duration:.01ms !important;}
}
body{
  margin:0;background:var(--bg);color:var(--white);font-family:var(--font-body);
  -webkit-font-smoothing:antialiased;overflow-x:hidden;line-height:1.5;position:relative;
}
h1,h2,h3{font-family:var(--font-display);font-weight:700;letter-spacing:-0.02em;margin:0;color:var(--white);}
p{margin:0;}
a{color:inherit;text-decoration:none;}
img,svg{display:block;max-width:100%;}
button{font-family:inherit;border:none;background:none;cursor:pointer;color:inherit;}
:focus-visible{outline:2px solid var(--green);outline-offset:3px;border-radius:4px;}
.wrap{max-width:1180px;margin:0 auto;padding:0 32px;position:relative;z-index:2;}
@media (max-width:640px){.wrap{padding:0 20px;}}

/* ---------- AMBIENT LAYERS ---------- */
#bgCanvas{position:fixed;inset:0;width:100vw;height:100vh;z-index:0;pointer-events:none;}
.concrete{
  position:fixed;inset:0;z-index:1;pointer-events:none;opacity:.05;mix-blend-mode:overlay;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='140' height='140'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.75' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
}
.spotlight{
  position:fixed;top:0;left:0;width:560px;height:560px;border-radius:50%;pointer-events:none;z-index:3;
  background:radial-gradient(circle, rgba(57,255,136,0.09) 0%, rgba(57,255,136,0) 70%);
  transform:translate(-280px,-280px);will-change:transform;
}
@media (max-width:900px), (hover:none){ .spotlight{display:none;} }

.anim-ready .reveal{opacity:0;transform:translateY(26px);}
.anim-ready .reveal-scale{opacity:0;transform:scale(.9);}

/* ---------- HEADER ---------- */
header{position:fixed;top:0;left:0;right:0;z-index:100;padding:22px 0;transition:background .5s var(--ease),border-color .5s var(--ease),padding .5s var(--ease),backdrop-filter .5s var(--ease);border-bottom:1px solid transparent;}
header .wrap{display:flex;align-items:center;justify-content:space-between;}
header.scrolled{background:rgba(5,5,5,0.72);backdrop-filter:blur(18px);-webkit-backdrop-filter:blur(18px);border-bottom:1px solid var(--green-border);padding:15px 0;}
.logo-lockup{display:flex;align-items:center;gap:12px;}
.logo-mark{width:34px;height:34px;flex-shrink:0;}
.logo-text{display:flex;flex-direction:column;line-height:1.1;}
.logo-text .name{font-family:var(--font-display);font-weight:700;font-size:18px;letter-spacing:-0.01em;}
.logo-text .tag{font-size:10.5px;color:var(--gray);letter-spacing:.02em;}
nav.main-nav{display:flex;align-items:center;gap:38px;}
nav.main-nav a{font-size:14px;font-weight:500;color:var(--white);position:relative;padding:4px 0;}
nav.main-nav a::after{content:"";position:absolute;left:0;bottom:-2px;width:0;height:1.5px;background:var(--green);transition:width .3s var(--ease);}
nav.main-nav a:hover::after{width:100%;}
.btn{display:inline-flex;align-items:center;gap:8px;font-size:14.5px;font-weight:700;padding:13px 24px;border-radius:100px;transition:transform .3s var(--ease),box-shadow .3s var(--ease),background .3s var(--ease),color .3s var(--ease),border-color .3s var(--ease);white-space:nowrap;}
.btn-green{background:var(--green);color:#050505;box-shadow:0 16px 40px -12px rgba(57,255,136,0.45);}
.btn-green:hover{background:#5DFFA3;transform:translateY(-2px);}
.btn-outline{border:1px solid var(--border-strong);color:var(--white);}
.btn-outline:hover{border-color:var(--green);color:var(--green);transform:translateY(-2px);}
.btn-ghost{color:var(--white);font-weight:600;}
.btn-ghost:hover{color:var(--green);}
.btn-arrow{transition:transform .35s var(--ease);}
.btn:hover .btn-arrow{transform:translateX(4px);}

.burger{display:none;width:36px;height:36px;align-items:center;justify-content:center;}
.burger span,.burger span::before,.burger span::after{content:"";display:block;width:20px;height:1.6px;background:var(--white);border-radius:2px;transition:transform .3s var(--ease),opacity .3s var(--ease);}
.burger span::before{transform:translateY(-6px);}
.burger span::after{transform:translateY(4.4px);}
.burger span{position:relative;}
.burger.open span{background:transparent;}
.burger.open span::before{transform:translateY(0) rotate(45deg);background:var(--white);}
.burger.open span::after{transform:translateY(0) rotate(-45deg);background:var(--white);}
.mobile-panel{position:fixed;inset:0;background:rgba(5,5,5,0.98);backdrop-filter:blur(20px);z-index:99;display:flex;flex-direction:column;justify-content:center;align-items:flex-start;gap:26px;padding:0 32px;opacity:0;visibility:hidden;transform:translateY(-8px);transition:opacity .4s var(--ease),transform .4s var(--ease),visibility .4s;}
.mobile-panel.open{opacity:1;visibility:visible;transform:translateY(0);}
.mobile-panel a{font-family:var(--font-display);font-size:28px;font-weight:700;}
@media (max-width:860px){ nav.main-nav{display:none;} .header-right .btn-outline{display:none;} .burger{display:flex;} }

/* ---------- HERO ---------- */
.hero{min-height:100vh;display:flex;flex-direction:column;justify-content:center;position:relative;padding:170px 0 100px;overflow:hidden;}
.hero-graffiti{position:absolute;inset:0;z-index:0;overflow:visible;opacity:.9;}
.hero .wrap{width:100%;position:relative;z-index:2;}
.hero-content{max-width:820px;}
.eyebrow{display:inline-flex;align-items:center;gap:8px;font-family:var(--font-body);font-size:12px;font-weight:700;letter-spacing:0.18em;text-transform:uppercase;color:var(--green);margin-bottom:26px;}
.eyebrow::before{content:"";width:6px;height:6px;border-radius:50%;background:var(--green);display:inline-block;box-shadow:0 0 14px rgba(57,255,136,.8);}
.hero-title{font-size:clamp(42px,8vw,96px);line-height:1.02;letter-spacing:-0.03em;}
.hero-title .word{display:inline-block;overflow:hidden;vertical-align:top;padding-bottom:.08em;}
.hero-title .word span{display:inline-block;}
.hero-title .accent{color:var(--green);}
.hero-sub{margin-top:30px;font-size:19px;line-height:1.6;color:var(--gray);max-width:560px;}
.hero-ctas{display:flex;gap:16px;margin-top:44px;flex-wrap:wrap;}
.scroll-cue{margin-top:80px;display:flex;align-items:center;gap:10px;color:var(--gray);font-size:12px;letter-spacing:.08em;text-transform:uppercase;}
.scroll-cue svg{animation:bob 1.8s ease-in-out infinite;}
@keyframes bob{0%,100%{transform:translateY(0);}50%{transform:translateY(6px);}}

/* ---------- SECTION GENERIC ---------- */
.section{padding:150px 0;position:relative;}
@media (max-width:640px){.section{padding:100px 0;}}
.section-head{max-width:680px;}
.section-head.center{max-width:760px;margin:0 auto;text-align:center;}
.section h2{font-size:clamp(30px,4.4vw,52px);line-height:1.14;}
.section-text{margin-top:22px;font-size:17px;line-height:1.75;color:var(--gray);max-width:560px;}
.section-head.center .section-text{margin-left:auto;margin-right:auto;}
.concrete-bg{background:linear-gradient(180deg,#080808 0%, #050505 100%);}

/* Problema — caos */
.chaos-visual{margin-top:70px;position:relative;height:320px;}
.chaos-chip{position:absolute;background:var(--gray-dark);border:1px solid var(--border);border-radius:10px;padding:12px 16px;font-size:13.5px;font-weight:500;color:var(--white);box-shadow:0 14px 30px -10px rgba(0,0,0,0.6);}
.chaos-chip .marker{display:block;font-family:var(--font-marker);font-size:12px;color:var(--green);margin-top:4px;transform:rotate(-2deg);}
@media (max-width:760px){
  .chaos-visual{height:auto;display:flex;flex-wrap:wrap;gap:12px;}
  .chaos-chip{position:static !important;transform:none !important;}
}

/* Transformação */
.flow-dark{margin-top:64px;display:flex;flex-direction:column;max-width:460px;position:relative;}
.flow-dark::before{content:"";position:absolute;left:17px;top:16px;bottom:16px;width:1.5px;background:var(--border-strong);}
.flow-dark-fill{position:absolute;left:17px;top:16px;width:1.5px;background:var(--green);height:0;transition:height 1.4s var(--ease);}
.flow-dark.in .flow-dark-fill{height:calc(100% - 32px);}
.flow-dark-step{display:flex;align-items:flex-start;gap:22px;padding:18px 0;position:relative;}
.flow-dark-dot{width:34px;height:34px;border-radius:50%;background:var(--gray-dark);border:1.5px solid var(--border-strong);display:flex;align-items:center;justify-content:center;flex-shrink:0;z-index:1;transition:border-color .6s var(--ease),background .6s var(--ease);}
.flow-dark-dot span{width:7px;height:7px;border-radius:50%;background:var(--gray);transition:background .6s var(--ease);}
.flow-dark-step.in .flow-dark-dot{border-color:var(--green);background:rgba(57,255,136,0.08);}
.flow-dark-step.in .flow-dark-dot span{background:var(--green);}
.flow-dark-label{font-family:var(--font-display);font-weight:700;font-size:19px;color:var(--gray);transition:color .6s var(--ease);}
.flow-dark-step.in .flow-dark-label{color:var(--white);}
.chaos-result{display:flex;align-items:center;justify-content:center;gap:16px;margin-top:60px;font-family:var(--font-display);font-weight:700;font-size:24px;}
.chaos-result .g{color:var(--green);}

/* Não é chatbot */
.compare-grid{margin-top:64px;display:grid;grid-template-columns:1fr 1fr;gap:24px;}
.compare-card{border-radius:20px;padding:34px;border:1px solid var(--border);background:var(--gray-dark);}
.compare-card.active{border-color:var(--green-border);background:linear-gradient(180deg, rgba(57,255,136,0.06), rgba(57,255,136,0.01));box-shadow:0 30px 70px -30px rgba(57,255,136,0.15);}
.compare-card .label{font-family:var(--font-display);font-weight:700;font-size:13px;letter-spacing:.08em;color:var(--gray);text-transform:uppercase;}
.compare-card.active .label{color:var(--green);}
.compare-card .msg{margin-top:20px;font-size:17px;line-height:1.6;color:var(--white);}
.compare-card .dim-dot{display:inline-block;width:7px;height:7px;border-radius:50%;background:var(--gray);margin-right:8px;}
.compare-card.active .dim-dot{background:var(--green);animation:pulse-g 2s infinite;}
@keyframes pulse-g{0%{box-shadow:0 0 0 0 rgba(57,255,136,.5);}70%{box-shadow:0 0 0 8px rgba(57,255,136,0);}100%{box-shadow:0 0 0 0 rgba(57,255,136,0);}}
@media (max-width:760px){.compare-grid{grid-template-columns:1fr;}}

/* Como funciona */
.steps-grid{margin-top:70px;display:grid;grid-template-columns:repeat(4,1fr);gap:1px;background:var(--border);border:1px solid var(--border);border-radius:20px;overflow:hidden;}
.step-card{background:#0A0A0A;padding:38px 28px;transition:background .4s var(--ease);}
.step-card:hover{background:var(--gray-dark);}
.step-card .num{font-family:var(--font-display);font-size:13px;font-weight:700;color:var(--green);letter-spacing:.08em;margin-bottom:20px;}
.step-card h3{font-size:18px;}
.step-card p{margin-top:10px;font-size:14px;color:var(--gray);line-height:1.6;}
@media (max-width:900px){.steps-grid{grid-template-columns:repeat(2,1fr);}}
@media (max-width:560px){.steps-grid{grid-template-columns:1fr;}}

/* Um dia com a Cogni */
.day-timeline{margin-top:70px;display:flex;flex-direction:column;max-width:640px;position:relative;}
.day-timeline::before{content:"";position:absolute;left:64px;top:8px;bottom:8px;width:1.5px;background:var(--border-strong);}
.day-item{display:flex;gap:28px;padding:22px 0;position:relative;}
.day-time{width:64px;flex-shrink:0;font-family:var(--font-display);font-weight:700;font-size:14px;color:var(--gray);padding-top:2px;}
.day-dot{position:absolute;left:60px;top:26px;width:9px;height:9px;border-radius:50%;background:var(--border-strong);transition:background .5s var(--ease),box-shadow .5s var(--ease);}
.day-item.in .day-dot{background:var(--green);box-shadow:0 0 12px rgba(57,255,136,.7);}
.day-body{padding-left:20px;}
.day-body .found{font-size:15.5px;font-weight:600;color:var(--white);}
.day-body .action{margin-top:6px;font-size:13.5px;color:var(--green-2);font-weight:600;}
.day-item.in .day-body .action{color:var(--green);}

/* O que ela faz */
.tasks-grid{margin-top:70px;display:grid;grid-template-columns:repeat(4,1fr);gap:16px;}
.task-card{background:var(--gray-dark);border:1px solid var(--border);border-radius:16px;padding:26px 22px;transition:transform .35s var(--ease),border-color .35s var(--ease),background .35s var(--ease);}
.task-card:hover{transform:translateY(-6px);border-color:var(--green-border);background:#1c1c1f;}
.task-card .ic{width:26px;height:26px;color:var(--green);margin-bottom:16px;}
.task-card h3{font-size:15.5px;}
.task-card p{margin-top:8px;font-size:13px;color:var(--gray);line-height:1.55;}
@media (max-width:900px){.tasks-grid{grid-template-columns:repeat(2,1fr);}}
@media (max-width:520px){.tasks-grid{grid-template-columns:1fr;}}

/* Cogni toma ação */
.action-chain{display:flex;flex-direction:column;align-items:center;gap:0;margin-top:64px;}
.action-node{padding:16px 30px;border-radius:100px;font-family:var(--font-display);font-weight:700;font-size:15px;border:1px solid var(--border-strong);background:var(--gray-dark);opacity:0;transform:scale(.7);}
.action-node.accent{background:var(--green);color:#050505;border-color:var(--green);}
.action-chain.in .action-node{opacity:1;transform:scale(1);transition:opacity .5s var(--ease),transform .5s var(--ease);}
.action-gap{height:64px;width:1.4px;background:var(--border-strong);position:relative;overflow:hidden;}
.action-gap span{position:absolute;left:0;top:0;width:100%;height:0;background:var(--green);transition:height .8s var(--ease);}
.action-chain.in .action-gap span{height:100%;}
.action-label{margin-top:8px;margin-bottom:8px;font-size:12px;color:var(--gray);text-transform:uppercase;letter-spacing:.08em;}

/* Funcionário digital */
.employee-visual{margin-top:56px;background:var(--gray-dark);border:1px solid var(--border);border-radius:20px;padding:8px;max-width:480px;}
.employee-feed{display:flex;flex-direction:column;gap:8px;padding:14px;}
.feed-row{display:flex;align-items:center;gap:12px;background:#0A0A0A;border:1px solid var(--border);border-radius:10px;padding:12px 14px;font-size:13px;color:var(--gray);}
.feed-row .fdot{width:6px;height:6px;border-radius:50%;background:var(--green);flex-shrink:0;}
.feed-row b{color:var(--white);font-weight:600;}

/* Dashboard produto */
.dash-wrap{margin-top:64px;background:#0A0A0A;border:1px solid var(--border);border-radius:24px;padding:44px;box-shadow:var(--shadow-lg);}
.dash-greet h3{font-size:24px;}
.dash-greet p{margin-top:8px;color:var(--gray);font-size:15px;}
.dash-stats{margin-top:34px;display:grid;grid-template-columns:repeat(4,1fr);gap:16px;}
.dash-stat{background:var(--gray-dark);border:1px solid var(--border);border-radius:14px;padding:20px;}
.dash-stat .n{font-family:var(--font-display);font-size:26px;font-weight:700;color:var(--green);}
.dash-stat .l{margin-top:6px;font-size:12.5px;color:var(--gray);line-height:1.4;}
.dash-timeline{margin-top:34px;display:flex;flex-direction:column;gap:2px;}
.dash-row{display:flex;gap:20px;padding:14px 0;border-top:1px solid var(--border);font-size:13.5px;}
.dash-row:first-child{border-top:none;}
.dash-row .t{width:56px;flex-shrink:0;color:var(--gray);font-family:var(--font-display);font-weight:600;font-size:13px;}
.dash-row .d{color:var(--white);}
.dash-note{margin-top:24px;font-size:12px;color:var(--gray);font-style:italic;}
@media (max-width:900px){.dash-stats{grid-template-columns:repeat(2,1fr);}.dash-wrap{padding:26px;}}
@media (max-width:520px){.dash-row{flex-direction:column;gap:4px;}}

/* Inteligência */
.intel-visual{margin-top:56px;display:flex;flex-wrap:wrap;gap:10px;max-width:600px;}
.intel-chip{background:var(--gray-dark);border:1px solid var(--border);border-radius:100px;padding:9px 16px;font-size:13px;color:var(--gray);}

/* Controle */
.control-levels{margin-top:64px;display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:var(--border);border:1px solid var(--border);border-radius:18px;overflow:hidden;}
.control-level{background:#0A0A0A;padding:32px 26px;}
.control-level .lv{font-family:var(--font-display);font-size:12.5px;font-weight:700;letter-spacing:.1em;color:var(--green);text-transform:uppercase;}
.control-level p{margin-top:12px;font-size:14px;color:var(--gray);line-height:1.6;}
.slider-block{margin-top:56px;max-width:560px;}
.slider-labels{display:flex;justify-content:space-between;font-size:12.5px;color:var(--gray);text-transform:uppercase;letter-spacing:.06em;margin-bottom:14px;}
.slider-labels .active-label{color:var(--green);font-weight:700;}
input[type="range"].auto-slider{-webkit-appearance:none;width:100%;height:4px;border-radius:4px;background:var(--border-strong);outline:none;}
input[type="range"].auto-slider::-webkit-slider-thumb{-webkit-appearance:none;width:22px;height:22px;border-radius:50%;background:var(--green);box-shadow:0 0 16px rgba(57,255,136,.6);cursor:pointer;border:none;}
input[type="range"].auto-slider::-moz-range-thumb{width:22px;height:22px;border-radius:50%;background:var(--green);box-shadow:0 0 16px rgba(57,255,136,.6);cursor:pointer;border:none;}
@media (max-width:760px){.control-levels{grid-template-columns:1fr;}}

/* Segurança */
.security-grid{margin-top:60px;display:grid;grid-template-columns:repeat(2,1fr);gap:20px;max-width:760px;}
.security-item{display:flex;gap:16px;align-items:flex-start;}
.security-item .ic{width:22px;height:22px;color:var(--green);flex-shrink:0;margin-top:2px;}
.security-item h3{font-size:15.5px;}
.security-item p{margin-top:6px;font-size:13.5px;color:var(--gray);line-height:1.55;}
@media (max-width:640px){.security-grid{grid-template-columns:1fr;}}

/* Resultado */
.result-section{text-align:center;background:radial-gradient(ellipse at 50% 0%, rgba(57,255,136,0.06), transparent 60%);}
.result-section h2{font-size:clamp(30px,4.8vw,54px);max-width:820px;margin:0 auto;}

/* CTA final */
.cta-final{position:relative;text-align:center;padding:200px 0 160px;overflow:hidden;background:#050505;}
.cta-spray{position:absolute;inset:0;z-index:0;opacity:.5;}
.cta-final h2{font-size:clamp(38px,6.6vw,72px);max-width:820px;margin:0 auto;position:relative;z-index:2;}
.cta-final .section-text{margin:24px auto 0;text-align:center;position:relative;z-index:2;}
.cta-final .hero-ctas{justify-content:center;margin-top:46px;position:relative;z-index:2;}

/* Footer */
footer{background:#030303;border-top:1px solid var(--border);padding:70px 0 40px;position:relative;z-index:2;}
.footer-top{display:flex;justify-content:space-between;gap:48px;flex-wrap:wrap;}
.footer-brand{max-width:300px;}
.footer-brand .logo-lockup{margin-bottom:14px;}
.footer-brand p{color:var(--gray);font-size:14px;line-height:1.6;}
.footer-brand .pugli-link{display:inline-flex;align-items:center;gap:6px;margin-top:14px;font-size:12.5px;color:var(--gray);border:1px solid var(--border);padding:8px 14px;border-radius:100px;transition:border-color .3s var(--ease),color .3s var(--ease);}
.footer-brand .pugli-link:hover{border-color:var(--green-border);color:var(--green);}
.footer-cols{display:flex;gap:56px;flex-wrap:wrap;}
.footer-col h4{font-size:12px;text-transform:uppercase;letter-spacing:.08em;color:var(--gray);margin-bottom:14px;font-weight:600;}
.footer-col a{display:block;font-size:14.5px;color:var(--white);padding:6px 0;transition:color .25s var(--ease);}
.footer-col a:hover{color:var(--green);}
.footer-bottom{margin-top:56px;padding-top:24px;border-top:1px solid var(--border);display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:16px;}
.footer-bottom span{font-size:13px;color:var(--gray);}
.social{display:flex;gap:18px;}
.social a{color:var(--gray);transition:color .25s var(--ease);}
.social a:hover{color:var(--green);}
.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0,0,0,0);}