/* VERTEX OSS W360 · Acesso por Corda / Rope Access — estilo compartilhado PT/EN (mockup 26/09) */
@font-face{font-family:'Unbounded';font-weight:400;font-display:swap;src:url(/fonts/unbounded-latin-400-normal.woff2) format('woff2')}
@font-face{font-family:'Unbounded';font-weight:500;font-display:swap;src:url(/fonts/unbounded-latin-500-normal.woff2) format('woff2')}
@font-face{font-family:'Unbounded';font-weight:700;font-display:swap;src:url(/fonts/unbounded-latin-700-normal.woff2) format('woff2')}
@font-face{font-family:'Instrument Sans';font-weight:400;font-display:swap;src:url(/fonts/instrument-sans-latin-400-normal.woff2) format('woff2')}
@font-face{font-family:'Instrument Sans';font-weight:500;font-display:swap;src:url(/fonts/instrument-sans-latin-500-normal.woff2) format('woff2')}
@font-face{font-family:'Instrument Sans';font-weight:600;font-display:swap;src:url(/fonts/instrument-sans-latin-600-normal.woff2) format('woff2')}
@font-face{font-family:'JetBrains Mono';font-weight:400;font-display:swap;src:url(/fonts/jetbrains-mono-latin-400-normal.woff2) format('woff2')}
@font-face{font-family:'JetBrains Mono';font-weight:500;font-display:swap;src:url(/fonts/jetbrains-mono-latin-500-normal.woff2) format('woff2')}
:root{--ink:#050914;--line:#1B2640;--line-2:#2A3656;--cyan:#3FC8FF;--violet:#7B5CFF;--violet-hi:#A992FF;--text:#EEF2FA;--muted:#9AA6BF;--dim:#65708A;--warn:#F2B84B;--f-display:"Unbounded","Arial Black",system-ui,sans-serif;--f-body:"Instrument Sans",system-ui,-apple-system,"Segoe UI",sans-serif;--f-mono:"JetBrains Mono",ui-monospace,Menlo,monospace}
*{box-sizing:border-box}
html{scroll-behavior:smooth;scroll-padding-top:80px}
body{margin:0;background:var(--ink);color:var(--text);font:400 16px/1.6 var(--f-body);-webkit-font-smoothing:antialiased;overflow-x:hidden}
img{max-width:100%;display:block}
a{color:inherit}
h1,h2,h3{margin:0;font-family:var(--f-display);font-weight:500;line-height:1.12;letter-spacing:-.01em}
h3{font-family:var(--f-body);font-weight:600;letter-spacing:0}
p,ul,ol{margin:0}
ul,ol{padding:0;list-style:none}
.wrap{width:min(1200px,100% - 32px);margin-inline:auto}
.mono{font-family:var(--f-mono);font-size:11px;letter-spacing:.14em;text-transform:uppercase}
.grad{background:linear-gradient(90deg,#3FC8FF,#5B8CFF 40%,#8B5CFF 75%,#3FC8FF);background-size:250% 100%;-webkit-background-clip:text;background-clip:text;color:transparent;animation:gradShift 7s ease-in-out infinite}
h1 .grad,h2 .grad{display:block}
@keyframes gradShift{0%,100%{background-position:0 0}50%{background-position:100% 0}}
.eyebrow{display:flex;align-items:center;gap:14px;font:500 11.5px/1 var(--f-mono);letter-spacing:.24em;text-transform:uppercase;color:var(--cyan)}
.eyebrow::before{content:"";width:22px;height:2px;border-radius:2px;background:currentColor;box-shadow:0 0 8px currentColor}
section{position:relative;padding-block:clamp(56px,6.5vw,88px);border-bottom:1px solid var(--line);isolation:isolate;overflow:hidden}
.sec-head{display:grid;gap:16px;max-width:900px;margin-bottom:clamp(30px,4vw,48px)}
.sec-head h2{font-size:clamp(26px,3.2vw,40px)}
.lead{color:#C4CCDD;font-size:clamp(15.5px,1.3vw,17.5px);max-width:58ch}
.glass{border:1px solid rgba(90,140,255,.28);border-radius:14px;background:linear-gradient(155deg,rgba(18,30,62,.72),rgba(7,12,28,.7));backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);box-shadow:0 10px 30px rgba(0,0,0,.35),inset 0 1px 0 rgba(255,255,255,.06)}
svg{fill:none;stroke:currentColor;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}
.ring{display:grid;place-items:center;width:44px;height:44px;flex:none;border-radius:50%;border:1px solid rgba(63,200,255,.45);color:#8FB4FF;background:radial-gradient(circle,rgba(47,107,255,.25),transparent 70%);box-shadow:0 0 16px rgba(63,200,255,.2)}
.ring svg{width:22px;height:22px}
/* botões */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;font:600 14.5px/1.2 var(--f-body);padding:15px 22px;border-radius:10px;text-decoration:none;border:1px solid transparent;cursor:pointer;transition:transform .25s,box-shadow .25s,border-color .25s;text-align:center}
.btn .ar{width:16px;height:16px;transition:transform .25s}
.btn:hover .ar{transform:translateX(4px)}
.btn-primary{position:relative;overflow:hidden;background:linear-gradient(95deg,#2F6BFF,#4B5BFF 55%,#7B4CFF);color:#fff;border-color:rgba(120,170,255,.6);box-shadow:0 0 0 1px rgba(63,200,255,.25),0 10px 30px rgba(47,107,255,.45)}
.btn-primary::after{content:"";position:absolute;inset:0;background:linear-gradient(110deg,transparent 30%,rgba(255,255,255,.45) 50%,transparent 70%);transform:translateX(-120%);animation:btnShine 3.6s ease-in-out infinite}
@keyframes btnShine{0%,55%{transform:translateX(-120%)}100%{transform:translateX(120%)}}
.btn-primary:hover{transform:translateY(-2px);box-shadow:0 0 0 1px rgba(63,200,255,.5),0 16px 40px rgba(47,107,255,.65)}
.btn-ghost,.btn-line{border-color:rgba(200,215,255,.45);color:var(--text);background:rgba(6,10,24,.55);backdrop-filter:blur(6px)}
.btn-ghost:hover,.btn-line:hover{border-color:var(--cyan);box-shadow:0 0 22px rgba(63,200,255,.3)}
.btn-line{border-color:rgba(123,92,255,.8);box-shadow:0 0 16px rgba(123,92,255,.3);padding:11px 16px;font-size:13px}
.cta-row{display:flex;flex-wrap:wrap;gap:14px}
/* header */
.nav{position:sticky;top:0;z-index:50;background:rgba(5,9,20,.78);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);border-bottom:1px solid var(--line)}
.nav .wrap{display:flex;align-items:center;gap:22px;height:68px}
.brand{display:flex;align-items:center;gap:12px;text-decoration:none;white-space:nowrap}
.wm-v{font:400 24px/1 var(--f-display);letter-spacing:.12em;color:#fff}
.wm-o{font:500 15px/1 var(--f-body);letter-spacing:.06em;color:#DDE4F2}
.wm-w{font:600 15px/1 var(--f-body);letter-spacing:.04em;color:var(--cyan)}
.wm-sep{width:1px;height:20px;background:rgba(200,215,255,.45)}
.nav-links{display:flex;gap:24px;margin-left:auto;font-size:14px;white-space:nowrap}
.nav-links a{text-decoration:none;color:#C9D2E4;transition:color .2s}
.nav-links a:hover{color:#fff}
.lang{display:inline-flex;align-items:center;padding:3px;border-radius:999px;border:1px solid rgba(169,146,255,.35);background:rgba(14,18,34,.6);backdrop-filter:blur(8px);font:500 12px/1 var(--f-mono);letter-spacing:.1em}
.lang a,.lang span{padding:7px 11px;border-radius:999px;text-decoration:none;color:var(--muted);transition:color .2s,box-shadow .2s}
.lang a:hover{color:#fff;box-shadow:0 0 16px rgba(63,200,255,.35)}
.lang [aria-current]{color:#04121C;background:linear-gradient(90deg,#3FC8FF,#8BE3FF);box-shadow:0 0 14px rgba(63,200,255,.5)}
@media (max-width:1120px){.nav-links{display:none}.lang{margin-left:auto}}
@media (max-width:640px){.nav .btn-line{display:none}.wm-v{font-size:19px}.brand{gap:9px}}
/* entrada */
.rv{opacity:0;transform:translateY(26px);transition:opacity .8s cubic-bezier(.2,.8,.2,1),transform .8s cubic-bezier(.2,.8,.2,1);transition-delay:calc(var(--k,0) * .12s)}
.rv.in{opacity:1;transform:none}
/* HERO */
.hero{padding-block:0;min-height:min(calc(100svh - 68px),760px);display:grid}
.hero-sky{position:absolute;inset:0;z-index:-2;background:url(/img/hero-offshore.webp) 40% 60%/cover no-repeat;animation:kenburns 26s ease-in-out infinite alternate}
.hero-sky::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(5,9,20,.97) 0%,rgba(5,9,20,.9) 42%,rgba(5,9,20,.35) 64%,rgba(5,9,20,.55) 100%),linear-gradient(180deg,rgba(5,9,20,.4),transparent 25%,transparent 75%,var(--ink))}
@keyframes kenburns{from{transform:scale(1)}to{transform:scale(1.08) translate(-1%,1%)}}
.hero-grid{display:grid;grid-template-columns:minmax(0,1.05fr) minmax(0,1fr);gap:20px;align-items:center}
.hero-copy{padding-block:56px}
.hero h1{font-size:clamp(30px,3.8vw,50px);font-weight:700;line-height:1.08}
.hero .lead{margin-top:22px}
.hero .cta-row{margin-top:30px}
.feats{display:flex;flex-wrap:wrap;gap:18px 30px;margin-top:40px;font-size:13.5px;color:#C9D2E4;line-height:1.35}
.feats li{display:flex;align-items:center;gap:12px}
.hero-art{position:relative;align-self:stretch;min-height:520px}
.photo{position:relative}
.hero-art .photo{position:absolute;right:22%;top:0;bottom:0;aspect-ratio:1011/1555;height:100%;max-width:none;-webkit-mask-image:linear-gradient(90deg,transparent 0,#000 18%,#000 88%,transparent),linear-gradient(180deg,#000 85%,transparent);-webkit-mask-composite:source-in;mask-image:linear-gradient(90deg,transparent 0,#000 18%,#000 88%,transparent),linear-gradient(180deg,#000 85%,transparent);mask-composite:intersect}
.photo img{width:100%;height:100%;object-fit:cover}
.hero-art .photo img{animation:breathe 9s ease-in-out infinite}
@keyframes breathe{0%,100%{transform:scale(1)}50%{transform:scale(1.025)}}
.node{position:absolute;width:26px;height:26px;margin:-13px;border-radius:50%;background:radial-gradient(circle,#fff 0 14%,rgba(160,120,255,.9) 26%,rgba(90,110,255,0) 70%);mix-blend-mode:screen;pointer-events:none;animation:nodeGlow 2.8s ease-in-out infinite var(--d,0s)}
.node::after{content:"";position:absolute;inset:-10px;border-radius:50%;border:1.5px solid rgba(120,180,255,.8);animation:ping 2.8s ease-out infinite var(--d,0s)}
@keyframes nodeGlow{0%,100%{opacity:.55;transform:scale(.85)}50%{opacity:1;transform:scale(1.15)}}
@keyframes ping{from{transform:scale(.6);opacity:.9}to{transform:scale(2.1);opacity:0}}
.glint{position:absolute;left:56.4%;top:0;width:3px;height:70px;border-radius:3px;background:linear-gradient(180deg,transparent,#fff,transparent);box-shadow:0 0 14px #FFB86B;opacity:.8;animation:glint 3.6s linear infinite;mix-blend-mode:screen}
@keyframes glint{from{top:-12%}to{top:100%}}
.hud{position:absolute;right:0;top:6%;width:clamp(150px,15vw,190px);padding:12px;border-color:rgba(90,160,255,.5);box-shadow:0 0 28px rgba(63,200,255,.25),inset 0 0 20px rgba(63,200,255,.08);animation:hudFloat 6s ease-in-out infinite}
@keyframes hudFloat{0%,100%{transform:translateY(0)}50%{transform:translateY(-8px)}}
.hud-top{display:flex;justify-content:space-between;align-items:flex-start;gap:6px;color:#CFE0FF}
.hud-top img{height:74px;width:auto;filter:grayscale(1) brightness(1.3) sepia(1) hue-rotate(185deg) saturate(4.5);mix-blend-mode:screen;opacity:.9}
.hud ul{display:grid;gap:7px;margin-top:6px}
.hud li{display:grid;gap:4px;color:#AFC3E8}
.hud li .mono{font-size:9.5px}
.hud li i{display:block;height:3px;border-radius:3px;background:linear-gradient(90deg,#3FC8FF,#7B5CFF);transform-origin:left;transform:scaleX(var(--w));animation:hudBar 3.2s ease-in-out infinite var(--d)}
@keyframes hudBar{0%,100%{transform:scaleX(var(--w))}50%{transform:scaleX(calc(var(--w) * .8))}}
.wave{width:100%;height:42px;margin-top:10px;border-top:1px solid rgba(90,160,255,.25)}
.wave path{stroke:#6FB6FF;stroke-width:1.3;opacity:.45}
.wave path.run{opacity:1;stroke:#BFE6FF;stroke-width:1.8;stroke-dasharray:70 360;animation:wave 2.6s linear infinite;filter:drop-shadow(0 0 4px #3FC8FF)}
@keyframes wave{from{stroke-dashoffset:430}to{stroke-dashoffset:0}}
@media (max-width:900px){.hero-grid{grid-template-columns:1fr}.hero-copy{padding-block:40px 8px}.hero-art{min-height:440px;margin-bottom:24px}.hero-art .photo{right:auto;left:50%;transform:translateX(-58%)}.hud{top:auto;bottom:6%;right:0}}
/* LACUNA */
.gap3{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px}
.gcard{position:relative;overflow:hidden;display:flex;gap:18px;align-items:flex-start;padding:26px 24px;transition:transform .35s,box-shadow .35s}
.gcard .gi{width:46px;height:46px;flex:none;color:#7FA8FF;stroke-width:1.3}
.gcard h3{font-size:18px;margin-bottom:8px}
.gcard p{color:var(--muted);font-size:15px}
.gcard:hover{transform:translateY(-4px)}
.gcard.vx{border:1px solid transparent;background:linear-gradient(155deg,rgba(40,30,110,.85),rgba(12,14,40,.85)) padding-box,linear-gradient(130deg,#3FC8FF,#7B5CFF,#B06CFF) border-box;box-shadow:0 0 40px rgba(123,92,255,.45)}
.gcard.vx.in{transform:scale(1.03)}
.gcard.vx .gi{color:#B9A6FF;filter:drop-shadow(0 0 8px #7B5CFF)}
.gcard.vx p{color:#DCE2F5}
.gcard.vx::after{content:"";position:absolute;inset:0;border-radius:inherit;background:linear-gradient(115deg,transparent 35%,rgba(255,255,255,.12) 50%,transparent 65%);background-size:250% 100%;animation:sheen 4s ease-in-out infinite;pointer-events:none}
@keyframes sheen{0%{background-position:120% 0}60%,100%{background-position:-120% 0}}
.bracket{position:relative;margin:36px auto 0;max-width:560px;text-align:center;font:500 clamp(16px,1.6vw,19px)/1.4 var(--f-body)}
.bracket::before{content:"";position:absolute;left:0;right:0;top:-14px;height:14px;border:1px solid rgba(123,160,255,.45);border-top:0;border-radius:0 0 4px 4px}
.bracket span{position:relative;padding-inline:14px;background:var(--ink)}
.bracket b{font-weight:700;display:inline}
@media (max-width:900px){.gap3{grid-template-columns:1fr}.gcard.vx.in{transform:none}}
/* POR QUE IMPORTA */
.why-bg{position:absolute;inset:0;z-index:-2;background:url(/img/hero-offshore.webp) 70% 40%/cover no-repeat;opacity:.35;filter:saturate(.8)}
.why-bg::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,var(--ink) 5%,rgba(5,9,20,.7) 45%,rgba(5,9,20,.75) 100%)}
.why-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,.8fr) minmax(0,.85fr);gap:24px;align-items:center}
.why-copy .sec-head{margin-bottom:22px}
.why-art .photo{aspect-ratio:980/1130;-webkit-mask-image:radial-gradient(50% 50% at 45% 50%,#000 55%,transparent 100%);mask-image:radial-gradient(50% 50% at 45% 50%,#000 55%,transparent 100%)}
.dcards{display:grid;gap:12px}
.dcards li{position:relative;display:flex;gap:14px;align-items:center;padding:14px 16px;transition:transform .35s,border-color .35s,box-shadow .35s,opacity .8s}
.dcards li.on{transform:translateX(-6px);border-color:rgba(123,92,255,.9);box-shadow:0 0 26px rgba(123,92,255,.4)}
.dcards h3{font-size:15px;color:#fff}
.dcards p{color:var(--muted);font-size:13.5px;line-height:1.4}
.dcards .wire{position:absolute;right:100%;top:50%;width:46px;height:1px;background:repeating-linear-gradient(90deg,rgba(123,160,255,.7) 0 4px,transparent 4px 8px)}
.dcards .wire::after{content:"";position:absolute;left:0;top:-3px;width:7px;height:7px;border-radius:50%;background:#A992FF;box-shadow:0 0 10px #7B5CFF;animation:wireRun 2.4s linear infinite}
.dcards li:nth-child(2) .wire::after{animation-delay:.6s}.dcards li:nth-child(3) .wire::after{animation-delay:1.2s}.dcards li:nth-child(4) .wire::after{animation-delay:1.8s}
@keyframes wireRun{from{left:0;opacity:0}20%{opacity:1}to{left:100%;opacity:0}}
@media (max-width:1000px){.why-grid{grid-template-columns:1fr 1fr}.why-copy{grid-column:1/-1}.dcards .wire{display:none}}
@media (max-width:640px){.why-grid{grid-template-columns:1fr}.why-art{max-width:340px;margin-inline:auto}}
/* COMO FUNCIONA */
.steps{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:34px}
.steps li{position:relative;display:flex;gap:14px;align-items:flex-start;padding:22px 18px;transition:transform .35s,box-shadow .35s,border-color .35s,opacity .8s}
.steps li:not(:last-child)::after{content:"→";position:absolute;right:-26px;top:50%;transform:translateY(-50%);color:#8FB4FF;font-size:20px;animation:nudge 1.6s ease-in-out infinite}
@keyframes nudge{50%{transform:translate(5px,-50%)}}
.steps .si{width:40px;height:40px;flex:none;color:#8FA8FF;stroke-width:1.4}
.steps .num{font:500 15px/1 var(--f-mono);color:var(--cyan)}
.steps h3{font-size:15px;margin:8px 0;line-height:1.3}
.steps p{color:var(--muted);font-size:13.5px;line-height:1.45}
.steps li.on{transform:translateY(-6px);border-color:rgba(63,200,255,.8);box-shadow:0 0 30px rgba(63,200,255,.3)}
.tagline{margin-top:34px;text-align:center;font:500 clamp(17px,1.7vw,21px)/1.4 var(--f-body)}
.tagline b{display:inline;font-weight:700}
@media (max-width:1000px){.steps{grid-template-columns:1fr 1fr;gap:18px}.steps li::after{display:none}}
@media (max-width:560px){.steps{grid-template-columns:1fr}}
/* MÓDULOS */
.mods{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px}
.mod{padding:26px;display:grid;gap:14px;align-content:start}
.mod h3{font:700 20px/1 var(--f-display);letter-spacing:.02em}
.mod p{color:var(--muted);font-size:14.5px}
.mod.hot{border-color:rgba(63,200,255,.55);box-shadow:0 0 36px rgba(63,200,255,.2)}
.mod .status{display:inline-flex;align-items:center;gap:10px;justify-self:start;padding:9px 14px;border-radius:999px;border:1px solid rgba(242,184,75,.6);color:var(--warn);font:500 11.5px/1 var(--f-mono);letter-spacing:.14em;box-shadow:0 0 20px rgba(242,184,75,.22)}
.status i{width:8px;height:8px;border-radius:50%;background:var(--warn);animation:blink 1.4s ease-in-out infinite}
@keyframes blink{50%{opacity:.25}}
.mod .never{padding:10px 12px;border-radius:10px;border:1px dashed rgba(255,120,135,.4);color:#FFC0C7;font-size:13px}
.trend{width:100%;height:60px}
.trend .base{stroke:#2A3656;stroke-dasharray:5 6}
.trend .ln{stroke:#7B9BFF;stroke-width:2.5;stroke-dasharray:320;stroke-dashoffset:320;filter:drop-shadow(0 0 4px #5B8CFF)}
.mod.in .trend .ln{animation:draw 2.2s ease .3s forwards}
@keyframes draw{to{stroke-dashoffset:0}}
.trp{display:flex;flex-wrap:wrap;gap:8px}
.chip{padding:8px 11px;border-radius:8px;border:1px solid var(--line-2);font:500 11px/1 var(--f-mono);letter-spacing:.1em;text-transform:uppercase;color:var(--muted);transition:all .35s}
.chip.on{color:#fff;border-color:var(--cyan);background:rgba(63,200,255,.12);box-shadow:0 0 16px rgba(63,200,255,.35)}
@media (max-width:900px){.mods{grid-template-columns:1fr}}
/* PARA QUEM É */
.cards4{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px}
.cards4 article{padding:24px;display:grid;gap:12px;align-content:start;transition:transform .25s ease-out,box-shadow .3s,opacity .8s}
.cards4 h3{font-size:16px}
.cards4 p{color:var(--muted);font-size:14px}
@media (max-width:1000px){.cards4{grid-template-columns:1fr 1fr}}
@media (max-width:560px){.cards4{grid-template-columns:1fr}}
.tilt:hover{box-shadow:0 20px 40px rgba(0,0,0,.45),0 0 36px rgba(63,200,255,.25)}
/* RESULTADOS + CTA */
.res-bg{position:absolute;inset:0;z-index:-2;background:url(/img/hero-offshore.webp) 80% 50%/cover no-repeat;opacity:.55;animation:kenburns 30s ease-in-out infinite alternate}
.res-bg::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,var(--ink) 20%,rgba(5,9,20,.55) 70%,rgba(5,9,20,.4)),linear-gradient(180deg,var(--ink),transparent 30%,transparent 70%,var(--ink))}
.res h2{font-size:clamp(26px,3.2vw,40px)}
.res3{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px}
.res3 article{display:flex;gap:18px;align-items:flex-start;padding:22px;transition:transform .25s ease-out,box-shadow .3s,opacity .8s}
.res3 .ri{width:40px;height:40px;flex:none;color:#8FA8FF;stroke-width:1.4}
.res3 h3{font-size:15.5px;margin-bottom:6px}
.res3 p{color:var(--muted);font-size:14px}
.band{margin-top:40px;display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:24px;padding:30px 34px;border:1px solid transparent;background:linear-gradient(155deg,rgba(14,24,56,.88),rgba(6,10,26,.88)) padding-box,linear-gradient(120deg,rgba(63,200,255,.8),rgba(123,92,255,.8),rgba(63,200,255,.3)) border-box;box-shadow:0 0 50px rgba(47,107,255,.25)}
.band h2{font:600 clamp(19px,1.9vw,23px)/1.3 var(--f-body);max-width:26ch}
.band p{color:var(--muted);font-size:14px;margin-top:10px;max-width:62ch}
@media (max-width:900px){.res3{grid-template-columns:1fr}.band{padding:24px}}
/* AUTORIDADE */
.auth{display:grid;grid-template-columns:220px minmax(0,1fr);gap:34px;padding:30px;position:relative;overflow:hidden;border-radius:16px;border:1px solid transparent;background:linear-gradient(150deg,rgba(20,30,64,.8),rgba(7,10,24,.75)) padding-box,linear-gradient(120deg,#3FC8FF,#7B5CFF,#B06CFF) border-box;box-shadow:0 0 40px rgba(123,92,255,.2)}
.auth::after{content:"";position:absolute;left:0;bottom:0;height:2px;width:30%;background:linear-gradient(90deg,transparent,#3FC8FF,transparent);animation:edge 5s linear infinite}
@keyframes edge{from{left:-30%}to{left:100%}}
.avatar{width:220px;height:275px;border-radius:14px;overflow:hidden;display:grid;place-items:center;background:radial-gradient(circle at 30% 25%,#26336A,#0B1026 70%);border:1px solid rgba(169,146,255,.4);font:700 56px/1 var(--f-display);color:#C9BCFF}
.avatar img{width:100%;height:100%;object-fit:cover;object-position:50% 18%}
.auth h3{font:500 clamp(22px,2.2vw,28px)/1.1 var(--f-display)}
.auth .role{color:var(--cyan);font-weight:600;margin-top:8px}
.auth .cref{font:500 12px/1 var(--f-mono);letter-spacing:.12em;color:var(--violet-hi);margin-top:10px}
.auth .sum{color:var(--muted);margin-top:14px;max-width:70ch}
.auth ul{margin-top:16px;display:grid;grid-template-columns:1fr 1fr;gap:6px 22px;font-size:14px;color:#DCE4FF}
.auth li::before{content:"";display:inline-block;width:6px;height:6px;border-radius:50%;background:#3FC8FF;box-shadow:0 0 8px #3FC8FF;margin-right:10px;vertical-align:2px}
.social{display:flex;gap:10px;margin-top:20px;flex-wrap:wrap}
.social a{display:inline-flex;align-items:center;gap:8px;padding:9px 14px;border-radius:999px;border:1px solid rgba(169,146,255,.35);background:rgba(14,18,34,.55);backdrop-filter:blur(6px);text-decoration:none;font-size:13.5px;color:#DCE4FF;transition:box-shadow .25s,border-color .25s}
.social a:hover{border-color:var(--cyan);box-shadow:0 0 18px rgba(63,200,255,.35)}
.social svg{width:17px;height:17px}
@media (max-width:760px){.auth{grid-template-columns:1fr;padding:22px}.avatar{width:100%;height:220px}.auth ul{grid-template-columns:1fr}}
/* a11y */
.skip{position:absolute;left:-9999px;top:8px;z-index:100;padding:10px 14px;border-radius:10px;background:#fff;color:#000}
.skip:focus{left:16px}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
:focus-visible{outline:2px solid var(--cyan);outline-offset:3px}
/* FOOTER */
footer{padding-block:36px 48px}
.foot{display:grid;grid-template-columns:auto 1fr;gap:14px 40px;align-items:center}
.fbrand{flex-direction:column;align-items:flex-start;gap:6px}
.fbrand small{font:500 12px/1 var(--f-body);color:#8C98B2;letter-spacing:.1em}
.flinks{display:flex;flex-wrap:wrap;gap:8px 26px;font-size:14px}
.flinks a{text-decoration:none;color:#C9D2E4}
.flinks a:hover{color:#fff}
.flinks .fsoc{display:inline-flex;align-items:center;gap:6px}
.flinks svg{width:15px;height:15px}
.fmicro,.fcopy{grid-column:1/-1}
.fmicro{color:var(--dim);font-size:13px;max-width:95ch}
.fcopy{font:400 11px/1.6 var(--f-mono);color:var(--dim);letter-spacing:.08em}
@media (max-width:700px){.foot{grid-template-columns:1fr}}
@media (prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition:none!important}.rv{opacity:1;transform:none}.trend .ln{stroke-dashoffset:0}}

/* cards: surgem com zoom; no mouse trocam de cor, sobem e ganham luz (rope.js põe o .fx-spot) */
.zc{position:relative}
.zc.rv{opacity:0;transform:none}
.zc.rv.in{opacity:1;animation:zin .95s cubic-bezier(.2,.8,.2,1) backwards;animation-delay:calc(var(--k,0) * .13s);transition:transform .4s cubic-bezier(.2,.8,.2,1),box-shadow .4s,border-color .4s,background .4s}
@keyframes zin{from{opacity:0;transform:scale(.8) translateY(26px);filter:blur(8px)}60%{opacity:1;transform:scale(1.03);filter:blur(0)}to{opacity:1;transform:none;filter:none}}
.zc.in:hover,.zc.in.on{transform:translateY(-8px) scale(1.04);border-color:rgba(169,146,255,.95);background:linear-gradient(155deg,rgba(62,36,150,.88),rgba(16,14,44,.9));box-shadow:0 0 0 1px rgba(63,200,255,.25),0 22px 50px rgba(0,0,0,.45),0 0 44px rgba(123,92,255,.5);z-index:2}
.zc.in:hover svg,.zc.in.on svg{color:#fff;filter:drop-shadow(0 0 8px #8B6CFF)}
.zc .ring,.zc svg{transition:transform .4s,color .4s,filter .4s,border-color .4s,box-shadow .4s}
.zc.in:hover .ring,.zc.in.on .ring{border-color:#B9A6FF;box-shadow:0 0 22px rgba(169,146,255,.6);transform:scale(1.12) rotate(-6deg)}
.zc.in:hover h3,.zc.in.on h3{color:#fff}
.fx-spot{position:absolute;inset:0;border-radius:inherit;overflow:hidden;pointer-events:none;mix-blend-mode:screen;opacity:0;transition:opacity .35s;background:radial-gradient(240px circle at var(--mx,50%) var(--my,50%),rgba(120,160,255,.28),transparent 65%)}
.fx-spot::after{content:"";position:absolute;top:0;bottom:0;left:-60%;width:45%;background:linear-gradient(105deg,transparent,rgba(255,255,255,.22),transparent);transform:skewX(-18deg)}
.zc.in:hover .fx-spot,.zc.in.on .fx-spot{opacity:1}
.zc.in:hover .fx-spot::after,.zc.in.on .fx-spot::after{animation:sweep 1.1s cubic-bezier(.3,.6,.2,1)}
@keyframes sweep{from{left:-60%}to{left:130%}}
/* "A lacuna": zoom discreto que passa de card em card com o brilho atravessando */
.gap3 .zc.in.on{transform:scale(1.035)}
.gap3 .gcard.vx.in.on,.gap3 .gcard.vx.in:hover{transform:scale(1.06)}
/* Resultados: cards flutuando e destaque em sequência */
.res3 .zc.in{animation:zin .95s cubic-bezier(.2,.8,.2,1) backwards,bob 5.5s ease-in-out infinite;animation-delay:calc(var(--k,0) * .13s),calc(var(--k,0) * .7s)}
@keyframes bob{50%{translate:0 -7px}}
.res3 .zc.in:hover .ri,.res3 .zc.in.on .ri{transform:scale(1.15)}
/* faixa do CTA: borda com gradiente correndo e brilho periódico */
.band.zc{background-size:100% 100%,300% 300%;animation:none}
.band.zc.in{animation:zin .95s cubic-bezier(.2,.8,.2,1) backwards,bandflow 6s linear infinite}
@keyframes bandflow{from{background-position:0 0,0% 50%}to{background-position:0 0,300% 50%}}
.band.zc.in:hover{transform:translateY(-4px) scale(1.012);border-color:transparent;background:linear-gradient(155deg,rgba(26,30,78,.92),rgba(8,12,30,.92)) padding-box,linear-gradient(120deg,rgba(63,200,255,.95),rgba(123,92,255,.95),rgba(63,200,255,.4)) border-box;background-size:100% 100%,300% 300%}
.band.zc .fx-spot{opacity:1;background:none}
.band.zc .fx-spot::after{animation:sweep 1.6s cubic-bezier(.3,.6,.2,1) infinite 1s;animation-duration:5s}
.steps li.zc.in:hover::after{color:#fff}
@media (prefers-reduced-motion:reduce){.zc.rv{opacity:1}.fx-spot::after{display:none}}

/* fundo suave em seções alternadas: aurora desfocada que se move devagar + trama de pontos quase imperceptível */
.soft-bg::before{content:"";position:absolute;inset:-10%;z-index:-1;pointer-events:none;background:radial-gradient(closest-side,rgba(47,107,255,.34),transparent),radial-gradient(closest-side,rgba(123,92,255,.3),transparent),radial-gradient(closest-side,rgba(63,200,255,.18),transparent);background-repeat:no-repeat;background-size:55% 75%,50% 70%,42% 60%;filter:blur(28px);animation:blobs 16s ease-in-out infinite alternate,hue 12s ease-in-out infinite alternate}
.soft-bg::after{content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;background:radial-gradient(rgba(160,185,255,.2) 1px,transparent 1.4px) 0 0/26px 26px;-webkit-mask-image:radial-gradient(60% 70% at 50% 50%,#000,transparent);mask-image:radial-gradient(60% 70% at 50% 50%,#000,transparent);animation:dots 18s linear infinite,breath 6s ease-in-out infinite}
@keyframes blobs{0%{background-position:5% 15%,95% 85%,50% 0%}33%{background-position:40% 75%,62% 10%,92% 60%}66%{background-position:82% 30%,18% 62%,8% 92%}100%{background-position:28% 8%,86% 42%,60% 100%}}
@keyframes hue{to{filter:blur(28px) hue-rotate(35deg) saturate(1.2)}}
@keyframes dots{to{background-position:26px 52px}}
@keyframes breath{0%,100%{opacity:.55}50%{opacity:1}}
@media (prefers-reduced-motion:reduce){.soft-bg::before,.soft-bg::after{animation:none}}

/* Liderança técnica: halo com anel girando atrás do card + card em vidro transparente e vivo */
.auth-bg::before{content:"";position:absolute;left:50%;top:56%;width:min(1100px,110%);aspect-ratio:2.2/1;transform:translate(-50%,-50%);z-index:-1;pointer-events:none;background:radial-gradient(closest-side,rgba(123,92,255,.42),rgba(47,107,255,.18) 55%,transparent);filter:blur(34px);animation:haloPulse 7s ease-in-out infinite}
@keyframes haloPulse{0%,100%{opacity:.7;transform:translate(-50%,-50%) scale(.94)}50%{opacity:1;transform:translate(-50%,-50%) scale(1.06)}}
.halo-ring{position:absolute;left:50%;top:56%;width:min(1180px,120vw);aspect-ratio:1;transform:translate(-50%,-50%);z-index:-1;pointer-events:none;border-radius:50%;background:conic-gradient(from 0deg,transparent 0 62%,rgba(63,200,255,.0) 64%,rgba(63,200,255,.75) 80%,rgba(169,146,255,.9) 84%,transparent 86%);-webkit-mask-image:radial-gradient(circle,transparent 69.6%,#000 70%,#000 70.35%,transparent 70.8%);mask-image:radial-gradient(circle,transparent 69.6%,#000 70%,#000 70.35%,transparent 70.8%);animation:ringSpin 14s linear infinite;opacity:.8}
.halo-ring::after{content:"";position:absolute;inset:0;border-radius:50%;border:1px dashed rgba(169,146,255,.18);transform:scale(.86);animation:ringSpin 60s linear infinite reverse}
@keyframes ringSpin{to{transform:translate(-50%,-50%) rotate(360deg)}}
.halo-ring::after{animation-name:ringSpin2}
@keyframes ringSpin2{from{transform:scale(.86) rotate(0)}to{transform:scale(.86) rotate(-360deg)}}
.auth{background:linear-gradient(150deg,rgba(40,52,120,.34),rgba(24,12,56,.28));border:1px solid transparent;backdrop-filter:blur(18px) saturate(1.3);-webkit-backdrop-filter:blur(18px) saturate(1.3);box-shadow:0 30px 80px rgba(0,0,0,.45),0 0 60px rgba(123,92,255,.28),inset 0 1px 0 rgba(255,255,255,.12);transition:transform .35s cubic-bezier(.2,.8,.2,1),box-shadow .35s}
.auth.in{animation:authFloat 7s ease-in-out infinite}
.auth::before{content:"";position:absolute;inset:0;border-radius:inherit;padding:1.5px;pointer-events:none;background:linear-gradient(120deg,#3FC8FF,#7B5CFF,#B06CFF,#3FC8FF) 0 0/300% 300%;-webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask-composite:exclude;animation:borderflow 8s linear infinite}
@keyframes borderflow{to{background-position:300% 0}}
@keyframes authFloat{50%{translate:0 -8px}}
.auth:hover{box-shadow:0 36px 90px rgba(0,0,0,.5),0 0 90px rgba(123,92,255,.45),inset 0 1px 0 rgba(255,255,255,.16)}
.auth .fx-spot{opacity:0}
.auth:hover .fx-spot{opacity:1}
.auth .fx-spot::after{animation:sweep 1.6s cubic-bezier(.3,.6,.2,1) infinite;animation-duration:6s}
.auth > div{position:relative;z-index:1}
.avatar{position:relative;z-index:1;box-shadow:0 0 0 1px rgba(169,146,255,.5),0 0 30px rgba(123,92,255,.35);animation:avatarGlow 5s ease-in-out infinite}
@keyframes avatarGlow{50%{box-shadow:0 0 0 1px rgba(63,200,255,.7),0 0 44px rgba(63,200,255,.4)}}
.avatar img{animation:avatarZoom 14s ease-in-out infinite alternate}
@keyframes avatarZoom{to{transform:scale(1.08)}}
.avatar::after{content:"";position:absolute;inset:0;background:linear-gradient(115deg,transparent 35%,rgba(255,255,255,.28) 50%,transparent 65%);background-size:250% 100%;animation:sheen 5s ease-in-out infinite;pointer-events:none}
.auth ul li{opacity:0;transform:translateX(-10px);transition:opacity .5s,transform .5s}
.auth.in ul li{opacity:1;transform:none}
.auth.in ul li:nth-child(1){transition-delay:.35s}.auth.in ul li:nth-child(2){transition-delay:.45s}.auth.in ul li:nth-child(3){transition-delay:.55s}.auth.in ul li:nth-child(4){transition-delay:.65s}.auth.in ul li:nth-child(5){transition-delay:.75s}.auth.in ul li:nth-child(6){transition-delay:.85s}.auth.in ul li:nth-child(7){transition-delay:.95s}
.social a{transition:box-shadow .25s,border-color .25s,transform .25s,background .25s}
.social a:hover{transform:translateY(-2px);background:rgba(123,92,255,.25);border-color:#A992FF;box-shadow:0 0 22px rgba(123,92,255,.55)}
@media (prefers-reduced-motion:reduce){.auth-bg::before,.halo-ring,.halo-ring::after,.auth.in,.auth::before,.avatar,.avatar img,.avatar::after{animation:none}.auth ul li{opacity:1;transform:none}}
/* ===== Segurança operacional + compatibilidade de equipamentos (seção #seguranca) ===== */
.sf .sf-q{font-size:clamp(24px,2.8vw,36px);line-height:1.18}
.sf .lead{max-width:70ch}
.sf-lead2{display:block;margin-top:10px}
.sf-tag{display:inline-block;font:500 11px/1.3 var(--f-mono);letter-spacing:.14em;text-transform:uppercase;color:var(--cyan);margin-bottom:12px}
.sf-h{font:600 clamp(18px,1.7vw,22px)/1.3 var(--f-body);color:#fff;margin-bottom:10px}
.sf-p{color:var(--muted);font-size:15px;max-width:62ch}
.sf-small{color:var(--dim);font-size:13px;margin-top:10px}
.sf-center{text-align:center;margin:clamp(48px,6vw,72px) 0 22px}
.sf-formula{display:flex;flex-wrap:wrap;align-items:center;gap:10px 12px;margin:0 0 clamp(40px,5vw,64px)}
.sf-formula span{padding:10px 16px;border-radius:999px;border:1px solid rgba(123,160,255,.4);background:rgba(14,22,48,.6);font:500 12.5px/1 var(--f-mono);letter-spacing:.12em;text-transform:uppercase;color:#DCE4FF;animation:fGlow 6s ease-in-out infinite;animation-delay:calc(var(--i,0) * .6s)}
.sf-formula span:nth-of-type(2){--i:1}.sf-formula span:nth-of-type(3){--i:2}.sf-formula span:nth-of-type(4){--i:3}.sf-formula span:nth-of-type(5){--i:4}
@keyframes fGlow{0%,70%,100%{box-shadow:none;border-color:rgba(123,160,255,.4)}35%{box-shadow:0 0 22px rgba(63,200,255,.45);border-color:#3FC8FF}}
.sf-formula b{color:var(--violet-hi);font:700 18px/1 var(--f-display)}
.sf-flowrow{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:40px;align-items:center;margin-bottom:clamp(56px,7vw,88px)}
.sf-flow{display:grid;gap:8px;position:relative;padding-left:4px}
.sf-flow li{position:relative;display:flex;align-items:center;gap:14px;padding:11px 16px;border-radius:12px;border:1px solid var(--line-2);background:rgba(10,16,34,.6);color:var(--muted);font-size:14.5px;transition:all .45s}
.sf-flow li:not(:last-child)::after{content:"";position:absolute;left:30px;top:100%;width:1px;height:8px;background:rgba(123,160,255,.5)}
.sf-n{font:500 11px/1 var(--f-mono);color:var(--dim)}
.sf-flow li.on{color:#fff;border-color:rgba(63,200,255,.7);background:rgba(20,40,80,.6);box-shadow:0 0 22px rgba(63,200,255,.22);transform:translateX(6px)}
.sf-flow li.on .sf-n{color:var(--cyan)}
.sf-flow li.last.on{border-color:#A992FF;background:linear-gradient(120deg,rgba(62,36,150,.8),rgba(20,14,50,.8));box-shadow:0 0 30px rgba(123,92,255,.45)}
.sf-demo-head{display:flex;flex-wrap:wrap;align-items:baseline;justify-content:space-between;gap:8px 20px;margin-bottom:18px}
.sf-demo-head .sf-tag{margin:0;color:var(--dim)}
.sf-grid3{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px}
.sf-card{padding:24px;position:relative;overflow:hidden}
.sf-loads{display:grid;gap:10px;font-size:14px;color:var(--muted)}
.sf-loads li{display:flex;justify-content:space-between;gap:12px;border-bottom:1px dashed var(--line-2);padding-bottom:8px}
.sf-loads b,.sf-comps b,.sf-dl dd,.sf-inv dd{font:600 15px/1 var(--f-mono);color:#fff;white-space:nowrap}
.sf small{font-size:.72em;margin-left:2px;color:var(--muted);font-weight:400}
.sf-stack{display:flex;height:10px;margin:18px 0 12px;border-radius:6px;overflow:hidden;background:rgba(255,255,255,.05)}
.sf-stack i{height:100%;flex:0 0 calc(var(--w) * 100%);transition:flex-basis .5s cubic-bezier(.2,.8,.2,1)}
.sf-stack .p{background:linear-gradient(90deg,#2F6BFF,#4B8CFF)}.sf-stack .e{background:#7B5CFF}.sf-stack .t{background:#3FC8FF}
.sf-total{display:flex;justify-content:space-between;align-items:baseline;gap:10px;color:#fff;font-weight:600}
.sf-total b{font:700 clamp(24px,2.4vw,30px)/1 var(--f-display)}
.sf-slider{display:grid;gap:8px;margin-top:18px;font-size:12.5px;color:var(--dim)}
.sf-slider input{width:100%;accent-color:#7B5CFF;cursor:pointer}
.sf-comps{display:grid;gap:9px;font-size:13.5px;color:var(--muted)}
.sf-comps li{display:grid;grid-template-columns:minmax(0,1.2fr) minmax(0,1fr) auto;align-items:center;gap:10px}
.sf-comps em{grid-column:2/-1;font-style:normal;font-size:12px;color:var(--dim)}
.sf-cbar{height:6px;border-radius:6px;background:rgba(255,255,255,.06);overflow:hidden}
.sf-cbar i{display:block;height:100%;width:calc(var(--w) * 100%);background:linear-gradient(90deg,#2F6BFF,#7B9BFF);transform-origin:left;transform:scaleX(0);transition:transform 1.2s cubic-bezier(.2,.8,.2,1)}
.sf-card.in .sf-cbar i{transform:scaleX(1)}
.sf-comps li.lim span:first-child,.sf-comps li.lim b{color:#F2B84B}
.sf-comps li.lim .sf-cbar i{background:linear-gradient(90deg,#F2B84B,#FFD27A);box-shadow:0 0 10px rgba(242,184,75,.6)}
.sf-result .sf-lim{font:700 clamp(34px,3.6vw,46px)/1 var(--f-display);color:#fff}
.sf-gauge{position:relative;height:12px;margin:16px 0 14px;border-radius:8px;background:rgba(255,255,255,.07);overflow:hidden}
.sf-gfill{position:absolute;inset:0 auto 0 0;width:calc(var(--g,.94) * 100%);background:linear-gradient(90deg,#2F6BFF,#7B5CFF 70%,#F2B84B);border-radius:8px;transition:width .5s cubic-bezier(.2,.8,.2,1)}
.sf-gmark{position:absolute;top:-2px;bottom:-2px;right:0;width:2px;background:#fff;box-shadow:0 0 8px #fff}
.sf-dl{display:grid;gap:10px;font-size:14px;color:var(--muted)}
.sf-dl div,.sf-inv dl div{display:flex;justify-content:space-between;gap:12px}
.sf-m{color:#F2B84B!important}
.sf-status{margin-top:16px;display:grid;gap:4px;padding:12px 14px;border-radius:12px;border:1px solid;font-size:13px}
.sf-status b{font:600 12px/1.2 var(--f-mono);letter-spacing:.14em;text-transform:uppercase}
.sf-status.red{border-color:rgba(242,184,75,.55);background:rgba(242,184,75,.08);color:#F7D08A}
.sf-status.ok{border-color:rgba(63,210,155,.5);background:rgba(63,210,155,.07);color:#8FE8C4}
.sf-status.neg{border-color:rgba(255,107,122,.55);background:rgba(255,107,122,.08);color:#FFB3BB}
.sf-status b::before{content:"";display:inline-block;width:8px;height:8px;border-radius:50%;background:currentColor;margin-right:8px;animation:blink 1.6s ease-in-out infinite}
.sf-note{margin-top:14px;font-size:13px;color:var(--dim);max-width:90ch}
.sf-impact{margin:clamp(56px,7vw,88px) auto;max-width:900px;text-align:center;font:500 clamp(24px,3vw,40px)/1.2 var(--f-display)}
.sf-impact span{color:#fff}.sf-impact b{display:block;font-weight:500;margin-top:.2em}
.sf-chain{display:grid;gap:22px;padding:28px}
.sf-links{display:flex;flex-wrap:wrap;align-items:center;gap:10px}
.sf-links > i{flex:0 0 26px;height:2px;background:repeating-linear-gradient(90deg,rgba(123,160,255,.7) 0 5px,transparent 5px 9px)}
.sf-link{display:grid;gap:6px;padding:14px 18px;border-radius:14px;border:1px solid var(--line-2);background:rgba(10,16,34,.7);min-width:130px;font-size:13px;color:var(--muted)}
.sf-link b{font:600 18px/1 var(--f-mono);color:#fff}
.sf-link.lim{border-color:rgba(242,184,75,.7);box-shadow:0 0 24px rgba(242,184,75,.25);animation:limPulse 2.4s ease-in-out infinite}
.sf-link.lim b,.sf-link.lim span{color:#F7D08A}
@keyframes limPulse{50%{box-shadow:0 0 36px rgba(242,184,75,.45)}}
.sf-ident{font:600 13px/1.4 var(--f-mono);letter-spacing:.12em;text-transform:uppercase;color:#F7D08A}
.sf-ident b{font-size:20px;margin-left:10px}
.sf-grid2{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px;margin-top:clamp(56px,7vw,88px)}
.sf-sheet{margin-top:18px;padding:18px;border-radius:14px;border:1px dashed rgba(123,160,255,.45);background:rgba(8,12,28,.5)}
.sf-sheet ul{display:grid;grid-template-columns:1fr 1fr;gap:8px 18px;font-size:13.5px;color:#DCE4FF}
.sf-sheet li::before{content:"";display:inline-block;width:5px;height:5px;border-radius:50%;background:var(--cyan);margin-right:9px;vertical-align:2px}
.sf-chips{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:18px}
.sf-chips li{padding:7px 12px;border-radius:999px;border:1px solid var(--line-2);font-size:12.5px;color:#C9D2E4;background:rgba(10,16,34,.5)}
.sf-st{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.sf-st li{display:flex;align-items:center;gap:9px;padding:9px 12px;border-radius:10px;border:1px solid var(--line-2);font-size:12.5px;color:#DCE4FF}
.sf-st i{width:9px;height:9px;border-radius:50%;flex:none}
.sf-st .ok i{background:#3FD29B}.sf-st .res i{background:#7FB4FF}.sf-st .red i{background:#F2B84B}.sf-st .adj i{background:#A992FF}.sf-st .neg i{background:#FF6B7A}.sf-st .nd i{background:#65708A}
.sf-invrow{display:grid;grid-template-columns:repeat(2,minmax(0,1fr)) minmax(0,1.1fr);gap:18px;align-items:stretch}
.sf-inv{padding:22px}
.sf-inv h4{font:600 18px/1.2 var(--f-display);margin-bottom:14px}
.sf-inv dl{display:grid;gap:9px;font-size:13.5px;color:var(--muted)}
.sf-track{display:block;height:8px;margin-top:16px;border-radius:6px;background:rgba(255,255,255,.07);overflow:hidden}
.sf-fill{display:block;height:100%;width:calc(var(--w) * 100%);border-radius:6px;background:linear-gradient(90deg,#2F6BFF,#7B5CFF 75%,#F2B84B)}
.sf-inv.b{border-color:rgba(63,200,255,.55);box-shadow:0 0 30px rgba(63,200,255,.18)}
.sf-inv.b .sf-m{color:#8FE8C4!important}
.sf-inv.b .sf-fill{background:linear-gradient(90deg,#2F6BFF,#3FC8FF)}
.sf-signal{padding:22px;border-color:rgba(169,146,255,.7);background:linear-gradient(150deg,rgba(62,36,150,.55),rgba(14,12,40,.7));box-shadow:0 0 40px rgba(123,92,255,.3)}
.sf-sig{display:inline-flex;align-items:center;gap:8px;font:600 12px/1 var(--f-mono);letter-spacing:.18em;color:#D9CCFF;margin-bottom:12px}
.sf-sig::before{content:"";width:8px;height:8px;border-radius:50%;background:#A992FF;box-shadow:0 0 10px #A992FF;animation:blink 1.4s ease-in-out infinite}
.sf-signal p{color:#EDE8FF;font-size:15px}
.sf-signal p.sf-small{color:#B9B0E0}
.sf-prod{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,.9fr);gap:40px;align-items:center;margin-top:clamp(56px,7vw,88px)}
.sf-prod .sf-tag{margin-top:18px}
.sf-pend{margin-top:4px;font-size:13.5px;color:var(--muted)}
.sf-pend b{font:600 12px/1 var(--f-mono);letter-spacing:.1em;color:#C9D2E4;padding:4px 8px;border-radius:6px;border:1px dashed var(--line-2);white-space:nowrap}
.sf-app{padding:24px;border-radius:18px;border:1px solid rgba(123,160,255,.45);background:linear-gradient(160deg,rgba(18,28,64,.85),rgba(8,10,26,.9));box-shadow:0 30px 70px rgba(0,0,0,.45),0 0 50px rgba(47,107,255,.2)}
.sf-app.in{animation:authFloat 7s ease-in-out infinite}
.sf-app header{display:flex;justify-content:space-between;gap:10px;font:500 11px/1 var(--f-mono);letter-spacing:.16em;text-transform:uppercase;color:var(--cyan)}
.sf-app header em{font-style:normal;color:var(--dim);letter-spacing:.08em}
.sf-app h4{font:600 17px/1.3 var(--f-body);margin:14px 0 4px;color:#fff}
.sf-who{color:var(--muted);font-size:13.5px;margin-bottom:14px}
.sf-app dl{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}
.sf-app dl div{padding:10px 12px;border-radius:10px;background:rgba(255,255,255,.04);border:1px solid var(--line)}
.sf-app dl .w{grid-column:span 3;display:flex;justify-content:space-between;gap:10px}
.sf-app dt{font-size:11.5px;color:var(--dim)}.sf-app dd{margin:4px 0 0;font:600 15px/1.2 var(--f-mono);color:#fff}
.sf-app .w dd{margin:0;font-family:var(--f-body);font-size:13.5px}
.sf-act{display:inline-block;margin-top:14px;font:600 12px/1 var(--f-mono);letter-spacing:.12em;text-transform:uppercase;color:#A992FF}
.sf-pop{margin-top:clamp(56px,7vw,88px)}
.sf-kpis{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:14px}
.sf-kpis div{padding:20px 18px;display:grid;gap:8px;align-content:start}
.sf-kpis b{font:700 clamp(30px,3vw,40px)/1 var(--f-display);background:linear-gradient(90deg,#3FC8FF,#7B9BFF);-webkit-background-clip:text;background-clip:text;color:transparent}
.sf-kpis div:nth-child(2) b,.sf-kpis div:nth-child(5) b{background:linear-gradient(90deg,#F2B84B,#FFD27A);-webkit-background-clip:text;background-clip:text}
.sf-kpis span{font-size:13.5px;color:var(--muted)}
.sf-ev{margin-top:clamp(48px,6vw,72px);padding:26px 28px;border-left:3px solid var(--cyan)}
.sf-close{margin-top:clamp(56px,7vw,88px);text-align:center;display:grid;justify-items:center;gap:18px}
.sf-close h3{font:500 clamp(22px,2.6vw,34px)/1.2 var(--f-display);max-width:28ch}
.sf-close h3 .grad{display:block;margin-top:.25em}
.sf-close .cta-row{justify-content:center}
@media (max-width:1000px){.sf-grid3,.sf-invrow{grid-template-columns:1fr 1fr}.sf-result,.sf-signal{grid-column:1/-1}.sf-kpis{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media (max-width:760px){.sf-flowrow,.sf-grid2,.sf-prod,.sf-grid3,.sf-invrow{grid-template-columns:1fr}.sf-kpis{grid-template-columns:1fr 1fr}.sf-sheet ul,.sf-st{grid-template-columns:1fr}.sf-links > i{display:none}.sf-app dl{grid-template-columns:1fr 1fr}.sf-app dl .w{grid-column:span 2}}
@media (prefers-reduced-motion:reduce){.sf-formula span,.sf-link.lim,.sf-app.in{animation:none}.sf-cbar i{transform:none}}
/* fundo da Segurança operacional: cena parada atrás do conteúdo (sticky) — foto quase transparente + nebulosa + estrelas */
.sf{overflow:visible;overflow-x:clip}
.sf-bg{position:absolute;inset:0;z-index:-1;pointer-events:none;-webkit-mask-image:linear-gradient(180deg,transparent,#000 6%,#000 94%,transparent);mask-image:linear-gradient(180deg,transparent,#000 6%,#000 94%,transparent)}
.sf-bg-in{position:sticky;top:0;height:100vh;overflow:hidden}
.sf-bg-in > i{position:absolute;inset:0}
.sf-bg-img{background:url(/img/corda-seguranca-v1.webp) 30% center/cover no-repeat;opacity:.16;animation:sfZoom 40s ease-in-out infinite alternate;-webkit-mask-image:radial-gradient(90% 90% at 35% 45%,#000 40%,transparent);mask-image:radial-gradient(90% 90% at 35% 45%,#000 40%,transparent)}
@keyframes sfZoom{from{transform:scale(1.02)}to{transform:scale(1.12) translate(-1.5%,-1%)}}
.sf-bg-neb{inset:-15%!important;background:radial-gradient(closest-side,rgba(98,54,255,.30),transparent),radial-gradient(closest-side,rgba(60,80,255,.22),transparent),radial-gradient(closest-side,rgba(150,90,255,.2),transparent),radial-gradient(closest-side,rgba(70,220,230,.10),transparent);background-repeat:no-repeat;background-size:60% 55%,50% 60%,45% 45%,30% 30%;filter:blur(40px);animation:sfNeb 30s ease-in-out infinite alternate}
@keyframes sfNeb{0%{background-position:0% 80%,100% 20%,55% 100%,20% 40%}50%{background-position:40% 55%,60% 0%,90% 70%,45% 20%}100%{background-position:75% 90%,20% 35%,30% 60%,70% 55%}}
.sf-bg-stars{background:radial-gradient(1.2px 1.2px at 20px 30px,rgba(255,255,255,.9),transparent 60%),radial-gradient(1px 1px at 90px 110px,rgba(200,215,255,.8),transparent 60%),radial-gradient(1.4px 1.4px at 150px 60px,rgba(255,255,255,.7),transparent 60%),radial-gradient(1px 1px at 60px 170px,rgba(180,200,255,.7),transparent 60%);background-size:190px 190px;opacity:.45;animation:sfStars 60s linear infinite,sfTwinkle 5s ease-in-out infinite}
@keyframes sfStars{to{background-position:0 -190px}}
@keyframes sfTwinkle{50%{opacity:.25}}
@media (prefers-reduced-motion:reduce){.sf-bg-img,.sf-bg-neb,.sf-bg-stars{animation:none}}
/* cards da Segurança com os efeitos .zc: mantém a flutuação do card do W360 e o destaque em sequência dos números */
.sf-app.zc.in{animation:zin .95s cubic-bezier(.2,.8,.2,1) backwards,authFloat 7s ease-in-out infinite 1s}
.sf-chain.zc.in:hover,.sf-ev.zc.in:hover{transform:translateY(-6px) scale(1.015)}
.sf-kpis .zc.in.on b,.sf-kpis .zc.in:hover b{filter:drop-shadow(0 0 12px rgba(63,200,255,.5))}
.sf-result.zc.in:hover .sf-lim{text-shadow:0 0 24px rgba(169,146,255,.6)}
/* vidro semitransparente em todos os cards + saída animada + detalhe de luz no topo */
.zc.glass,.sf-app.zc{background:linear-gradient(155deg,rgba(26,38,86,.42),rgba(8,12,30,.34));backdrop-filter:blur(14px) saturate(1.35);-webkit-backdrop-filter:blur(14px) saturate(1.35);border-color:rgba(120,160,255,.3);box-shadow:0 14px 40px rgba(0,0,0,.35),inset 0 1px 0 rgba(255,255,255,.1)}
.zc.in:hover,.zc.in.on{background:linear-gradient(155deg,rgba(70,40,170,.55),rgba(18,14,50,.5))}
.gcard.vx.zc{background:linear-gradient(155deg,rgba(62,36,150,.55),rgba(14,12,40,.5)) padding-box,linear-gradient(130deg,#3FC8FF,#7B5CFF,#B06CFF) border-box}
.zc.rv.out{animation:zout .6s cubic-bezier(.4,0,.2,1) forwards}
@keyframes zout{from{opacity:1;transform:none;filter:none}to{opacity:0;transform:scale(.9) translateY(-18px);filter:blur(6px)}}
.zc::before{content:"";position:absolute;left:16px;right:16px;top:0;height:1px;z-index:1;pointer-events:none;background:linear-gradient(90deg,transparent,#3FC8FF,#A992FF,transparent);transform:scaleX(0);opacity:0}
.zc.in::before{animation:edgeIn 1s cubic-bezier(.2,.8,.2,1) .35s forwards,edgeGlow 4.5s ease-in-out 1.6s infinite}
@keyframes edgeIn{to{transform:scaleX(1);opacity:.9}}
@keyframes edgeGlow{0%,100%{opacity:.5;transform:scaleX(1)}50%{opacity:1;transform:scaleX(1);box-shadow:0 0 12px #3FC8FF}}
.sf-app.zc::before,.band.zc::before{left:24px;right:24px}
@media (prefers-reduced-motion:reduce){.zc.rv.out{animation:none;opacity:1}.zc::before{animation:none;opacity:.6;transform:none}}
.band.zc.glass{background:linear-gradient(155deg,rgba(14,24,56,.55),rgba(6,10,26,.5)) padding-box,linear-gradient(120deg,rgba(63,200,255,.8),rgba(123,92,255,.8),rgba(63,200,255,.3)) border-box;background-size:100% 100%,300% 300%;border-color:transparent}
.mod.hot.zc,.sf-inv.b.zc{border-color:rgba(63,200,255,.6)}
.sf-signal.zc{background:linear-gradient(150deg,rgba(62,36,150,.5),rgba(14,12,40,.45));border-color:rgba(169,146,255,.7)}
.sf-ev.zc{border-left:3px solid var(--cyan)}
/* modo 3D: o card inclina seguindo o mouse (mesma intensidade da home) e salta em direção a quem olha */
.zc.in:hover{transform:perspective(1100px) rotateY(var(--ry,0deg)) rotateX(var(--rx,0deg)) translateY(-6px) translateZ(24px) scale(1.04);transition:transform .15s ease-out,box-shadow .4s,border-color .4s,background .4s}
.gap3 .gcard.vx.in:hover{transform:perspective(1100px) rotateY(var(--ry,0deg)) rotateX(var(--rx,0deg)) translateZ(24px) scale(1.06)}
.band.zc.in:hover,.sf-chain.zc.in:hover,.sf-ev.zc.in:hover{transform:perspective(1600px) rotateY(calc(var(--ry,0deg) * .3)) rotateX(calc(var(--rx,0deg) * .3)) translateY(-4px) scale(1.012)}
.zc.in:hover{box-shadow:calc(var(--ry-n,0) * 1px) 26px 60px rgba(0,0,0,.5),0 0 0 1px rgba(63,200,255,.25),0 0 48px rgba(123,92,255,.5)}
