/* =====================================================================
   GS Tech — styles.css (único CSS do site, sem build)
   Índice: 1 Fontes · 2 Tokens · 3 Base · 4 Layout e tipografia
   5 Botões, badge, tile · 6 Header · 7 Hero · 8 Janela de app (mockups)
   9 Planilha → sistema · 10 Bento · 11 GS-ERP · 12 Processo
   13 Diferenciais · 14 FAQ · 15 CTA · 16 Footer · 17 Páginas internas
   18 Animações e reveal · 19 Movimento reduzido
   ===================================================================== */
/* === 1 Fontes === */
@font-face {font-family:"Geist";src:url("../fonts/geist-latin-wght-normal.woff2") format("woff2");font-weight:100 900;font-style:normal;font-display:swap;}
@font-face {font-family:"Geist Mono";src:url("../fonts/geist-mono-latin-wght-normal.woff2") format("woff2");font-weight:100 900;font-style:normal;font-display:swap;}
/* === 2 Tokens === */
:root {color-scheme:dark;--bg:#0c0c0e;--surface-1:#131316;--surface-2:#18181b;--surface-3:#24242a;--line:rgb(255 255 255 / .08);--line-strong:rgb(255 255 255 / .14);--text:#f8fafc;--text-2:#a1a1aa;--text-3:#71717a;/* só decorativo ou texto >= 18px: não passa AA em texto pequeno */ --em-300:#6ee7b7;--em-400:#34d399;--em-500:#10b981;--em-600:#059669;--em-700:#047857;--em-950:#02291b;--violet:#6d28d9;/* Janela clara dos mockups (coerente com o GS-ERP real) */ --app-bg:#ffffff;--app-bg-2:#f6f7f8;--app-line:#e6e7ea;--app-text:#18181b;--app-text-2:#52525b;--app-text-3:#71717a;--app-em-soft:#e7f6ef;--font-sans:"Geist",ui-sans-serif,system-ui,-apple-system,"Segoe UI",sans-serif;--font-mono:"Geist Mono",ui-monospace,"SF Mono",Menlo,monospace;--r-sm:6px;--r-md:9px;--r-lg:12px;--r-xl:16px;--r-pill:999px;--maxw:1200px;--header-h:72px;--ease-out:cubic-bezier(.16,1,.3,1);--shadow-raised:inset 0 1px 0 rgb(255 255 255 / .02),inset 0 0 0 1px rgb(255 255 255 / .06),0 1px 1px rgb(0 0 0 / .28),0 2px 3px -2px rgb(0 0 0 / .2);--shadow-panel:inset 0 1px 0 rgb(255 255 255 / .05),0 0 0 1px rgb(0 0 0 / .5),0 1px 2px rgb(0 0 0 / .2),0 4px 8px -2px rgb(0 0 0 / .18),0 12px 24px -8px rgb(0 0 0 / .22);}
/* === 3 Base === */
*,*::before,*::after {box-sizing:border-box;}
html {-webkit-text-size-adjust:100%;scroll-padding-top:calc(var(--header-h) + 16px);}
@media (prefers-reduced-motion:no-preference) {
  html {scroll-behavior:smooth;}
}
body {margin:0;background:var(--bg);color:var(--text);font-family:var(--font-sans);font-size:1rem;line-height:1.65;-webkit-font-smoothing:antialiased;overflow-x:clip;}
body.menu-open {overflow:hidden;}
img,svg {display:block;max-width:100%;}
h1,h2,h3,p,ul,ol,figure {margin:0;}
ul,ol {padding:0;list-style:none;}
a {color:inherit;}
h1,h2,h3 {font-weight:600;text-wrap:balance;}
p,li {text-wrap:pretty;}
kbd {font-family:var(--font-mono);}
:focus-visible {outline:2px solid var(--em-300);outline-offset:3px;border-radius:4px;}
::selection {background:rgb(16 185 129 / .35);color:#fff;}
* {scrollbar-color:var(--text-2) var(--surface-2);}
[data-phone-label] {margin-left:.3em;}
.sr-only {position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0;}
.sprite {position:absolute;width:0;height:0;overflow:hidden;}
.skip-link {position:absolute;left:1rem;top:-100px;z-index:100;padding:.75rem 1rem;border-radius:var(--r-md);background:var(--em-400);color:var(--em-950);font-weight:600;text-decoration:none;}
.skip-link:focus {top:1rem;}
.icon {width:18px;height:18px;flex:none;fill:none;stroke:currentColor;stroke-width:1.75;stroke-linecap:round;stroke-linejoin:round;}
/* === 4 Layout e tipografia === */
.container {width:100%;max-width:var(--maxw);margin-inline:auto;padding-inline:clamp(1rem,4vw,2rem);}
.section {position:relative;padding-block:clamp(5rem,10vw,9rem);}
.section--tight {padding-block:clamp(3.5rem,7vw,6rem);}
.section--alt {background:var(--surface-1);border-block:1px solid var(--line);}
.section-head {max-width:46rem;margin-bottom:clamp(2.5rem,5vw,4rem);}
.split {display:grid;grid-template-columns:minmax(0,1fr);gap:clamp(2.5rem,5vw,4.5rem);align-items:center;}
@media (min-width:960px) {
  .split {grid-template-columns:minmax(0,5fr) minmax(0,7fr);}
  .split--process,.split--faq {align-items:start;}
  .section-head--sticky {position:sticky;top:calc(var(--header-h) + 2.5rem);}
  .split .section-head {margin-bottom:0;}
}
.eyebrow {display:inline-flex;align-items:center;gap:.6rem;font-family:var(--font-mono);font-size:.75rem;line-height:1.4;letter-spacing:.08em;text-transform:uppercase;color:var(--em-300);}
/* Losango: o mesmo chanfro do símbolo, reduzido a marcador. */
.eyebrow::before {content:"";width:7px;height:7px;background:currentColor;clip-path:polygon(50% 0,100% 50%,50% 100%,0 50%);}
.eyebrow--center {justify-content:center;}
h2 {margin-top:1rem;font-size:clamp(1.75rem,1.2rem + 2vw,2.75rem);line-height:1.1;letter-spacing:-.03em;}
h3 {font-size:1.125rem;line-height:1.3;letter-spacing:-.01em;}
.lede {margin-top:1rem;max-width:40rem;font-size:clamp(1.0625rem,1rem + .3vw,1.1875rem);color:var(--text-2);}
.caption {margin-top:.9rem;text-align:center;font-family:var(--font-mono);font-size:.75rem;color:var(--text-2);}
.caption--left {text-align:left;}
/* === 5 Botões, badge, tile === */
.btn {position:relative;display:inline-flex;align-items:center;justify-content:center;gap:.55rem;min-height:44px;padding:.65rem 1.15rem;overflow:hidden;border:1px solid transparent;border-radius:var(--r-md);font:600 .9375rem/1.2 var(--font-sans);text-decoration:none;white-space:nowrap;cursor:pointer;transition:background-color .2s,border-color .2s,box-shadow .2s,filter .2s,transform .2s var(--ease-out);}
.btn:active {transform:translateY(1px);}
.btn--primary {background:linear-gradient(180deg,var(--em-400),var(--em-500));color:var(--em-950);box-shadow:inset 0 1px 0 rgb(255 255 255 / .3),0 0 0 1px rgb(16 185 129 / .45),0 8px 24px -10px rgb(16 185 129 / .6);}
.btn--primary:hover {filter:brightness(1.07);}
/* Brilho que atravessa o botão no hover (referência: shimmer-button). */
.btn--primary::after {content:"";position:absolute;inset:0;background:linear-gradient(110deg,transparent 35%,rgb(255 255 255 / .38) 50%,transparent 65%);transform:translateX(-120%);transition:transform .8s var(--ease-out);pointer-events:none;}
.btn--primary:hover::after {transform:translateX(120%);}
.btn--secondary {background:var(--surface-3);border-color:var(--line-strong);color:var(--text);box-shadow:var(--shadow-raised);}
.btn--secondary:hover {background:#2c2c33;border-color:rgb(255 255 255 / .22);}
.btn--sm {padding-inline:.95rem;font-size:.875rem;}
.label-short {display:none;}
.badge {display:inline-flex;align-items:center;gap:.6rem;padding:.45rem .9rem .45rem .75rem;border:1px solid var(--line-strong);border-radius:var(--r-pill);background:rgb(255 255 255 / .03);font:500 .75rem/1 var(--font-mono);letter-spacing:.06em;text-transform:uppercase;color:var(--text-2);}
.badge__dot {width:7px;height:7px;border-radius:50%;background:var(--em-500);animation:pulse 2.4s ease-out infinite;}
/* Tile de ícone com canto chanfrado: o octógono do símbolo. */
.tile {--c:11px;--octagon:polygon(var(--c) 0,calc(100% - var(--c)) 0,100% var(--c),100% calc(100% - var(--c)),calc(100% - var(--c)) 100%,var(--c) 100%,0 calc(100% - var(--c)),0 var(--c));position:relative;display:grid;place-items:center;flex:none;width:44px;height:44px;color:var(--em-300);background:rgb(110 231 183 / .32);clip-path:var(--octagon);}
.tile::before {content:"";position:absolute;inset:1px;background:#102019;clip-path:var(--octagon);}
.glyph {position:relative;width:22px;height:22px;fill:none;stroke:currentColor;stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round;}
/* Borda com feixe de luz girando (referência: border-beam / shine-border). */
@property --beam {syntax:"<angle>";inherits:false;initial-value:0deg;}
.beam {position:relative;}
.beam::before {content:"";position:absolute;inset:0;z-index:1;padding:1px;border-radius:inherit;background:conic-gradient(from var(--beam),transparent 0 78%,var(--em-300) 92%,transparent 100%);-webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask:linear-gradient(#000 0 0) content-box exclude,linear-gradient(#000 0 0);animation:beam-spin 8s linear infinite;pointer-events:none;}
/* === 6 Header === */
.progress {position:fixed;inset:0 0 auto;z-index:60;height:2px;pointer-events:none;}
.progress__bar {display:block;height:100%;background:var(--em-500);transform:scaleX(0);transform-origin:0 50%;}
.site-header {position:sticky;top:0;z-index:50;height:var(--header-h);padding:.75rem clamp(.75rem,3vw,1.5rem) 0;}
.site-header__inner {position:relative;isolation:isolate;display:flex;align-items:center;gap:1rem;max-width:1080px;height:60px;margin-inline:auto;padding:0 .5rem 0 1rem;border-radius:var(--r-xl);}
/* O blur fica num pseudo-elemento: backdrop-filter no próprio container
   prenderia o painel fixo do menu mobile dentro dele. */
.site-header__inner::before {content:"";position:absolute;inset:0;z-index:-1;border:1px solid transparent;border-radius:inherit;background:rgb(12 12 14 / .55);-webkit-backdrop-filter:blur(12px) saturate(140%);backdrop-filter:blur(12px) saturate(140%);transition:background-color .3s,border-color .3s,box-shadow .3s;}
.site-header.is-scrolled .site-header__inner::before {background:rgb(19 19 22 / .8);border-color:var(--line);box-shadow:var(--shadow-panel);}
.brand {display:inline-flex;flex:none;border-radius:var(--r-sm);}
.brand img {width:auto;height:39.6px;}
.nav {display:flex;align-items:center;gap:.5rem;margin-left:auto;}
.nav__panel {display:flex;align-items:center;}
.nav__links {display:flex;gap:.15rem;}
.nav__links a {display:inline-flex;align-items:center;min-height:44px;padding:0 .8rem;border-radius:var(--r-md);color:var(--text-2);font-size:.9375rem;text-decoration:none;transition:color .2s,background-color .2s;}
.nav__links a:hover {color:var(--text);background:rgb(255 255 255 / .05);}
.menu-toggle {position:relative;z-index:2;display:none;align-items:center;gap:.5rem;min-height:44px;padding:0 .75rem;border:1px solid var(--line-strong);border-radius:var(--r-md);background:var(--surface-2);color:var(--text);font:500 .875rem/1 var(--font-sans);cursor:pointer;}
.menu-toggle__icon,.menu-toggle__icon::before {display:block;width:14px;height:1.5px;background:currentColor;transition:transform .25s var(--ease-out);}
.menu-toggle__icon {position:relative;transform:translateY(-3px);}
.menu-toggle__icon::before {content:"";position:absolute;top:6px;}
.menu-toggle[aria-expanded="true"] .menu-toggle__icon {transform:rotate(45deg);}
.menu-toggle[aria-expanded="true"] .menu-toggle__icon::before {transform:translateY(-6px) rotate(-90deg);}
@media (max-width:819px) {
  .nav__links {display:none;}
  /* Sem JS o botão não faz nada: fica invisível, mas reserva o espaço para não deslocar o header. */
  .menu-toggle {display:inline-flex;visibility:hidden;}
  .js .menu-toggle {visibility:visible;}
  .nav__panel.is-open {position:fixed;inset:0;z-index:1;flex-direction:column;align-items:stretch;padding:calc(var(--header-h) + 2rem) 1.5rem 2rem;background:rgb(12 12 14 / .97);}
  .nav__panel.is-open .nav__links {display:flex;flex-direction:column;gap:0;}
  .nav__panel.is-open .nav__links a {min-height:60px;padding:0 .25rem;border-bottom:1px solid var(--line);border-radius:0;color:var(--text);font-size:1.5rem;letter-spacing:-.02em;}
}
@media (max-width:479px) {
  .label-long {display:none;}
  .label-short {display:inline;}
  .brand img {height:33px;}
  .site-header__inner {gap:.5rem;padding-left:.75rem;}
}
@media (max-width:359px) {
  .nav > .btn {padding-inline:.5rem;}
  .menu-toggle {padding-inline:.5rem;}
  .brand img {height:27.5px;}
}
/* === 7 Hero === */
.hero {position:relative;isolation:isolate;margin-top:calc(-1 * var(--header-h));padding-top:calc(var(--header-h) + clamp(3.5rem,8vw,6.5rem));padding-bottom:clamp(4rem,8vw,7rem);}
.hero__bg {position:absolute;inset:0;z-index:-1;overflow:hidden;pointer-events:none;}
.hero__bg::before {content:"";position:absolute;inset:0;background-image:linear-gradient(var(--line) 1px,transparent 1px),linear-gradient(90deg,var(--line) 1px,transparent 1px);background-size:56px 56px;background-position:center top;-webkit-mask-image:radial-gradient(ellipse 70% 50% at 50% 28%,#000 25%,transparent 75%);mask-image:radial-gradient(ellipse 70% 50% at 50% 28%,#000 25%,transparent 75%);}
/* Único glow da primeira dobra: esmeralda no topo e um toque violeta (≤ 8%). */
.hero__bg::after {content:"";position:absolute;inset:-20% -10% 30%;background:radial-gradient(38% 45% at 50% 30%,rgb(16 185 129 / .16),transparent 70%),radial-gradient(22% 30% at 82% 62%,rgb(109 40 217 / .08),transparent 70%);}
.hero__intro {display:flex;flex-direction:column;align-items:center;text-align:center;}
.hero__title {max-width:17ch;margin-top:1.5rem;font-size:clamp(2.5rem,1.6rem + 4vw,4.75rem);line-height:1.04;letter-spacing:-.04em;}
.accent {color:var(--em-300);}
.hero__lede {max-width:40rem;margin-top:1.5rem;font-size:clamp(1.0625rem,1rem + .4vw,1.25rem);color:var(--text-2);}
.hero__actions {display:flex;flex-wrap:wrap;justify-content:center;gap:.75rem;margin-top:2.25rem;}
.hero__meta {margin-top:1.75rem;font-family:var(--font-mono);font-size:.75rem;letter-spacing:.04em;color:var(--text-2);}
.hero__visual {position:relative;max-width:1120px;margin-top:clamp(3rem,7vw,5rem);animation:rise 1s var(--ease-out) .15s both;}
.tilt {position:relative;transform:perspective(1800px) rotateX(var(--rx,0deg)) rotateY(var(--ry,0deg));transition:transform .4s var(--ease-out);}
/* === 8 Janela de app (mockups claros) === */
.frame {padding:1px;border-radius:calc(var(--r-xl) + 1px);background:rgb(255 255 255 / .12);box-shadow:0 0 0 7px rgb(255 255 255 / .025),0 40px 90px -30px rgb(0 0 0 / .85);}
.app {position:relative;overflow:hidden;border-radius:var(--r-xl);background:var(--app-bg);color:var(--app-text);font-size:.8125rem;line-height:1.4;text-align:left;}
.app__bar {display:flex;align-items:center;gap:.9rem;height:42px;padding:0 1rem;border-bottom:1px solid var(--app-line);background:var(--app-bg-2);}
.app__dots {display:flex;gap:6px;}
.app__dots i {width:10px;height:10px;border-radius:50%;background:#d4d4d8;}
.app__title {font-weight:600;color:var(--app-text-2);}
.app__search {display:inline-flex;align-items:center;gap:.75rem;margin-left:auto;padding:.3rem .4rem .3rem .75rem;border:1px solid var(--app-line);border-radius:var(--r-md);background:#fff;color:var(--app-text-3);}
.app__search kbd {padding:.1rem .35rem;border:1px solid var(--app-line);border-radius:5px;font-size:.6875rem;color:var(--app-text-2);}
.app__body {display:grid;grid-template-columns:196px minmax(0,1fr);}
.app__side {display:flex;flex-direction:column;gap:.15rem;padding:1rem .75rem;border-right:1px solid var(--app-line);background:var(--app-bg-2);}
.app__org {display:flex;align-items:center;gap:.55rem;margin-bottom:.5rem;font-weight:600;}
.mini-tile {--c:6px;display:grid;place-items:center;width:26px;height:26px;background:var(--em-600);color:#fff;font-size:.625rem;font-weight:700;clip-path:polygon(var(--c) 0,calc(100% - var(--c)) 0,100% var(--c),100% calc(100% - var(--c)),calc(100% - var(--c)) 100%,var(--c) 100%,0 calc(100% - var(--c)),0 var(--c));}
.app__group {margin:.7rem 0 .2rem .5rem;font-size:.625rem;font-weight:600;letter-spacing:.08em;text-transform:uppercase;color:var(--app-text-3);}
.app__nav {display:flex;align-items:center;gap:.55rem;padding:.4rem .5rem;border-radius:7px;color:var(--app-text-2);}
.app__nav i {width:11px;height:11px;border:1.5px solid currentColor;clip-path:polygon(3px 0,calc(100% - 3px) 0,100% 3px,100% calc(100% - 3px),calc(100% - 3px) 100%,3px 100%,0 calc(100% - 3px),0 3px);opacity:.7;}
.app__nav.is-active {background:var(--app-em-soft);color:var(--em-700);font-weight:600;}
.app__main {display:flex;flex-direction:column;gap:1rem;min-width:0;padding:1.25rem;}
.app__head {display:flex;align-items:flex-start;justify-content:space-between;gap:1rem;}
.app__h {font-size:1.0625rem;font-weight:600;letter-spacing:-.01em;}
.app__sub {color:var(--app-text-3);font-size:.75rem;}
.app__btn {flex:none;padding:.4rem .75rem;border-radius:7px;background:var(--em-600);color:#fff;font-weight:600;font-size:.75rem;}
.kpis {display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:.75rem;}
.kpi {padding:.85rem;border:1px solid var(--app-line);border-radius:10px;}
.kpi__label {color:var(--app-text-2);font-size:.75rem;}
.kpi__value {margin-top:.2rem;font-size:1.375rem;font-weight:600;letter-spacing:-.02em;font-variant-numeric:tabular-nums;white-space:nowrap;}
.kpi__delta {margin-top:.15rem;color:var(--em-700);font-size:.6875rem;font-weight:500;}
.kpi__delta--neutral {color:var(--app-text-2);}
.app__grid {display:grid;grid-template-columns:minmax(0,1.5fr) minmax(0,1fr);gap:.75rem;}
.panel {padding:.85rem;border:1px solid var(--app-line);border-radius:10px;}
.panel__title {margin-bottom:.6rem;font-weight:600;font-size:.75rem;}
.chart {width:100%;height:120px;overflow:visible;}
.chart__grid {stroke:var(--app-line);stroke-width:1;vector-effect:non-scaling-stroke;}
.chart__area {fill:rgb(16 185 129 / .1);}
.chart__line {fill:none;stroke:var(--em-600);stroke-width:2;stroke-linejoin:round;vector-effect:non-scaling-stroke;stroke-dasharray:1;stroke-dashoffset:0;animation:draw 1.6s var(--ease-out) .7s both;}
.activity ul {display:grid;gap:.55rem;}
.activity li {display:grid;grid-template-columns:auto minmax(0,1fr) auto;align-items:center;gap:.5rem;font-size:.75rem;animation:slide-in .6s var(--ease-out) both;}
.activity li:nth-child(1) {animation-delay:1.1s;}
.activity li:nth-child(2) {animation-delay:1.35s;}
.activity li:nth-child(3) {animation-delay:1.6s;}
.activity li i {width:7px;height:7px;border-radius:50%;background:var(--em-500);}
.activity li:not(:first-child) i {background:#d4d4d8;}
.activity time {color:var(--app-text-3);font-size:.6875rem;}
.term {display:flex;flex-direction:column;font-family:var(--font-mono);font-size:.75rem;line-height:1.7;color:var(--text);}
.term__line {display:block;min-height:1.7em;white-space:pre;}
.term__line.is-ok {color:var(--em-300);}
.term__line.is-dim {color:var(--text-2);}
.term__line.is-typing::after {content:"";display:inline-block;width:.55em;height:1.05em;margin-left:1px;vertical-align:-.15em;background:var(--em-300);animation:blink 1s steps(1) infinite;}
.term--chip {position:absolute;right:clamp(-1.5rem,-2vw,-.5rem);bottom:-1.75rem;z-index:2;min-width:15.5rem;padding:.75rem 1rem;border:1px solid var(--line-strong);border-radius:var(--r-lg);background:rgb(19 19 22 / .92);box-shadow:var(--shadow-panel);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);}
@media (max-width:899px) {
  .app__body {grid-template-columns:minmax(0,1fr);}
  .app__side {display:none;}
}
@media (max-width:639px) {
  .app__main {padding:.9rem;gap:.75rem;}
  .app__search {display:none;}
  .app__grid {grid-template-columns:minmax(0,1fr);}
  .activity {display:none;}
  .kpis {gap:.4rem;}
  .kpi {padding:.6rem;}
  .kpi__value {font-size:1rem;}
  .kpi__delta {display:none;}
  .chart {height:90px;}
  .term--chip {display:none;}
}
/* === 9 Planilha → sistema === */
.contrast-list {display:grid;gap:1.1rem;margin-top:2rem;}
.contrast-list li {display:grid;gap:.2rem;padding-left:1.1rem;border-left:1px solid var(--line-strong);}
.contrast-list__tag {font-family:var(--font-mono);font-size:.75rem;letter-spacing:.06em;text-transform:uppercase;color:var(--text-2);}
.compare {min-width:0;padding:clamp(.75rem,2vw,1.25rem);border:1px solid var(--line);border-radius:calc(var(--r-xl) + 4px);background:var(--surface-1);box-shadow:var(--shadow-panel);}
.compare__switch {display:none;}
.js .compare__switch {display:inline-flex;flex-wrap:wrap;gap:4px;margin-bottom:1rem;padding:4px;border:1px solid var(--line);border-radius:var(--r-lg);background:var(--bg);}
.compare__btn {min-height:44px;padding:0 1rem;border:0;border-radius:var(--r-md);background:transparent;color:var(--text-2);font:500 .875rem/1.2 var(--font-sans);cursor:pointer;transition:background-color .2s,color .2s;}
.compare__btn:hover {color:var(--text);}
.compare__btn[aria-pressed="true"] {background:var(--surface-3);color:var(--text);box-shadow:var(--shadow-raised);}
.compare__btn[aria-pressed="true"][data-compare-target="sistema"] {color:var(--em-300);}
/* Sem JS as duas versões aparecem empilhadas; com JS ocupam a mesma célula e alternam. */
.compare__stage {display:grid;grid-template-columns:minmax(0,1fr);gap:1rem;}
.compare__pane {min-width:0;}
.js .compare__stage {gap:0;}
.js .compare__pane {grid-area:1 / 1;transition:opacity .5s var(--ease-out),clip-path .5s var(--ease-out),visibility 0s .5s;}
.js .compare__pane:not(.is-active) {opacity:0;visibility:hidden;clip-path:inset(0 0 0 100% round var(--r-lg));}
.js .compare__pane.is-active {opacity:1;visibility:visible;clip-path:inset(0 0 0 0 round var(--r-lg));transition-delay:0s;}
.sheet,.sys {position:relative;overflow-x:auto;border-radius:var(--r-lg);background:#fff;color:var(--app-text);font-size:.8125rem;line-height:1.4;}
.sheet table,.sys table {width:100%;border-collapse:collapse;}
.sheet:focus-visible,.sys:focus-visible {outline-color:var(--em-700);outline-offset:-3px;}
.sheet__bar {display:flex;flex-wrap:wrap;justify-content:space-between;gap:.25rem 1rem;padding:.6rem .8rem;border-bottom:1px solid #e5e7eb;background:#f3f4f6;font-family:var(--font-mono);font-size:.75rem;}
.sheet__file {font-weight:600;}
.sheet__saved {color:#4b5563;}
.sheet__formula {display:flex;gap:.9rem;padding:.4rem .8rem;border-bottom:1px solid #e5e7eb;font-family:var(--font-mono);font-size:.75rem;color:#374151;}
.sheet__formula span:first-child {min-width:2rem;color:#4b5563;}
.sheet th,.sheet td {padding:.45rem .55rem;border:1px solid #e5e7eb;font-family:var(--font-mono);font-size:.75rem;font-weight:400;text-align:left;white-space:nowrap;}
.sheet thead th {background:#f9fafb;color:#4b5563;}
.sheet .rownum {width:2rem;background:#f9fafb;color:#4b5563;text-align:center;}
.sheet__total td {font-weight:600;}
.cell-err {background:#fef2f2;color:#b91c1c;}
.cell-warn {background:#fef9c3;}
.sheet__note {position:absolute;right:.9rem;bottom:.9rem;padding:.45rem .65rem;border-radius:4px;background:#fde68a;color:#78350f;font-size:.75rem;font-weight:500;box-shadow:0 6px 14px -6px rgb(0 0 0 / .35);transform:rotate(-2deg);}
.sys__toolbar {display:flex;flex-wrap:wrap;align-items:center;gap:.4rem;padding:.75rem;border-bottom:1px solid var(--app-line);}
.chip {padding:.25rem .65rem;border:1px solid var(--app-line);border-radius:var(--r-pill);color:var(--app-text-2);font-size:.75rem;}
.chip.is-on {border-color:#a7e3c9;background:var(--app-em-soft);color:var(--em-700);font-weight:600;}
.sys__search {margin-left:auto;padding:.25rem .65rem;border:1px solid var(--app-line);border-radius:7px;color:var(--app-text-3);font-size:.75rem;}
.sys th,.sys td {padding:.6rem .75rem;border-bottom:1px solid var(--app-line);text-align:left;white-space:nowrap;}
.sys th {font-size:.6875rem;font-weight:600;letter-spacing:.05em;text-transform:uppercase;color:var(--app-text-2);}
.sys .num {text-align:right;font-variant-numeric:tabular-nums;}
.sys__foot {display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:.5rem 1rem;padding:.75rem;}
.sys__alert {display:flex;align-items:center;gap:.4rem;color:var(--em-700);font-size:.75rem;font-weight:500;}
.sys__alert .icon {width:15px;height:15px;}
.sys__total {color:var(--app-text-2);font-size:.8125rem;}
.sys__total strong {margin-left:.35rem;color:var(--app-text);font-variant-numeric:tabular-nums;}
.pill {display:inline-flex;align-items:center;gap:.35rem;padding:.15rem .55rem;border-radius:var(--r-pill);font-size:.6875rem;font-weight:600;white-space:nowrap;}
.pill::before {content:"";width:6px;height:6px;border-radius:50%;background:currentColor;}
.pill--ok {background:var(--app-em-soft);color:var(--em-700);}
.pill--open {background:#f4f4f5;color:#3f3f46;}
.pill--late {background:#fef3c7;color:#92400e;}
@media (max-width:559px) {
  .col-opt {display:none;}
  .sys__search {display:none;}
  .sheet__note {position:static;display:inline-block;margin:.6rem .8rem .8rem;}
}
/* === 10 Bento de soluções === */
.bento {display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:1rem;}
.card {position:relative;isolation:isolate;grid-column:span 12;display:flex;flex-direction:column;gap:.9rem;overflow:hidden;padding:clamp(1.25rem,2.5vw,1.75rem);border:1px solid var(--line);border-radius:var(--r-xl);background:var(--surface-2);box-shadow:var(--shadow-raised);}
.card p {color:var(--text-2);}
.card h3 {margin-top:.35rem;}
.card__text {display:flex;flex-direction:column;gap:.9rem;}
@media (min-width:720px) {
  .span-4,.span-6,.span-8 {grid-column:span 6;}
}
@media (min-width:1024px) {
  .span-4 {grid-column:span 4;}
  .span-8 {grid-column:span 8;}
  .card--wide {display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.1fr);align-items:start;gap:2rem;}
}
/* Spotlight que segue o cursor (referência: magic-card). */
.spot::before {content:"";position:absolute;inset:0;z-index:-1;border-radius:inherit;background:radial-gradient(340px circle at var(--mx,50%) var(--my,50%),rgb(16 185 129 / .12),transparent 60%);opacity:0;transition:opacity .3s;}
.spot:hover::before {opacity:1;}
.perm {margin-top:auto;padding:.9rem;border:1px solid var(--line);border-radius:var(--r-lg);background:var(--bg);font-size:.8125rem;}
.perm__profile {display:inline-block;margin-bottom:.6rem;padding:.2rem .6rem;border:1px solid var(--line-strong);border-radius:var(--r-pill);color:var(--text-2);font-size:.75rem;}
.perm__profile strong {color:var(--text);font-weight:600;}
.perm__row {display:grid;grid-template-columns:minmax(0,1.6fr) repeat(3,minmax(0,1fr));align-items:center;gap:.5rem;padding:.45rem 0;border-top:1px solid var(--line);}
.perm__row--head {border-top:0;color:var(--text-2);font-family:var(--font-mono);font-size:.6875rem;letter-spacing:.05em;text-transform:uppercase;}
.perm__row i {--c:4px;position:relative;width:18px;height:18px;background:var(--surface-3);clip-path:polygon(var(--c) 0,calc(100% - var(--c)) 0,100% var(--c),100% calc(100% - var(--c)),calc(100% - var(--c)) 100%,var(--c) 100%,0 calc(100% - var(--c)),0 var(--c));}
.perm__row i.on {background:var(--em-500);}
.perm__row i.on::after {content:"";position:absolute;left:6px;top:3px;width:5px;height:9px;border:solid var(--em-950);border-width:0 2px 2px 0;transform:rotate(45deg);}
.mods {display:grid;grid-template-columns:1fr 1fr;gap:.5rem;margin-top:auto;}
.mods span {padding:.55rem .7rem;border:1px solid var(--line);border-radius:var(--r-md);background:var(--surface-1);color:var(--text-2);font-family:var(--font-mono);font-size:.75rem;}
.mods span:first-child {border-color:rgb(110 231 183 / .35);color:var(--em-300);}
.flow {width:100%;height:auto;margin-top:auto;}
.flow__path {fill:none;stroke:var(--line-strong);stroke-width:1.5;}
.flow__beam {fill:none;stroke:var(--em-300);stroke-width:2;stroke-linecap:round;stroke-dasharray:16 84;stroke-dashoffset:100;animation:flow 2.8s linear infinite;}
.flow__beam--late {animation-delay:-1.4s;}
.flow__node {fill:var(--surface-1);stroke:var(--line-strong);}
.flow__node--main {fill:#102019;stroke:rgb(110 231 183 / .45);}
.flow text {fill:var(--text-2);font-family:var(--font-mono);font-size:11px;text-anchor:middle;}
.term--block {margin-top:auto;padding:1rem 1.1rem;border:1px solid var(--line);border-radius:var(--r-lg);background:var(--bg);overflow:hidden;}
.bi {margin-top:auto;padding:.9rem;border:1px solid var(--line);border-radius:var(--r-lg);background:var(--bg);}
.bi__head {display:flex;justify-content:space-between;margin-bottom:.75rem;color:var(--text-2);font-size:.75rem;}
.bi__head strong {color:var(--em-300);font-family:var(--font-mono);font-weight:500;}
.bars {width:100%;height:96px;}
.bars rect {fill:var(--surface-3);transform-box:fill-box;transform-origin:50% 100%;transition:transform .9s var(--ease-out);}
.bars rect.is-current {fill:var(--em-500);}
.bars rect:nth-child(2) {transition-delay:.05s;}
.bars rect:nth-child(3) {transition-delay:.1s;}
.bars rect:nth-child(4) {transition-delay:.15s;}
.bars rect:nth-child(5) {transition-delay:.2s;}
.bars rect:nth-child(6) {transition-delay:.25s;}
.bars rect:nth-child(7) {transition-delay:.3s;}
.bars rect:nth-child(8) {transition-delay:.35s;}
.js .reveal:not(.is-in) .bars rect {transform:scaleY(.06);}
.mini-steps {display:grid;gap:.5rem;margin-top:auto;}
.mini-steps li {display:flex;align-items:center;gap:.7rem;padding:.6rem .8rem;border:1px solid var(--line);border-radius:var(--r-md);background:var(--surface-1);font-size:.9375rem;}
.mini-steps li::before {content:"";flex:none;width:8px;height:8px;background:var(--em-400);clip-path:polygon(50% 0,100% 50%,50% 100%,0 50%);}
/* === 11 GS-ERP === */
.erp {display:grid;gap:clamp(2rem,4vw,3rem);align-items:center;padding:clamp(1.5rem,4vw,3rem);border:1px solid var(--line);border-radius:calc(var(--r-xl) + 4px);background:var(--surface-1);}
@media (min-width:960px) {
  .erp {grid-template-columns:minmax(0,1fr) minmax(0,1fr);}
}
.erp h2 {font-size:clamp(1.5rem,1.1rem + 1.5vw,2.125rem);}
.check-list {display:grid;gap:.55rem;margin:1.5rem 0 2rem;}
.check-list li {display:flex;align-items:center;gap:.6rem;}
.check-list .icon {color:var(--em-300);}
.app--erp {box-shadow:0 0 0 1px rgb(255 255 255 / .1),0 30px 60px -30px rgb(0 0 0 / .8);}
.erp-tabs {display:flex;gap:1.25rem;padding:0 1rem;border-bottom:1px solid var(--app-line);}
.erp-tabs span {padding:.7rem 0;color:var(--app-text-2);border-bottom:2px solid transparent;}
.erp-tabs .is-active {border-color:var(--em-600);color:var(--app-text);font-weight:600;}
.erp-toolbar {display:flex;align-items:center;justify-content:space-between;gap:.75rem;padding:.85rem 1rem;}
.app__search--light {margin-left:0;}
.erp-list li {display:grid;grid-template-columns:auto minmax(0,1fr) auto;align-items:center;gap:.75rem;padding:.6rem 1rem;border-top:1px solid var(--app-line);}
.avatar {display:grid;place-items:center;width:30px;height:30px;border-radius:50%;background:var(--app-em-soft);color:var(--em-700);font-size:.6875rem;font-weight:700;}
.erp-list__name {display:flex;flex-direction:column;font-weight:500;}
.erp-list__name small {color:var(--app-text-3);font-size:.6875rem;font-weight:400;}
.erp-pager {display:flex;align-items:center;justify-content:space-between;padding:.7rem 1rem;border-top:1px solid var(--app-line);color:var(--app-text-3);font-size:.75rem;}
.erp-pager__btns {display:flex;gap:.35rem;}
.erp-pager__btns i {display:grid;place-items:center;width:24px;height:24px;border:1px solid var(--app-line);border-radius:6px;}
.erp-pager__btns i:first-child {transform:rotate(180deg);}
/* === 12 Processo (timeline com tracing beam) === */
.timeline {--progress:1;position:relative;display:grid;gap:2.25rem;padding-left:4rem;}
.timeline::before,.timeline::after {content:"";position:absolute;left:1.25rem;top:1.25rem;bottom:1.25rem;width:1px;background:var(--line-strong);}
.timeline::after {background:linear-gradient(var(--em-300),var(--em-500));transform:scaleY(var(--progress));transform-origin:top;}
.timeline__step {position:relative;}
.timeline__step p {margin-top:.4rem;max-width:34rem;color:var(--text-2);}
.timeline__num {--c:8px;position:absolute;left:-4rem;top:-.3rem;z-index:1;display:grid;place-items:center;width:2.5rem;height:2.5rem;background:var(--surface-3);color:var(--text-2);font-family:var(--font-mono);font-size:.75rem;clip-path:polygon(var(--c) 0,calc(100% - var(--c)) 0,100% var(--c),100% calc(100% - var(--c)),calc(100% - var(--c)) 100%,var(--c) 100%,0 calc(100% - var(--c)),0 var(--c));transition:background-color .3s,color .3s;}
.timeline__step.is-current .timeline__num {background:var(--em-500);color:var(--em-950);font-weight:600;}
.timeline__step.is-current h3 {color:var(--em-300);}
/* === 13 Diferenciais === */
.pillars {display:grid;overflow:hidden;border:1px solid var(--line);border-radius:var(--r-xl);background:var(--bg);}
.pillar {display:flex;flex-direction:column;gap:.6rem;padding:clamp(1.5rem,3vw,2.5rem);}
.pillar + .pillar {border-top:1px solid var(--line);}
.pillar p {color:var(--text-2);max-width:30rem;}
@media (min-width:800px) {
  .pillars {grid-template-columns:1fr 1fr;}
  .pillar:nth-child(2) {border-top:0;}
  .pillar:nth-child(even) {border-left:1px solid var(--line);}
}
.mv {display:flex;flex-direction:column;justify-content:center;gap:.4rem;min-height:96px;margin-bottom:1rem;}
.mv-diff span {overflow:hidden;padding:.3rem .6rem;border-radius:var(--r-sm);font-family:var(--font-mono);font-size:.75rem;white-space:nowrap;text-overflow:ellipsis;}
.mv-diff__del {background:rgb(248 113 113 / .08);color:#fca5a5;}
.mv-diff__add {background:rgb(16 185 129 / .1);color:var(--em-300);}
.mv-weight__track {height:10px;overflow:hidden;border-radius:var(--r-pill);background:var(--surface-3);}
.mv-weight__fill {display:block;width:12%;height:100%;border-radius:inherit;background:var(--em-500);}
.mv-weight__legend {display:flex;justify-content:space-between;gap:1rem;color:var(--text-2);font-size:.8125rem;}
.mv-weight__legend strong {color:var(--em-300);font-family:var(--font-mono);font-weight:500;}
.mv-layers span {--c:6px;padding:.35rem .7rem;background:var(--surface-2);color:var(--text-2);font-family:var(--font-mono);font-size:.75rem;clip-path:polygon(var(--c) 0,100% 0,100% calc(100% - var(--c)),calc(100% - var(--c)) 100%,0 100%,0 var(--c));}
.mv-layers span:nth-child(2) {margin-left:1rem;}
.mv-layers span:nth-child(3) {margin-left:2rem;background:#102019;color:var(--em-300);}
.mv-chat span {max-width:85%;padding:.45rem .75rem;border-radius:12px;font-size:.8125rem;}
.mv-chat__in {align-self:flex-start;border-bottom-left-radius:4px;background:var(--surface-3);}
.mv-chat__out {align-self:flex-end;border-bottom-right-radius:4px;background:#103a2a;color:#d1fae5;}
/* === 14 FAQ === */
.faq {border-top:1px solid var(--line);}
.faq details {border-bottom:1px solid var(--line);}
.faq summary {display:flex;align-items:center;justify-content:space-between;gap:1rem;min-height:64px;padding:1rem 0;font-weight:500;font-size:1.0625rem;list-style:none;cursor:pointer;}
.faq summary::-webkit-details-marker {display:none;}
.faq summary::after {content:"";flex:none;width:12px;height:12px;background:linear-gradient(currentColor,currentColor) center / 12px 1.5px no-repeat,linear-gradient(currentColor,currentColor) center / 1.5px 12px no-repeat;color:var(--text-2);transition:transform .25s var(--ease-out);}
.faq details[open] summary::after {transform:rotate(45deg);color:var(--em-300);}
.faq summary:hover {color:var(--em-300);}
.faq details p {padding:0 2rem 1.25rem 0;color:var(--text-2);}
/* === 15 CTA === */
.cta {position:relative;isolation:isolate;overflow:hidden;padding:clamp(2.5rem,7vw,5rem) clamp(1.25rem,5vw,4rem);border-radius:calc(var(--r-xl) + 4px);background:var(--surface-1);box-shadow:inset 0 0 0 1px var(--line);text-align:center;}
.cta::after {content:"";position:absolute;inset:0;z-index:-1;background:radial-gradient(50% 60% at 50% 0%,rgb(16 185 129 / .14),transparent 70%),linear-gradient(var(--line) 1px,transparent 1px) 0 0 / 48px 48px,linear-gradient(90deg,var(--line) 1px,transparent 1px) 0 0 / 48px 48px;-webkit-mask-image:radial-gradient(ellipse 80% 80% at 50% 0%,#000 30%,transparent 85%);mask-image:radial-gradient(ellipse 80% 80% at 50% 0%,#000 30%,transparent 85%);}
.cta h2 {max-width:20ch;margin-inline:auto;}
.cta .lede {margin-inline:auto;}
.cta__actions {display:flex;flex-wrap:wrap;justify-content:center;gap:.75rem;margin-top:2rem;}
.cta__facts {display:flex;flex-wrap:wrap;justify-content:center;gap:.5rem 1.5rem;margin-top:1.75rem;color:var(--text-2);font-size:.875rem;}
.cta__facts li {display:flex;align-items:center;gap:.5rem;}
.cta__facts li::before {content:"";width:6px;height:6px;background:var(--em-400);clip-path:polygon(50% 0,100% 50%,50% 100%,0 50%);}
@media (max-width:479px) {
  .cta__actions .btn {width:100%;}
  .cta__actions .btn--secondary {white-space:normal;}
}
/* === 16 Footer === */
.site-footer {padding:clamp(3.5rem,6vw,5rem) 0 2rem;border-top:1px solid var(--line);background:var(--surface-1);}
.footer__grid {display:grid;gap:2.5rem;}
@media (min-width:720px) {
  .footer__grid {grid-template-columns:1fr 1fr;}
}
@media (min-width:1024px) {.footer__grid {grid-template-columns:1.2fr .85fr 1.4fr .65fr;}}
.footer__brand img {width:auto;height:30px;}
.footer__brand p {margin-top:1rem;color:var(--text-2);}
.footer__title {margin-bottom:.75rem;font-family:var(--font-mono);font-size:.75rem;letter-spacing:.08em;text-transform:uppercase;color:var(--text-2);}
.footer__col ul {display:grid;gap:.1rem;}
.footer__col a {display:flex;align-items:center;min-height:44px;color:var(--text);text-decoration:none;overflow-wrap:anywhere;}
.footer__col a:hover {color:var(--em-300);}
.footer__legal {display:flex;flex-wrap:wrap;justify-content:space-between;gap:.5rem 2rem;margin-top:3rem;padding-top:1.5rem;border-top:1px solid var(--line);color:var(--text-2);font-family:var(--font-mono);font-size:.75rem;}
/* === 17 Páginas internas (privacidade, 404) === */
.page {padding-block:clamp(3rem,8vw,6rem);}
.prose {max-width:44rem;}
.prose h1 {font-size:clamp(2rem,1.4rem + 2.5vw,3rem);line-height:1.1;letter-spacing:-.03em;}
.prose h2 {margin-top:2.5rem;font-size:1.375rem;}
.prose p,.prose ul {margin-top:1rem;color:var(--text-2);}
.prose ul {padding-left:1.25rem;list-style:disc;}
.prose li + li {margin-top:.4rem;}
.prose a {color:var(--em-300);}
.prose strong {color:var(--text);font-weight:600;}
.prose .meta {margin-top:.75rem;font-family:var(--font-mono);font-size:.75rem;}
.not-found {display:grid;place-items:center;min-height:calc(100vh - var(--header-h) - 14rem);padding-block:4rem;text-align:center;}
.not-found__code {font-family:var(--font-mono);font-size:.875rem;color:var(--em-300);letter-spacing:.1em;}
.not-found h1 {margin-top:1rem;font-size:clamp(2rem,1.4rem + 3vw,3.5rem);letter-spacing:-.035em;line-height:1.05;}
.not-found p {margin-top:1rem;color:var(--text-2);}
.not-found .btn {margin-top:2rem;}
.nav__back {display:inline-flex;align-items:center;min-height:44px;padding:0 .8rem;border-radius:var(--r-md);color:var(--text-2);font-size:.9375rem;text-decoration:none;}
.nav__back:hover {color:var(--text);background:rgb(255 255 255 / .05);}
/* === 18 Animações e reveal === */
.js .reveal {opacity:0;transform:translateY(14px);filter:blur(6px);transition:opacity .7s var(--ease-out) var(--d,0ms),transform .7s var(--ease-out) var(--d,0ms),filter .7s var(--ease-out) var(--d,0ms);}
.js .reveal.is-in {opacity:1;transform:none;filter:none;}
.brand {min-height:44px;align-items:center;}
@media (max-width:479px) {
  .compare__switch {width:100%;}
  .compare__btn {flex:1;padding-inline:.4rem;font-size:.8125rem;}
}
.d1 {--d:90ms;}
.d2 {--d:180ms;}
@keyframes pulse {
  0% {box-shadow:0 0 0 0 rgb(16 185 129 / .55);}
  70%,100% {box-shadow:0 0 0 8px rgb(16 185 129 / 0);}
}
@keyframes beam-spin {
  to {--beam:360deg;}
}
@keyframes rise {
  from {opacity:0;transform:translateY(28px) scale(.985);}
}
@keyframes draw {
  from {stroke-dashoffset:1;}
}
@keyframes slide-in {
  from {opacity:0;transform:translateX(10px);}
}
@keyframes blink {
  50% {opacity:0;}
}
@keyframes flow {
  to {stroke-dashoffset:0;}
}
/* === 19 Movimento reduzido === */
@media (prefers-reduced-motion:reduce) {
  *,*::before,*::after {animation-duration:.01ms !important;animation-iteration-count:1 !important;animation-delay:0s !important;transition-duration:.01ms !important;transition-delay:0s !important;}
  .js .reveal {opacity:1;transform:none;filter:none;}
  .js .reveal:not(.is-in) .bars rect {transform:none;}
  .beam::before {animation:none;background:var(--line-strong);}
  .badge__dot {animation:none;}
  .flow__beam {display:none;}
  .tilt {transform:none;}
}