:root { color-scheme: light; --ink:#0B0D11; --ink2:#3E4652; --muted:#6B7380; --line:#E3E6EB; --line2:#CFD5DE; --paper:#F6F7F9; --blue:#0091FF; --blue2:#007AD9; --pale:#7FD3FF; --wash:#E9F4FF; --wa:#25D366; --sans:"Instrument Sans","Helvetica Neue",Arial,sans-serif; --serif:"Instrument Serif",Georgia,serif; --ease:cubic-bezier(.16,1,.3,1); --wrap:1180px; --pad:clamp(20px,5vw,32px); --nav:84px; }
* { box-sizing: border-box; } html { scroll-behavior: smooth; scroll-padding-top: 76px; }
body { margin:0; background:#fff; color:var(--ink); font-family:var(--sans); font-size:17px; line-height:1.6; -webkit-font-smoothing:antialiased; } body.lock { overflow:hidden; }
img { display:block; max-width:100%; } a { color:inherit; text-decoration:none; } p,h1,h2,h3,h4,figure,dl,dd { margin:0; } ul { list-style:none; margin:0; padding:0; } button { font:inherit; color:inherit; }
em { font-family:var(--serif); font-style:italic; font-weight:400; letter-spacing:-.01em; }
:where(a,button,summary,input,select,textarea):focus-visible { outline:2px solid var(--blue); outline-offset:3px; border-radius:6px; }
.wrap { max-width:var(--wrap); margin:0 auto; padding:0 var(--pad); }
.k { font-size:.78rem; font-weight:600; letter-spacing:.14em; text-transform:uppercase; color:var(--muted); }
.lede { font-size:clamp(1.05rem,1.5vw,1.2rem); color:var(--ink2); max-width:54ch; }
h1,h2 { font-weight:500; letter-spacing:-.04em; text-wrap:balance; } h1 { font-size:clamp(2.6rem,6vw,5rem); line-height:.99; } h2 { font-size:clamp(2rem,4.2vw,3.3rem); line-height:1.04; } h3 { font-weight:600; font-size:1.25rem; letter-spacing:-.015em; }
h1 em,h2 em { color:var(--blue); }
.btn { --bg: var(--ink); --fg: #FFFFFF; --bd: var(--ink); --sw: #FFFFFF; --sf: var(--ink); position: relative; isolation: isolate; overflow: hidden; display: inline-flex; align-items: center; justify-content: center; gap: 9px; min-height: 52px; padding: 0 28px; border: 0; border-radius: 999px; cursor: pointer; font-weight: 600; font-size: 0.98rem; line-height: 1.2; text-align: center; background: var(--bg); color: var(--fg); transition: color 0.4s ease; }
.btn::before { content: ""; position: absolute; inset: 0; z-index: -1; background: var(--sw); transform: scaleX(0); transform-origin: left; transition: transform 0.55s var(--ease); }
.btn::after { content: ""; position: absolute; inset: 0; border-radius: inherit; box-shadow: inset 0 0 0 1.5px var(--bd); pointer-events: none; }
.btn:hover { color: var(--sf); } .btn:hover::before { transform: scaleX(1); }
.btn:focus-visible { outline: 2px solid var(--ink); outline-offset: 3px; }
.btn .arr { transition: translate 0.3s var(--ease); } .btn:hover .arr { translate: 4px 0; }
.btn.blue { --bg: var(--ink); --bd: var(--ink); --sw: #FFFFFF; --sf: var(--ink); }
.btn.line { --bg: #FFFFFF; --fg: var(--ink); --bd: var(--ink); --sw: var(--ink); --sf: #FFFFFF; }
.btn.white { --bg: #FFFFFF; --fg: var(--ink); --bd: #FFFFFF; --sw: var(--ink); --sf: #FFFFFF; }
.btn.wa { --bg: var(--wa); --bd: var(--wa); --sw: #FFFFFF; --sf: #1BA854; }
.btn.sm { min-height: 44px; padding: 0 22px; font-size: 0.92rem; }
.btn[disabled] { opacity: 0.6; cursor: progress; }
.band { padding:clamp(60px,8vw,100px) 0; } .band.paper { background:var(--paper); }
.head { display:flex; flex-direction:column; gap:14px; margin-bottom:clamp(28px,4vw,48px); max-width:760px; }
@keyframes open { from { opacity:0; translate:0 -6px; } }
.js [data-rv] { opacity:0; translate:0 26px; transition:opacity .9s var(--ease),translate .9s var(--ease); transition-delay:var(--d,0ms); } .js [data-rv].in { opacity:1; translate:0 0; }

.nav { position:sticky; top:0; z-index:80; height:var(--nav); background:rgba(255,255,255,.92); backdrop-filter:blur(14px); -webkit-backdrop-filter:blur(14px); border-bottom:1px solid var(--line); }
.nav-in { height:var(--nav); display:flex; align-items:center; gap:24px; } .nav-in img { height:52px; width:auto; } @media (max-width:700px) { :root { --nav:72px; } .nav-in img { height:44px; } }
.nav-links { display:flex; gap:24px; margin-left:auto; font-size:.95rem; color:var(--ink2); } .nav-links a { white-space:nowrap; } .nav-links a:hover,.nav-links a[aria-current] { color:var(--ink); }
.nav-links a[aria-current] { box-shadow:0 1.5px 0 var(--blue); }
.burger { display:none; width:46px; height:46px; border:0; background:transparent; border-radius:10px; position:relative; cursor:pointer; }
.burger i { position:absolute; left:12px; right:12px; height:1.8px; background:var(--ink); border-radius:2px; transition:transform .4s var(--ease),top .4s var(--ease); } .burger i:nth-child(1) { top:19px; } .burger i:nth-child(2) { top:26px; }
.burger[aria-expanded="true"] i:nth-child(1) { top:22.5px; transform:rotate(45deg); } .burger[aria-expanded="true"] i:nth-child(2) { top:22.5px; transform:rotate(-45deg); }
@media (max-width:980px) { .nav-links { display:none; } .nav-in .btn { margin-left:auto; } .burger { display:block; } }
.menu { position:fixed; inset:0; z-index:70; background:#fff; padding:calc(var(--nav) + 22px) var(--pad) 28px; display:flex; flex-direction:column; justify-content:space-between; gap:24px; overflow-y:auto; visibility:hidden; opacity:0; transition:opacity .35s ease,visibility 0s linear .35s; }
.menu.open { visibility:visible; opacity:1; transition:opacity .35s ease; } .menu nav { display:flex; flex-direction:column; }
.menu nav a { font-size:clamp(1.9rem,8.5vw,2.6rem); font-weight:500; letter-spacing:-.035em; padding:14px 0; border-bottom:1px solid var(--line); opacity:0; translate:0 18px; transition:opacity .5s ease,translate .6s var(--ease); } .menu.open nav a { opacity:1; translate:0 0; transition-delay:calc(var(--k)*60ms + 100ms); }
.menu-foot { display:flex; flex-direction:column; gap:12px; } .menu-foot .btn { width:100%; }

.crumb { display:flex; gap:8px; flex-wrap:wrap; font-size:.9rem; color:var(--muted); margin-bottom:22px; } .crumb a:hover { color:var(--blue); }
.hero { padding:clamp(40px,6vw,80px) 0 clamp(36px,5vw,64px); } .hero-grid { display:grid; grid-template-columns:minmax(0,1.15fr) minmax(0,.85fr); gap:clamp(28px,5vw,72px); align-items:center; }
@media (max-width:900px) { .hero-grid { grid-template-columns:1fr; } }
.hero h1 { margin:14px 0 18px; } .tags { display:flex; gap:8px; flex-wrap:wrap; } .tags span { padding:6px 12px; border-radius:999px; background:#EEF0F3; color:var(--ink2); font-size:.84rem; font-weight:500; } .tags .b { background:var(--wash); color:var(--blue2); font-weight:600; }
.cta { display:flex; flex-wrap:wrap; gap:10px; margin-top:26px; }
.ph { border-radius:24px; overflow:hidden; aspect-ratio:4/3; background:var(--paper); box-shadow:0 30px 60px -30px rgba(11,13,17,.35); } .ph img { width:100%; height:100%; object-fit:cover; }

.outs { display:grid; grid-template-columns:repeat(3,1fr); gap:16px; } @media (max-width:820px) { .outs { grid-template-columns:1fr; } }
.out { border:1px solid var(--line); border-radius:20px; padding:26px; background:#fff; } .out b { display:block; font-weight:500; font-size:clamp(1.8rem,3vw,2.4rem); letter-spacing:-.035em; line-height:1.05; } .out b em { color:var(--blue); } .out span { color:var(--ink2); }

.two { display:grid; grid-template-columns:minmax(0,1.1fr) minmax(0,.9fr); gap:clamp(28px,5vw,72px); } @media (max-width:900px) { .two { grid-template-columns:1fr; } }
.list { display:flex; flex-direction:column; } .list li { display:grid; grid-template-columns:34px 1fr; gap:12px; padding:16px 0; border-top:1px solid var(--line); } .list li:first-child { border-top:0; padding-top:0; }
.list .n { font-weight:600; font-size:1.2rem; line-height:1.4; color:var(--blue); font-variant-numeric:tabular-nums; } .list p { color:var(--ink); }
.ticks { display:flex; flex-direction:column; gap:10px; color:var(--ink2); } .ticks li { display:grid; grid-template-columns:16px 1fr; gap:10px; } .ticks li::before { content:""; width:8px; height:8px; margin-top:.55em; border-radius:50%; background:var(--blue); }
.card { background:var(--paper); border-radius:22px; padding:clamp(24px,3vw,36px); align-self:start; } .card h3 { font-weight:500; font-size:1.7rem; letter-spacing:-.035em; margin-bottom:12px; }
.spec { margin-top:6px; } .spec > div { display:flex; justify-content:space-between; gap:16px; padding:13px 0; border-top:1px solid var(--line2); } .spec dt { color:var(--muted); } .spec dd { text-align:right; font-weight:500; }
.when { border:1px solid var(--line); border-radius:22px; overflow:hidden; background:#fff; } .when-row { display:grid; grid-template-columns:1.1fr 1.5fr 1fr; gap:14px; padding:18px clamp(20px,3vw,32px); border-top:1px solid var(--line); align-items:baseline; } .when-row:first-child { border-top:0; }
.when-row b { font-weight:600; } .when-row span { color:var(--ink2); } .when-row .c { color:var(--blue2); font-weight:600; } @media (max-width:700px) { .when-row { grid-template-columns:1fr; gap:2px; } }
.when-f { padding:18px clamp(20px,3vw,32px); background:var(--paper); display:flex; justify-content:space-between; align-items:center; gap:14px; flex-wrap:wrap; color:var(--ink2); font-size:.96rem; }
.incl { display:grid; grid-template-columns:repeat(3,1fr); gap:14px; } @media (max-width:900px) { .incl { grid-template-columns:1fr 1fr; } } @media (max-width:560px) { .incl { grid-template-columns:1fr; } }
.incl li { display:grid; grid-template-columns:22px 1fr; gap:12px; padding:20px; border:1px solid var(--line); border-radius:16px; background:#fff; } .incl svg { color:var(--blue); margin-top:3px; } .incl b { display:block; font-weight:600; } .incl span { color:var(--ink2); font-size:.93rem; }
.tips { display:grid; grid-template-columns:repeat(4,1fr); gap:14px; } @media (max-width:900px) { .tips { grid-template-columns:1fr 1fr; } } @media (max-width:560px) { .tips { grid-template-columns:1fr; } }
.tip { border-top:1.5px solid var(--ink); padding-top:14px; } .tip b { display:block; font-weight:600; margin-bottom:4px; } .tip span { color:var(--ink2); font-size:.95rem; }
.nextprev { display:grid; grid-template-columns:1fr 1fr; gap:14px; } @media (max-width:640px) { .nextprev { grid-template-columns:1fr; } }
.np { display:flex; flex-direction:column; gap:4px; padding:22px 24px; border:1px solid var(--line); border-radius:18px; transition:border-color .3s ease,transform .4s var(--ease); } .np:hover { border-color:var(--ink); transform:translateY(-3px); }
.np small { color:var(--muted); font-size:.8rem; font-weight:600; letter-spacing:.1em; text-transform:uppercase; } .np b { font-weight:500; font-size:1.5rem; letter-spacing:-.03em; } .np.r { text-align:right; }
.cta-band { background:var(--blue); color:#fff; text-align:center; padding:clamp(60px,9vw,110px) 0; position:relative; overflow:hidden; } .cta-band::before { content:""; position:absolute; width:800px; height:800px; left:50%; top:-40%; translate:-50% 0; background:radial-gradient(closest-side,rgba(21,185,253,.7),transparent 70%); } .cta-band .wrap { position:relative; }
.cta-band h2 { max-width:16ch; margin:0 auto; } .cta-band h2 em { color:#fff; opacity:.85; } .cta-band p { margin:18px auto 28px; color:rgba(255,255,255,.85); max-width:46ch; }
.cta-band .row { display:flex; gap:10px; justify-content:center; flex-wrap:wrap; }

/* empresas */
.sectors { display:grid; grid-template-columns:repeat(3,1fr); gap:14px; } @media (max-width:820px) { .sectors { grid-template-columns:1fr 1fr; } } @media (max-width:520px) { .sectors { grid-template-columns:1fr; } }
.sec { padding:22px; border-radius:18px; background:var(--paper); } .sec b { display:block; font-weight:500; font-size:1.35rem; letter-spacing:-.025em; } .sec span { color:var(--ink2); font-size:.94rem; }
.probs { display:grid; grid-template-columns:1fr 1fr; gap:0; border-top:1px solid var(--ink); } @media (max-width:760px) { .probs { grid-template-columns:1fr; } }
.prob { padding:24px 24px 24px 0; border-bottom:1px solid var(--line); } .prob:nth-child(even) { padding-left:24px; border-left:1px solid var(--line); } @media (max-width:760px) { .prob:nth-child(even) { padding-left:0; border-left:0; } }
.prob small { color:var(--muted); font-size:.78rem; font-weight:600; letter-spacing:.12em; text-transform:uppercase; } .prob b { display:block; font-weight:500; font-size:1.35rem; letter-spacing:-.025em; margin:4px 0 6px; } .prob span { color:var(--ink2); }
.funcs { display:grid; grid-template-columns:repeat(2,1fr); gap:16px; } @media (max-width:760px) { .funcs { grid-template-columns:1fr; } }
.func { border:1px solid var(--line); border-radius:22px; padding:28px; background:#fff; } .func h3 { font-weight:500; font-size:1.7rem; letter-spacing:-.035em; margin-bottom:6px; } .func > p { color:var(--ink2); margin-bottom:14px; }
.steps { display:grid; grid-template-columns:repeat(4,1fr); gap:14px; counter-reset:s; } @media (max-width:900px) { .steps { grid-template-columns:1fr 1fr; } } @media (max-width:560px) { .steps { grid-template-columns:1fr; } }
.step { border-radius:20px; background:var(--ink); color:#fff; padding:24px; } .step .n { font-weight:600; font-size:2.4rem; line-height:1; color:var(--pale); font-variant-numeric:tabular-nums; } .step b { display:block; font-weight:500; font-size:1.3rem; letter-spacing:-.02em; margin:10px 0 6px; } .step span { color:rgba(255,255,255,.68); font-size:.95rem; }
.demo { background:var(--ink); color:#fff; border-radius:26px; padding:clamp(28px,5vw,56px); display:flex; justify-content:space-between; align-items:center; gap:28px; flex-wrap:wrap; position:relative; overflow:hidden; }
.demo::before { content:""; position:absolute; width:520px; height:520px; right:-160px; top:-240px; background:radial-gradient(closest-side,rgba(0,145,255,.5),transparent 70%); pointer-events:none; } .demo > * { position:relative; } .demo h2 em { color:var(--pale); } .demo > div { max-width:560px; }
.chk { display:flex; gap:12px; align-items:flex-start; padding:12px 14px; border:1px solid var(--line); border-radius:12px; cursor:pointer; font-size:.98rem; line-height:1.4; } .chk input { width:20px; height:20px; margin:1px 0 0; accent-color:var(--ink); flex:none; }
.formcard { background:#fff; border:1px solid var(--line); border-radius:24px; padding:clamp(22px,3.2vw,40px); box-shadow:0 30px 70px -30px rgba(11,13,17,.2); max-width:820px; margin:0 auto; }
.fields { display:flex; flex-direction:column; gap:14px; margin-top:22px; } .field { display:flex; flex-direction:column; gap:6px; } .field label { font-size:.74rem; font-weight:600; letter-spacing:.1em; text-transform:uppercase; color:var(--muted); }
.field input,.field select,.field textarea { width:100%; padding:13px 14px; font-family:var(--sans); font-size:1rem; color:var(--ink); background:#fff; border:1px solid var(--line); border-radius:10px; } .field input:focus,.field select:focus,.field textarea:focus { outline:none; border-color:var(--blue); box-shadow:0 0 0 3px rgba(0,145,255,.15); }
.field select { appearance:none; padding-right:36px; background-image:linear-gradient(45deg,transparent 50%,var(--muted) 50%),linear-gradient(135deg,var(--muted) 50%,transparent 50%); background-position:calc(100% - 19px) 50%,calc(100% - 14px) 50%; background-size:5px 5px; background-repeat:no-repeat; }
.field.bad input { border-color:#D93A2B; } .err { color:#D93A2B; font-size:.85rem; } .err:empty { display:none; }
.row2 { display:grid; grid-template-columns:1fr 1fr; gap:14px; } @media (max-width:560px) { .row2 { grid-template-columns:1fr; } }
.actions { display:grid; grid-template-columns:1.4fr 1fr; gap:10px; margin-top:18px; } @media (max-width:560px) { .actions { grid-template-columns:1fr; } }
.fnote { margin-top:12px; font-size:.85rem; color:var(--muted); } .fnote.bad { color:#D93A2B; } .hp { position:absolute; left:-9999px; width:1px; height:1px; overflow:hidden; }
.thanks { display:none; text-align:center; padding:34px 6px; flex-direction:column; align-items:center; gap:14px; } .formcard.sent form { display:none; } .formcard.sent .thanks { display:flex; animation:open .6s var(--ease); }
.thanks .ok { width:64px; height:64px; border-radius:50%; display:grid; place-items:center; background:var(--wash); color:var(--blue); }

footer { border-top:1px solid var(--line); padding:48px 0 28px; background:var(--paper); } .foot { display:grid; grid-template-columns:1.5fr 1fr 1fr 1fr; gap:28px; } @media (max-width:860px) { .foot { grid-template-columns:1fr 1fr; } } @media (max-width:520px) { .foot { grid-template-columns:1fr; } }
.foot img { height:64px; width:auto; margin-bottom:14px; } .foot p,.foot a { display:block; color:var(--ink2); font-size:.95rem; line-height:1.7; } .foot a:hover { color:var(--blue); } .foot h4 { font-size:.74rem; font-weight:600; letter-spacing:.12em; text-transform:uppercase; color:var(--muted); margin:0 0 10px; }
.foot-b { display:flex; justify-content:space-between; flex-wrap:wrap; gap:8px; margin-top:34px; padding-top:16px; border-top:1px solid var(--line); font-size:.86rem; color:var(--muted); }
.wa-float { position:fixed; right:18px; bottom:18px; z-index:75; height:60px; min-width:60px; padding:0 20px 0 16px; border-radius:999px; display:flex; align-items:center; gap:10px; background:var(--wa); color:#fff; font-weight:600; box-shadow:0 12px 28px rgba(37,211,102,.4); transition:background .2s ease; } .wa-float:hover { background:#1EB558; } .wa-float .lbl { font-size:.95rem; white-space:nowrap; max-width:0; overflow:hidden; transition:max-width .5s var(--ease); } .wa-float:hover .lbl { max-width:240px; }
.thero { padding:calc(var(--nav) + 34px) 0 8px; } .thero .lede { max-width:56ch; margin-top:14px; }
.thero h1 { font-size:clamp(2.4rem,6vw,4.6rem); max-width:16ch; }
.qz { max-width:760px; margin:0 auto; background:#fff; border:1px solid var(--line); border-radius:24px; padding:clamp(22px,4vw,44px); box-shadow:0 30px 70px -30px rgba(11,13,17,.2); }
.q-screen[hidden] { display:none; }
.q-start-grid { display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr); gap:clamp(24px,4vw,44px); align-items:start; } @media (max-width:700px) { .q-start-grid { grid-template-columns:1fr; } }
.qz h2 { font-size:clamp(1.7rem,3vw,2.3rem); }
.qz .ticks { display:flex; flex-direction:column; gap:12px; margin-top:16px; color:var(--ink2); } .qz .ticks li { display:grid; grid-template-columns:22px 1fr; gap:10px; } .qz .ticks li::before { display:none; } .qz .ticks svg { color:var(--blue); margin-top:2px; }
.q-start-form { display:flex; flex-direction:column; gap:12px; }
.q-start-form label { font-weight:600; font-size:.9rem; } .q-start-form .opt { font-weight:400; color:var(--muted); }
.q-start-form input { height:52px; border:1.5px solid var(--line); border-radius:14px; padding:0 16px; font:inherit; background:#fff; color:var(--ink); } .q-start-form input:focus-visible { outline:2px solid var(--ink); outline-offset:2px; }
.q-hint { color:var(--muted); font-size:.88rem; }
.q-top { display:flex; justify-content:space-between; align-items:center; gap:12px; font-size:.9rem; color:var(--muted); font-weight:600; }
.q-back { border:0; background:none; font:inherit; font-weight:600; color:var(--ink); cursor:pointer; padding:6px 0; } .q-back:disabled { opacity:.3; cursor:default; }
.q-bar { height:4px; border-radius:9px; background:var(--line); margin:14px 0 30px; overflow:hidden; } .q-bar i { display:block; height:100%; width:0; background:var(--ink); border-radius:9px; transition:width .5s var(--ease); }
.q-body { transition:opacity .22s ease, translate .22s ease; } .q-body.out { opacity:0; translate:0 10px; }
.q-instr { font-size:.78rem; font-weight:600; letter-spacing:.12em; text-transform:uppercase; color:var(--muted); }
.q-text { font-family:var(--serif); font-size:clamp(1.9rem,4vw,2.8rem); line-height:1.08; margin:10px 0 26px; outline:none; }
.q-opts { display:grid; gap:10px; }
.q-opt { display:flex; align-items:center; gap:14px; text-align:left; width:100%; padding:14px 16px; border-radius:14px; border:1.5px solid var(--line); background:#fff; color:var(--ink); font:inherit; font-weight:500; font-size:1.02rem; cursor:pointer; transition:background .25s ease, color .25s ease, border-color .25s ease, translate .25s var(--ease); }
.q-opt:hover { border-color:var(--ink); translate:4px 0; } .q-opt:focus-visible { outline:2px solid var(--ink); outline-offset:2px; }
.q-opt .key { width:28px; height:28px; border-radius:8px; display:grid; place-items:center; background:var(--paper); font-size:.82rem; font-weight:600; flex:none; transition:background .25s ease, color .25s ease; }
.q-opt[aria-pressed="true"] { background:var(--ink); border-color:var(--ink); color:#fff; } .q-opt[aria-pressed="true"] .key { background:#fff; color:var(--ink); }
.q-result-grid { display:grid; grid-template-columns:auto minmax(0,1fr); gap:clamp(22px,4vw,40px); align-items:center; } @media (max-width:640px) { .q-result-grid { grid-template-columns:1fr; justify-items:start; } }
.ring-wrap { position:relative; width:150px; height:150px; } .ring { width:100%; height:100%; rotate:-90deg; } .ring circle { fill:none; stroke-width:9; }
.ring-bg { stroke:var(--line); } .ring-fg { stroke:var(--blue); stroke-linecap:round; stroke-dasharray:326.73; stroke-dashoffset:326.73; transition:stroke-dashoffset 1.4s var(--ease); }
.ring-label { position:absolute; inset:0; display:grid; place-content:center; text-align:center; } .ring-label span { font-size:2.6rem; font-weight:600; line-height:1; } .ring-label small { color:var(--muted); font-size:.82rem; }
.q-result-copy { display:flex; flex-direction:column; gap:14px; align-items:flex-start; } .q-result-copy .cta { display:flex; flex-wrap:wrap; gap:10px; }
@media (prefers-reduced-motion:reduce) { .q-body, .q-bar i, .ring-fg, .q-opt { transition:none; } }
@media (prefers-reduced-motion:reduce) { html { scroll-behavior:auto; } .js [data-rv] { opacity:1; translate:none; transition:none; } }
