/* ===========================================================================
   BPG Sistemas — Landing v2 · craft superior
   =========================================================================== */
:root {
  --navy:#0D1A3A; --navy-2:#111F44; --navy-3:#16264F;
  --blue:#1B4DBE; --blue-2:#2B5FD6; --blue-lt:#6E92E8; --blue-pale:#E7EDFB;
  --red:#C5372F; --red-2:#B0302A; --red-pale:#FBE7E5;
  --paper:#F7F6F2; --paper-2:#EFEDE6; --ink:#161B26; --mute:#68707F;
  --line:#E4E1D9; --line-2:#D6D3C9;
  --wrap:1240px; --ease:cubic-bezier(.33,1,.68,1);
}
*{ box-sizing:border-box; }
html{ scroll-behavior:smooth; -webkit-text-size-adjust:100%; }
body{ margin:0; background:var(--paper); color:var(--ink); font-family:'Space Grotesk',system-ui,sans-serif; line-height:1.5; -webkit-font-smoothing:antialiased; }
h1,h2,h3,h4{ margin:0; font-weight:700; letter-spacing:-.025em; line-height:1.05; text-wrap:balance; }
p{ margin:0; text-wrap:pretty; } img{ max-width:100%; display:block; }
a{ color:var(--blue); text-decoration:none; } a:hover{ color:var(--blue-2); }
.mono{ font-family:'Space Mono',monospace; }
.wrap{ max-width:var(--wrap); margin:0 auto; padding:0 36px; }

.eyebrow{ font-family:'Space Mono',monospace; font-size:12.5px; font-weight:700; letter-spacing:.22em; text-transform:uppercase; color:var(--blue); display:inline-flex; align-items:center; gap:12px; }
.eyebrow::before{ content:""; width:26px; height:2px; background:currentColor; }
.eyebrow.dk{ color:var(--blue-lt); }
.eyebrow.rd{ color:var(--red); }

.btn{ display:inline-flex; align-items:center; justify-content:center; gap:10px; font-family:inherit; font-weight:600; font-size:15.5px; cursor:pointer; padding:15px 26px; border-radius:12px; border:1.5px solid transparent; color:inherit; transition:transform .18s var(--ease), background .2s, box-shadow .2s, border-color .2s; white-space:nowrap; }
.btn svg{ width:18px; height:18px; flex:0 0 auto; }
.btn-blue{ background:var(--blue); color:#fff !important; box-shadow:0 10px 26px -10px rgba(27,77,190,.65); }
.btn-blue:hover{ background:var(--blue-2); transform:translateY(-2px); }
.btn-red{ background:var(--red); color:#fff !important; box-shadow:0 10px 26px -10px rgba(197,55,47,.6); }
.btn-red:hover{ background:var(--red-2); transform:translateY(-2px); }
.btn-line{ background:transparent; color:var(--ink) !important; border-color:var(--line-2); }
.btn-line:hover{ border-color:var(--ink); transform:translateY(-2px); }
.btn-line.dk{ color:#fff !important; border-color:rgba(255,255,255,.3); }
.btn-line.dk:hover{ border-color:#fff; background:rgba(255,255,255,.06); }
.btn-white{ background:#fff; color:var(--navy) !important; box-shadow:0 10px 26px -12px rgba(0,0,0,.45); }
.btn-white:hover{ transform:translateY(-2px); }
.btn-xl{ padding:18px 32px; font-size:16.5px; border-radius:13px; }

/* ------------------------------- header -------------------------------- */
.hd{ position:sticky; top:0; z-index:100; background:rgba(13,26,58,.75); backdrop-filter:blur(14px); transition:background .25s; }
.hd.solid{ background:rgba(13,26,58,.94); box-shadow:0 10px 30px -20px rgba(0,0,0,.6); }
.hd .inner{ height:78px; display:flex; align-items:center; justify-content:space-between; gap:20px; }
.hd .brand{ display:flex; align-items:center; gap:12px; color:#fff; }
.hd .brand b{ font-size:20px; letter-spacing:-.02em; font-weight:700; }
.hd .brand b .c-b{ color:#5B82E4; } .hd .brand b .c-g{ color:#E05B52; }
.hd nav{ display:flex; gap:32px; }
.hd nav a{ color:rgba(255,255,255,.75); font-size:15px; font-weight:500; transition:color .15s; }
.hd nav a:hover{ color:#fff; }
.hd .cta{ display:flex; gap:11px; align-items:center; }
.hd .cta .btn{ padding:11px 20px; font-size:14.5px; }
.hamb{ display:none; background:none; border:none; cursor:pointer; padding:8px; }
.hamb span{ display:block; width:24px; height:2px; background:#fff; margin:5px 0; }
.mmenu{ display:none; position:fixed; inset:78px 0 0; z-index:99; background:var(--navy); padding:26px; flex-direction:column; gap:2px; }
.mmenu.open{ display:flex; }
.mmenu a{ color:#fff; font-size:19px; font-weight:600; padding:16px 4px; border-bottom:1px solid rgba(255,255,255,.1); }
.mmenu .btn{ margin-top:18px; }

/* -------------------------------- hero --------------------------------- */
.hero{ position:relative; background:var(--navy); color:#fff; overflow:hidden; padding:110px 0 0; }
.hero .grid-bg{ position:absolute; inset:0; background-image:linear-gradient(rgba(255,255,255,.035) 1px, transparent 1px), linear-gradient(90deg, rgba(255,255,255,.035) 1px, transparent 1px); background-size:56px 56px; mask-image:radial-gradient(900px 600px at 50% 0%, #000 30%, transparent 75%); pointer-events:none; }
.hero .glow{ position:absolute; inset:0; background:radial-gradient(1000px 560px at 75% 0%, rgba(43,95,214,.28), transparent 62%), radial-gradient(760px 480px at 8% 100%, rgba(197,55,47,.14), transparent 60%); pointer-events:none; }
.hero .cols{ position:relative; z-index:2; display:grid; grid-template-columns:1.02fr .98fr; gap:64px; align-items:center; padding-bottom:90px; }
.hero h1{ font-size:clamp(40px,4.9vw,66px); letter-spacing:-.035em; }
.hero h1 em{ font-style:normal; color:var(--blue-lt); background:linear-gradient(180deg, transparent 68%, rgba(43,95,214,.32) 68%, rgba(43,95,214,.32) 92%, transparent 92%); padding:0 2px; }
.hero .sub{ margin-top:26px; font-size:20px; line-height:1.6; color:rgba(255,255,255,.78); max-width:530px; }
.hero .acts{ margin-top:38px; display:flex; gap:15px; flex-wrap:wrap; }
.hero .note{ margin-top:16px; font-size:13.5px; color:rgba(255,255,255,.55); display:flex; align-items:center; gap:8px; }
.hero .note svg{ width:15px; height:15px; color:#5BBB7B; }

/* device mockup */
.shot{ position:relative; }
.shot .win{ background:#fff; border-radius:16px; overflow:hidden; box-shadow:0 60px 120px -40px rgba(0,0,0,.65), 0 0 0 1px rgba(255,255,255,.07); transform:perspective(1600px) rotateY(-6deg) rotateX(2deg); }
.shot .bar{ height:40px; background:#EDEBE4; display:flex; align-items:center; gap:7px; padding:0 15px; border-bottom:1px solid #e2dfd6; }
.shot .bar i{ width:11px; height:11px; border-radius:50%; display:block; }
.shot .bar .url{ margin-left:12px; flex:1; height:23px; background:#fff; border-radius:7px; display:flex; align-items:center; padding:0 11px; font-family:'Space Mono',monospace; font-size:11px; color:var(--mute); }
.app{ display:grid; grid-template-columns:172px 1fr; min-height:388px; background:var(--paper); }
.app .sd{ background:var(--navy); padding:18px 14px; display:flex; flex-direction:column; gap:5px; }
.app .sd img{ height:24px; object-fit:contain; object-position:left; margin:4px 4px 18px; }
.app .ni{ display:flex; align-items:center; gap:10px; padding:9.5px 12px; border-radius:9px; font-size:12.5px; font-weight:500; color:rgba(255,255,255,.6); }
.app .ni svg{ width:15px; height:15px; }
.app .ni.on{ background:rgba(43,95,214,.26); color:#fff; }
.app .mn{ padding:20px 22px; }
.app .mh{ display:flex; justify-content:space-between; align-items:center; margin-bottom:15px; }
.app .mh h4{ font-size:16px; }
.kpis{ display:grid; grid-template-columns:repeat(3,1fr); gap:10px; margin-bottom:15px; }
.kpi{ background:#fff; border:1px solid var(--line); border-radius:12px; padding:13px 14px; }
.kpi .n{ font-size:22px; font-weight:700; letter-spacing:-.02em; color:var(--navy); }
.kpi .n.b{ color:var(--blue); } .kpi .n.r{ color:var(--red); }
.kpi .l{ font-family:'Space Mono',monospace; font-size:10px; letter-spacing:.05em; color:var(--mute); margin-top:3px; }
.app table{ width:100%; border-collapse:collapse; background:#fff; border:1px solid var(--line); border-radius:12px; overflow:hidden; }
.app th{ text-align:left; font-family:'Space Mono',monospace; font-size:9.5px; letter-spacing:.08em; text-transform:uppercase; color:var(--mute); padding:9px 13px; background:#FAF9F5; border-bottom:1px solid var(--line); }
.app td{ padding:9.5px 13px; font-size:12.5px; color:#2b3140; border-bottom:1px solid var(--line); }
.app tr:last-child td{ border-bottom:none; }
.chip{ display:inline-flex; align-items:center; gap:5px; font-size:10.5px; font-weight:600; padding:3px 10px; border-radius:20px; }
.chip::before{ content:""; width:5px; height:5px; border-radius:50%; background:currentColor; }
.chip.ok{ background:#E3F2E9; color:#1F7A4D; } .chip.run{ background:var(--blue-pale); color:var(--blue); } .chip.wt{ background:#FBF0DF; color:#9A6B12; }
.fcard{ position:absolute; background:#fff; border-radius:14px; box-shadow:0 26px 56px -22px rgba(0,0,0,.55); padding:15px 17px; display:flex; align-items:center; gap:13px; z-index:3; }
.fcard .ic{ width:40px; height:40px; border-radius:11px; display:flex; align-items:center; justify-content:center; flex:0 0 auto; }
.fcard .ic svg{ width:21px; height:21px; color:#fff; }
.fcard .t{ font-size:13.5px; font-weight:700; color:var(--ink); line-height:1.25; white-space:nowrap; }
.fcard .s{ font-family:'Space Mono',monospace; font-size:10.5px; color:var(--mute); margin-top:3px; white-space:nowrap; }
.fc-a{ right:-20px; top:26px; } .fc-b{ left:-30px; bottom:34px; }

/* marquee */
.marq{ position:relative; z-index:2; border-top:1px solid rgba(255,255,255,.1); overflow:hidden; padding:19px 0; background:rgba(255,255,255,.02); }
.marq .track{ display:flex; gap:56px; width:max-content; animation:marq 34s linear infinite; }
.marq span{ font-family:'Space Mono',monospace; font-size:12.5px; letter-spacing:.18em; text-transform:uppercase; color:rgba(255,255,255,.42); display:flex; align-items:center; gap:56px; white-space:nowrap; }
.marq span::after{ content:"·"; color:rgba(255,255,255,.25); }
@keyframes marq{ to{ transform:translateX(-50%); } }
@media (prefers-reduced-motion:reduce){ .marq .track{ animation:none; } }

/* ------------------------------ sections -------------------------------- */
.sec{ padding:112px 0; }
.sec-head{ max-width:720px; margin-bottom:60px; }
.sec-head.center{ margin-left:auto; margin-right:auto; text-align:center; }
.sec-head h2{ font-size:clamp(32px,4vw,50px); margin:20px 0 18px; }
.sec-head p{ font-size:19px; color:var(--mute); line-height:1.62; }

/* product intro (supercota) */
.prod{ background:#fff; border-top:1px solid var(--line); }
.prod .lock{ display:flex; align-items:center; gap:22px; margin-bottom:26px; flex-wrap:wrap; }
.prod .lock img{ height:52px; width:auto; }
.prod .lock .sep{ width:1.5px; height:44px; background:var(--line-2); }
.prod .lock .endo{ font-size:13.5px; color:var(--mute); display:flex; align-items:center; gap:9px; white-space:nowrap; }
.prod .lock .endo b{ color:var(--ink); }
.prod .cols{ display:grid; grid-template-columns:.92fr 1.08fr; gap:70px; align-items:center; }
.prod .cols > *{ min-width:0; }
.prod h2{ font-size:clamp(30px,3.6vw,44px); margin-bottom:20px; }
.prod .lead{ font-size:18.5px; color:var(--mute); line-height:1.65; margin-bottom:30px; }
.checks{ display:grid; gap:15px; }
.checks .c{ display:flex; gap:13px; align-items:flex-start; font-size:15.5px; line-height:1.5; }
.checks .c svg{ width:21px; height:21px; color:var(--blue); flex:0 0 auto; margin-top:1px; }
.checks .c b{ display:block; }
.checks .c span{ color:var(--mute); font-size:14.5px; }
.prod .shot .win{ transform:none; }

/* numbered features */
.feats{ background:var(--paper); }
.fgrid{ display:grid; grid-template-columns:repeat(3,1fr); gap:0; border:1px solid var(--line); border-radius:22px; overflow:hidden; background:#fff; }
.fcell{ padding:38px 34px; border-right:1px solid var(--line); border-bottom:1px solid var(--line); transition:background .2s; position:relative; }
.fcell:nth-child(3n){ border-right:none; }
.fcell:nth-child(n+4){ border-bottom:none; }
.fcell:hover{ background:#FCFBF8; }
.fcell .num{ font-family:'Space Mono',monospace; font-size:12.5px; color:var(--mute); letter-spacing:.1em; }
.fcell .ic{ width:46px; height:46px; border-radius:12px; display:flex; align-items:center; justify-content:center; margin:20px 0 18px; }
.fcell .ic svg{ width:23px; height:23px; }
.fcell h3{ font-size:19px; margin-bottom:9px; letter-spacing:-.015em; }
.fcell p{ font-size:14.5px; color:var(--mute); line-height:1.6; }
.ic-b{ background:var(--blue-pale); color:var(--blue); }
.ic-r{ background:var(--red-pale); color:var(--red); }
.ic-n{ background:#E6E9F1; color:var(--navy); }

/* ------------------------------ REFINA free ----------------------------- */
.refina{ background:var(--navy); color:#fff; position:relative; overflow:hidden; }
.refina .glow{ position:absolute; inset:0; background:radial-gradient(860px 480px at 22% 18%, rgba(197,55,47,.2), transparent 58%), radial-gradient(800px 500px at 88% 88%, rgba(43,95,214,.22), transparent 60%); pointer-events:none; }
.refina .cols{ position:relative; z-index:2; display:grid; grid-template-columns:1fr .94fr; gap:66px; align-items:center; }
.refina .cols > *{ min-width:0; }
.refina .tag{ display:inline-flex; align-items:center; gap:9px; background:rgba(197,55,47,.16); border:1px solid rgba(218,74,65,.4); color:#F0968F; font-family:'Space Mono',monospace; font-size:12px; font-weight:700; letter-spacing:.16em; text-transform:uppercase; padding:9px 16px; border-radius:30px; }
.refina .tag i{ width:7px; height:7px; border-radius:50%; background:#DA4A41; animation:pulse 2s infinite; }
@keyframes pulse{ 0%,100%{ opacity:1; } 50%{ opacity:.35; } }
.refina h2{ font-size:clamp(32px,4vw,50px); margin:24px 0 18px; }
.refina h2 em{ font-style:normal; color:#F0968F; }
.refina .lead{ font-size:19px; color:rgba(255,255,255,.78); line-height:1.62; max-width:520px; }
.refina .steps{ margin:32px 0 36px; display:grid; gap:0; }
.refina .rstep{ display:flex; gap:18px; padding:17px 0; border-bottom:1px solid rgba(255,255,255,.1); }
.refina .rstep:last-child{ border-bottom:none; }
.refina .rstep .n{ font-family:'Space Mono',monospace; font-weight:700; font-size:14px; color:#F0968F; width:30px; flex:0 0 auto; padding-top:2px; }
.refina .rstep b{ display:block; font-size:16.5px; margin-bottom:3px; }
.refina .rstep span{ font-size:14.5px; color:rgba(255,255,255,.66); line-height:1.55; }
.refina .acts{ display:flex; gap:15px; flex-wrap:wrap; }
.refina .note{ margin-top:14px; font-size:13px; color:rgba(255,255,255,.5); }

/* refina demo card */
.rdemo{ background:#fff; border-radius:18px; overflow:hidden; box-shadow:0 50px 100px -40px rgba(0,0,0,.6); color:var(--ink); }
.rdemo .rh{ padding:18px 22px; border-bottom:1px solid var(--line); display:flex; justify-content:space-between; align-items:center; }
.rdemo .rh b{ font-size:15px; }
.rdemo .body{ padding:22px; }
.rdemo .qline{ display:flex; gap:10px; margin-bottom:18px; }
.rdemo .qline .fld{ flex:1; height:42px; border:1.5px solid var(--line-2); border-radius:10px; display:flex; align-items:center; padding:0 14px; font-size:13.5px; color:var(--ink); background:#FCFBF8; }
.rdemo .qline .go{ width:42px; height:42px; border-radius:10px; background:var(--red); display:flex; align-items:center; justify-content:center; flex:0 0 auto; }
.rdemo .qline .go svg{ width:19px; height:19px; color:#fff; }
.rdemo .src{ display:flex; justify-content:space-between; align-items:center; padding:11px 2px; border-bottom:1px solid var(--line); font-size:13px; }
.rdemo .src:last-of-type{ border-bottom:none; }
.rdemo .src .nm{ display:flex; align-items:center; gap:9px; color:#2b3140; }
.rdemo .src .nm svg{ width:15px; height:15px; color:var(--blue); }
.rdemo .src .pr{ font-family:'Space Mono',monospace; font-weight:700; font-size:13px; }
.rdemo .res{ margin-top:16px; background:var(--blue-pale); border:1px solid #CBD9F5; border-radius:12px; padding:15px 18px; display:flex; justify-content:space-between; align-items:center; }
.rdemo .res .l{ font-size:12.5px; color:var(--blue); font-weight:600; }
.rdemo .res .v{ font-family:'Space Mono',monospace; font-weight:700; font-size:21px; color:var(--blue); letter-spacing:-.02em; }
.rdemo .res .s{ font-size:11px; color:#5a6a8c; margin-top:2px; }

/* ------------------------------ how ------------------------------------- */
.how{ background:var(--paper-2); }
.hsteps{ display:grid; grid-template-columns:repeat(4,1fr); gap:22px; counter-reset:step; }
.hstep{ background:#fff; border:1px solid var(--line); border-radius:20px; padding:32px 28px; position:relative; transition:transform .2s var(--ease), box-shadow .2s; }
.hstep:hover{ transform:translateY(-5px); box-shadow:0 26px 52px -30px rgba(13,26,58,.4); }
.hstep .n{ font-family:'Space Mono',monospace; font-weight:700; font-size:13px; color:var(--blue); background:var(--blue-pale); width:40px; height:40px; border-radius:11px; display:flex; align-items:center; justify-content:center; margin-bottom:20px; }
.hstep:nth-child(2) .n{ color:var(--red); background:var(--red-pale); }
.hstep:nth-child(4) .n{ color:#fff; background:var(--navy); }
.hstep h4{ font-size:18px; margin-bottom:9px; }
.hstep p{ font-size:14.5px; color:var(--mute); line-height:1.6; }

/* ------------------------------ compliance ------------------------------ */
.comp .box{ background:linear-gradient(155deg, var(--navy), var(--navy-3)); color:#fff; border-radius:26px; padding:62px; display:grid; grid-template-columns:1.15fr 1fr; gap:56px; align-items:center; position:relative; overflow:hidden; }
.comp .box::after{ content:""; position:absolute; inset:0; background:radial-gradient(640px 380px at 85% 10%, rgba(43,95,214,.24), transparent 60%); pointer-events:none; }
.comp h2{ font-size:clamp(28px,3.4vw,42px); margin:18px 0 16px; position:relative; z-index:2; }
.comp p{ color:rgba(255,255,255,.76); font-size:17.5px; line-height:1.62; position:relative; z-index:2; }
.comp .bl{ position:relative; z-index:2; display:grid; gap:15px; }
.comp .brow{ display:flex; align-items:center; gap:17px; background:rgba(255,255,255,.06); border:1px solid rgba(255,255,255,.12); border-radius:15px; padding:17px 19px; }
.comp .brow .ic{ width:46px; height:46px; border-radius:12px; background:rgba(43,95,214,.28); display:flex; align-items:center; justify-content:center; flex:0 0 auto; }
.comp .brow .ic svg{ width:24px; height:24px; color:#fff; }
.comp .brow b{ font-size:16px; display:block; }
.comp .brow span{ font-family:'Space Mono',monospace; font-size:12px; color:rgba(255,255,255,.6); }

/* ------------------------------ about ----------------------------------- */
.about{ background:#fff; border-top:1px solid var(--line); }
.about .cols{ display:grid; grid-template-columns:1fr 1fr; gap:70px; align-items:center; }
.about .cols > *{ min-width:0; }
.about .lead{ font-size:18.5px; color:var(--mute); line-height:1.68; }
.about .nums{ display:grid; grid-template-columns:repeat(3,1fr); gap:20px; margin-top:34px; }
.about .nb .v{ font-size:40px; font-weight:700; letter-spacing:-.03em; color:var(--blue); }
.about .nb:nth-child(2) .v{ color:var(--red); }
.about .nb:nth-child(3) .v{ color:var(--navy); }
.about .nb .l{ font-size:13.5px; color:var(--mute); margin-top:3px; line-height:1.4; }
.about .vis{ background:var(--navy); border-radius:26px; min-height:380px; display:flex; align-items:center; justify-content:center; position:relative; overflow:hidden; }
.about .vis::after{ content:""; position:absolute; inset:0; background:radial-gradient(520px 320px at 68% 28%, rgba(43,95,214,.24), transparent 60%); }
.about .vis svg{ position:relative; z-index:2; }

/* ------------------------------ final cta ------------------------------- */
.fin{ text-align:center; padding-bottom:130px; }
.fin .box{ background:var(--navy); border-radius:28px; padding:84px 44px; position:relative; overflow:hidden; }
.fin .box::before{ content:""; position:absolute; inset:0; background-image:linear-gradient(rgba(255,255,255,.03) 1px, transparent 1px), linear-gradient(90deg, rgba(255,255,255,.03) 1px, transparent 1px); background-size:52px 52px; mask-image:radial-gradient(700px 420px at 50% 0%, #000 30%, transparent 78%); }
.fin .box::after{ content:""; position:absolute; inset:0; background:radial-gradient(700px 420px at 50% 0%, rgba(43,95,214,.26), transparent 60%); }
.fin h2{ position:relative; z-index:2; color:#fff; font-size:clamp(30px,4.4vw,52px); margin-bottom:20px; letter-spacing:-.03em; }
.fin p{ position:relative; z-index:2; color:rgba(255,255,255,.75); font-size:19px; max-width:600px; margin:0 auto 36px; line-height:1.6; }
.fin .acts{ position:relative; z-index:2; display:flex; gap:15px; justify-content:center; flex-wrap:wrap; }

/* ------------------------------ footer ---------------------------------- */
.ft{ background:var(--navy); color:rgba(255,255,255,.68); padding:76px 0 32px; }
.ft .top{ display:grid; grid-template-columns:1.5fr 1fr 1fr 1.2fr; gap:44px; padding-bottom:48px; border-bottom:1px solid rgba(255,255,255,.1); }
.ft .brand{ display:flex; align-items:center; gap:12px; color:#fff; }
.ft .brand b{ font-size:20px; }
.ft .brand b .c-b{ color:#5B82E4; } .ft .brand b .c-g{ color:#E05B52; }
.ft p.d{ font-size:14px; line-height:1.65; margin-top:18px; max-width:290px; }
.ft h5{ margin:0 0 20px; color:#fff; font-family:'Space Mono',monospace; font-size:12.5px; letter-spacing:.14em; text-transform:uppercase; font-weight:700; }
.ft ul{ list-style:none; margin:0; padding:0; display:grid; gap:12px; }
.ft ul a{ color:rgba(255,255,255,.68); font-size:14.5px; transition:color .15s; }
.ft ul a:hover{ color:#fff; }
.ft .ci{ display:flex; gap:12px; align-items:flex-start; font-size:14px; margin-bottom:14px; }
.ft .ci svg{ width:17px; height:17px; color:#5B82E4; flex:0 0 auto; margin-top:2px; }
.ft .bot{ padding-top:28px; display:flex; justify-content:space-between; gap:16px; flex-wrap:wrap; font-size:12.5px; color:rgba(255,255,255,.45); }

/* ------------------------------ superdoc -------------------------------- */
.sdoc{ background:var(--paper); border-top:1px solid var(--line); }
.sdoc .cols{ display:grid; grid-template-columns:1.06fr .94fr; gap:70px; align-items:center; }
.sdoc .cols > *{ min-width:0; }
.sdoc .cols > .shot{ order:-1; }
.sdoc .shot .win{ transform:none; }
.sdoc h2{ font-size:clamp(30px,3.6vw,44px); margin:20px 0 20px; }
.sdoc .lead{ font-size:18.5px; color:var(--mute); line-height:1.65; margin-bottom:4px; }
.doc-chips{ display:flex; flex-wrap:wrap; gap:9px; margin:24px 0 28px; }
.doc-chips span{ font-family:'Space Mono',monospace; font-size:12px; font-weight:700; letter-spacing:.05em; padding:9px 15px; border:1.5px solid var(--line-2); border-radius:10px; background:#fff; color:var(--navy); white-space:nowrap; }
.app .sd .tlogo{ font-weight:700; font-size:15.5px; color:#fff; margin:4px 4px 18px; letter-spacing:-.01em; }
.app .sd .tlogo i{ font-style:normal; color:#6E92E8; }
/* refina demo — refinador de itens */
.rdemo .rlabel{ font-family:'Space Mono',monospace; font-size:10.5px; font-weight:700; letter-spacing:.14em; text-transform:uppercase; color:var(--mute); margin:18px 0 9px; }
.rdemo .rout{ background:var(--blue-pale); border:1px solid #CBD9F5; border-radius:12px; padding:16px 18px; font-size:14.5px; line-height:1.62; color:#22355E; }
.rdemo .rmeta{ display:flex; gap:8px; margin-top:14px; flex-wrap:wrap; }

/* ------------------------------ reveal ---------------------------------- */
/* conteúdo sempre visível — sem gate de opacidade por JS */
.rv{ opacity:1; transform:none; }

/* ------------------------------ responsive ------------------------------ */
@media (max-width:1060px){
  .hero .cols, .prod .cols, .refina .cols, .about .cols, .sdoc .cols{ grid-template-columns:1fr; }
  .sdoc .cols > .shot{ order:2; }
  .comp .box{ grid-template-columns:1fr; padding:46px; }
  .fgrid{ grid-template-columns:1fr 1fr; }
  .fcell:nth-child(3n){ border-right:1px solid var(--line); }
  .fcell:nth-child(2n){ border-right:none; }
  .fcell:nth-child(n+4){ border-bottom:1px solid var(--line); }
  .fcell:nth-child(n+5){ border-bottom:none; }
  .hsteps{ grid-template-columns:1fr 1fr; }
  .shot .win{ transform:none; }
  .fc-a{ right:6px; } .fc-b{ left:6px; }
  .about .vis{ order:-1; min-height:300px; }
}
@media (max-width:960px){
  .hd nav, .hd .cta .btn-line{ display:none; }
  .hamb{ display:block; }
}
@media (max-width:700px){
  .sec{ padding:76px 0; }
  .wrap{ padding:0 24px; }
  .fgrid{ grid-template-columns:1fr; }
  .fcell{ border-right:none !important; border-bottom:1px solid var(--line) !important; }
  .fcell:last-child{ border-bottom:none !important; }
  .hsteps{ grid-template-columns:1fr; }
  .fcard{ display:none; }
  .comp .box{ padding:34px; }
  .ft .top{ grid-template-columns:1fr 1fr; }
  .hd .cta .btn-blue{ padding:10px 16px; font-size:13.5px; }
  .hero{ padding-top:80px; }
  .fin .box{ padding:64px 28px; }
}