  @font-face{font-family:'Inter';src:url('inter.woff2') format('woff2');
    font-weight:100 900;font-style:normal;font-display:swap;}
  :root{
    --canvas:#fbfbfc; --canvas-2:#f5f6f8; --panel:rgba(22,24,29,.025); --band:#eceef2;
    --ink:#16181d; --ink-2:#3d4350; --muted:#55596a; --faint:#62677a;
    --line:rgba(22,24,29,.18); --line-soft:rgba(22,24,29,.10);
    --indigo:#4f46e5; --indigo-bright:#4338ca; --indigo-solid:#3730a3;
    --hero-bg:#e8eaee;
    --ok:#0f9d63;--warn:#b7791f; --bad:#c0392b;
    --maxw:1180px;
    --charcoal: #ffffff;
    --charcoal-2: #f0f2f5;
    --space-section:64px;
    --space-section-sm:44px;
    --space-head:32px;
    --space-head-sm:22px;
    --space-hero-top:96px;
    --space-hero-bot:36px;
    --space-hero-top-sm:64px;
    --space-hero-bot-sm:26px;
  }
  *{margin:0;padding:0;box-sizing:border-box}
  html{scroll-behavior:smooth;scroll-padding-top:76px}
  :root{--ease-out:cubic-bezier(.23,1,.32,1);--ease-reveal:cubic-bezier(.22,1,.36,1);--ease-in-out:cubic-bezier(.77,0,.175,1)}
  body{font-family:'Inter',system-ui,sans-serif;background:#f4f5f7;color:var(--ink);
    -webkit-font-smoothing:antialiased;line-height:1.5;overflow-x:hidden}
  a{color:inherit;text-decoration:none}
  .wrap{max-width:var(--maxw);margin:0 auto;padding:0 32px}
  section+section{border-top:1px solid var(--line-soft)}
  .eyebrow{font-size:12px;font-weight:600;letter-spacing:.16em;text-transform:uppercase;color:var(--muted)}
  .muted{color:var(--muted)}
  h2.sec{font-size:34px;font-weight:600;letter-spacing:-.025em;line-height:1.15;font-style:normal;color:var(--ink)}
  .sec-sub{font-size:16px;color:var(--muted);margin-top:12px;max-width:560px}
  .center{text-align:center;margin:0 auto}
  .center .sec-sub{margin-left:auto;margin-right:auto}

  /* buttons (landing pages have real buttons) */
  .btn{display:inline-flex;align-items:center;gap:9px;font-weight:600;font-size:14.5px;
    padding:12px 20px;border-radius:8px;letter-spacing:.005em;cursor:pointer;border:1px solid transparent;transition:transform 160ms var(--ease-out)}
  .btn:active{transform:scale(.97)}
  @media (prefers-reduced-motion:reduce){
    .btn{transition:none}
    .btn:active{transform:none}
  }
  .btn svg{width:16px;height:16px;stroke-width:2.2}
  .btn-primary{background:linear-gradient(180deg,var(--indigo),var(--indigo-solid));color:#fff;
    box-shadow:0 1px 0 rgba(255,255,255,.25) inset}
  .btn-ghost{border-color:var(--line);color:var(--ink);background:rgba(22,24,29,.025)}

  /* card base */
  .card{position:relative;border:1px solid var(--line);border-radius:16px;
    background:var(--charcoal);box-shadow:0 1px 2px rgba(22,24,29,.05),0 3px 10px rgba(22,24,29,.07)}
  .card.lit::before{content:"";position:absolute;top:-1px;left:18px;right:18px;height:1px;
    background:linear-gradient(90deg,transparent,rgba(255,255,255,.16),transparent)}
  .tile{width:42px;height:42px;border-radius:11px;border:1px solid var(--line);
    background:rgba(22,24,29,.03);display:grid;place-items:center;color:var(--indigo-bright)}
  .tile svg{width:21px;height:21px;stroke-width:1.7}

  /* ---------- NAV ---------- */
  nav{position:sticky;top:0;z-index:50;border-bottom:1px solid var(--line);
    transition:background .35s ease,border-color .35s ease,backdrop-filter .35s ease}
  nav.scrolled{background:rgba(244,245,247,.82);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);border-bottom:1px solid var(--line)}
  nav.nav-inicio:not(.scrolled){background:var(--hero-bg)}
  nav .row{display:flex;align-items:center;justify-content:space-between;height:64px}
  .brand{display:flex;align-items:center;gap:11px}
  .brand .mk{width:30px;height:30px}
  .brand .wm{font-weight:700;font-size:19px;letter-spacing:-.03em}
  .brand .wm .lex{color:var(--indigo-bright)}
  .navlinks{display:flex;gap:30px;font-size:14px;color:var(--ink-2);font-weight:500}
  .navlinks a:hover{color:var(--ink)}
  .navcta{display:flex;align-items:center;gap:18px}
  .navcta .login{font-size:14px;color:var(--ink-2);font-weight:500}
  .btn:focus-visible{outline:2px solid var(--indigo-bright);outline-offset:2px}
  .login:focus-visible{outline:2px solid var(--indigo-bright);outline-offset:2px}
  a:focus-visible{outline:2px solid var(--indigo-bright);outline-offset:2px}

  /* Radar frontal fino estilo Linear */
  .hero-radar{position:relative;width:100%;max-width:380px;margin:0 auto;aspect-ratio:1}
  .rr-fr{position:relative;width:100%;max-width:355px;margin:0 auto;aspect-ratio:1}
  .rr-ring{position:absolute;border-radius:50%;border:2px solid rgba(67,56,202,.55)}
  .rr-ring.r1{inset:0}
  .rr-ring.r2{inset:17.5%;border-color:rgba(67,56,202,.35)}
  .rr-ring.r3{inset:35%;border-color:rgba(67,56,202,.22)}
  .rr-disc{position:absolute;inset:0;border-radius:50%;overflow:hidden;background:transparent}
  .rr-sweep3{position:absolute;inset:0;border-radius:50%;
    background:conic-gradient(from 0deg,rgba(22,24,29,.26),rgba(22,24,29,.04) 45deg,transparent 68deg);
    animation:rr-spin 7s linear infinite}
  .rr-center{position:absolute;top:50%;left:50%;width:6px;height:6px;margin:-3px;border-radius:50%;background:#16181d}
  @keyframes rr-spin{to{transform:rotate(360deg)}}
  .rr-blip{position:absolute;width:7px;height:7px;border-radius:50%;background:#16181d;transform:translate(-50%,-50%)}
  .rr-blip::before{content:"";position:absolute;inset:-5px;border-radius:50%;border:1.5px solid rgba(22,24,29,.6)}
  .rr-blip::after{content:"";position:absolute;inset:-5px;border-radius:50%;border:2px solid rgba(22,24,29,.65);animation:rr-ping 4s ease-out infinite}
  @keyframes rr-ping{0%{transform:scale(.7);opacity:.5}60%{transform:scale(2.1);opacity:0}100%{opacity:0}}
  .b1{top:20%;left:50%}.b2{top:77%;left:26%}.b2::after{animation-delay:1.3s}.b3{top:72%;left:75%}.b3::after{animation-delay:2.6s}
  .rr-card{position:absolute;display:flex;gap:10px;align-items:center;width:190px;max-width:calc(100% - 24px);opacity:0;transform:translateY(8px);pointer-events:none;
    background:var(--charcoal);border:1px solid var(--line);border-radius:12px;padding:10px 12px;backdrop-filter:blur(10px);
    box-shadow:0 1px 2px rgba(22,24,29,.04),0 8px 24px rgba(22,24,29,.08);
    transition:opacity 200ms cubic-bezier(.23,1,.32,1),transform 220ms cubic-bezier(.23,1,.32,1)}
  #rrc1{max-width:calc(54% - 16px)}
  #rrc3{max-width:calc(70% - 16px)}
  .rr-card.show{opacity:1;transform:translateY(0)}
  .rr-card .ic{width:25px;height:25px;flex:none;display:grid;place-items:center;border-radius:8px;border:1px solid var(--line);background:rgba(22,24,29,.03)}
  .rr-card .ic svg{width:14px;height:14px;color:var(--indigo-bright)}
  .rr-card h5{font-size:11.5px;font-weight:550;color:var(--ink);line-height:1.2;letter-spacing:-.01em}
  .rr-card p{font-size:10px;color:var(--muted);margin-top:3px;display:flex;align-items:center;gap:6px}
  .rr-card p .d{width:5px;height:5px;border-radius:50%}
  .d.ok{background:var(--ok)}.d.info{background:var(--indigo-bright)}.d.warn{background:var(--warn)}
  @media (prefers-reduced-motion:reduce){
    .rr-blip::after{animation:none;opacity:0}
    .rr-card{opacity:1;transform:none;position:absolute}
  }

  /* ---------- HERO ---------- */
  .hero{position:relative;padding:72px 0 56px;overflow:hidden;background:var(--hero-bg)}
  .hero .aurora{position:absolute;inset:0;pointer-events:none;z-index:0;
    background:
      radial-gradient(680px 460px at 76% 18%, rgba(79,70,229,.22), transparent 62%),
      radial-gradient(540px 420px at 30% 0%, rgba(74,111,208,.12), transparent 64%);}
  .hero .hero-grid{position:relative;z-index:1;display:grid;grid-template-columns:1.1fr .9fr;gap:64px;align-items:center}
  .hero h1{font-size:50px;line-height:1.05;letter-spacing:-.04em;font-weight:600;color:var(--ink);opacity:0}
  .hero h1 .hl{background:linear-gradient(100deg,var(--indigo-bright),var(--indigo-solid));-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent}
  .hero p.lead{font-size:17px;color:var(--ink-2);margin-top:20px;max-width:480px;line-height:1.55;opacity:0}
  .hero .acts{display:flex;gap:13px;margin-top:30px;opacity:0}
  .hero .trust{margin-top:26px;font-size:12.5px;color:var(--faint);display:flex;align-items:center;gap:9px}
  .hero .trust .d{width:6px;height:6px;border-radius:50%;background:var(--ok)}

  /* dashboard preview (claro) */
  .dash{border:1px solid var(--indigo);border-radius:16px;overflow:hidden;
    background:linear-gradient(180deg,#ffffff,#f0f2f5);box-shadow:0 1px 2px rgba(22,24,29,.04),0 18px 44px rgba(22,24,29,.10)}
  .dash.lit{position:relative}
  .dash .bar{display:flex;align-items:center;gap:7px;padding:11px 14px;border-bottom:1px solid var(--line-soft)}
  .dash .bar i{width:9px;height:9px;border-radius:50%;background:#c7cbd2}
  .dash .bar .t{margin-left:10px;font-size:11.5px;color:var(--ink-2)}
  .dash .body{padding:16px}
  .dash .dh{font-size:12px;color:var(--ink-2);font-weight:500;margin-bottom:11px}
  .feed{margin-top:14px;border:1px solid var(--line);border-radius:11px;overflow:hidden}
  .feed .fh{font-size:11px;color:var(--muted);font-weight:600;padding:10px 13px;border-bottom:1px solid var(--line-soft);letter-spacing:.02em}
  .frow{display:flex;align-items:center;gap:10px;padding:9px 13px;border-bottom:1px solid var(--line-soft)}
  .frow:last-child{border-bottom:0}
  .frow .fi{width:24px;height:24px;border-radius:7px;flex:none;display:grid;place-items:center;
    border:1px solid var(--line);background:rgba(22,24,29,.03);color:var(--indigo-bright)}
  .frow .fi svg{width:13px;height:13px;stroke-width:1.8}
  .frow .ft{flex:1}
  .frow .ft b{font-size:12px;font-weight:550;color:var(--ink);display:block;letter-spacing:-.01em}
  .frow .ft span{font-size:10px;color:var(--ink-2)}
  .frow .fm{font-size:10px;color:var(--faint);white-space:nowrap}

  /* ---------- SECTION SHELL ---------- */
  section{padding:var(--space-section) 0}
  section.banda{background:var(--band)}
  .section-head{text-align:center;margin-bottom:var(--space-head)}
  /* reveal animations */
  .reveal{opacity:0;transform:scale(.88);transition:opacity .7s ease,transform .7s cubic-bezier(.22,1,.36,1)}
  .reveal.in-view{opacity:1;transform:scale(1)}
  @media (prefers-reduced-motion:reduce){.reveal{opacity:1;transform:none;transition:none}}

  /* app dashboard mockup — vista "Mis procesos" */
  .appwin{display:grid;grid-template-columns:220px 1fr;border:1px solid var(--line);border-radius:16px;overflow:hidden;
    background:linear-gradient(180deg,var(--charcoal),var(--canvas));box-shadow:0 1px 2px rgba(22,24,29,.05),0 20px 50px rgba(22,24,29,.11)}
  .appwin .aside{border-right:1px solid var(--line-soft);padding:14px 12px;background:rgba(255,255,255,.012);display:flex;flex-direction:column}
  .appwin .alogo{display:flex;align-items:center;gap:9px;padding:6px 8px 16px}
  .appwin .alogo .mk{width:22px;height:22px}
  .appwin .alogo .wm{font-size:15px;font-weight:700;letter-spacing:-.02em}
  .appwin .alogo .wm .lex{color:var(--indigo-bright)}
  .appwin .anav{display:flex;align-items:center;gap:10px;padding:8px 10px;border-radius:8px;font-size:13px;color:var(--muted);font-weight:450;margin-bottom:2px}
  .appwin .anav svg{width:16px;height:16px;stroke-width:1.7;flex:none}
  .appwin .anav.active{background:rgba(92,138,230,.12);color:var(--ink);border:1px solid rgba(92,138,230,.22)}
  .appwin .asec{font-size:11px;color:var(--faint);padding:14px 10px 6px;display:flex;align-items:center;justify-content:space-between}
  .appwin .asec svg{width:13px;height:13px;stroke-width:1.7}
  .appwin .afoot{margin-top:auto;display:flex;align-items:center;gap:10px;padding:12px 8px 4px;border-top:1px solid var(--line-soft)}
  .appwin .afoot .av{width:26px;height:26px;border-radius:50%;background:rgba(255,255,255,.06);border:1px solid var(--line);display:grid;place-items:center;color:var(--muted);flex:none}
  .appwin .afoot .av svg{width:14px;height:14px;stroke-width:1.7}
  .appwin .afoot b{font-size:12.5px;font-weight:550;display:block;color:var(--ink-2)}
  .appwin .afoot small{font-size:10.5px;color:var(--faint)}
  .appwin .amain{display:flex;flex-direction:column;min-width:0}
  .appwin .atop{display:flex;align-items:center;gap:11px;padding:14px 18px;border-bottom:1px solid var(--line-soft)}
  .appwin .atop .ico{color:var(--faint);display:flex}.appwin .atop .ico svg{width:16px;height:16px;stroke-width:1.7}
  .appwin .atop .crumb{display:flex;align-items:center;gap:8px;font-size:13px;color:var(--muted)}
  .appwin .atop .crumb .cur{color:var(--ink);font-weight:550}
  .appwin .atop .crumb svg{width:14px;height:14px;stroke-width:1.7;color:var(--faint)}
  .appwin .atop .bell{margin-left:auto;color:var(--muted);display:flex}.appwin .atop .bell svg{width:17px;height:17px;stroke-width:1.7}
  .appwin .afilters{display:flex;align-items:center;gap:16px;padding:11px 18px;border-bottom:1px solid var(--line-soft);font-size:12px;color:var(--muted);flex-wrap:wrap}
  .appwin .afilters .fp{display:flex;align-items:center;gap:8px;color:var(--ink-2)}
  .appwin .afilters .fp svg{width:14px;height:14px;stroke-width:1.7;color:var(--faint)}
  .appwin .afilters .bar{width:52px;height:5px;border-radius:3px;background:rgba(255,255,255,.08);overflow:hidden}
  .appwin .afilters .bar i{display:block;height:100%;width:68%;background:var(--indigo)}
  .appwin .afilters .nv{display:flex;align-items:center;gap:6px;color:var(--faint)}
  .appwin .afilters .nv .dot{width:6px;height:6px;border-radius:50%;background:var(--faint)}
  .appwin .afilters .nv.on .dot{background:var(--warn)}
  .appwin .afilters .date{margin-left:auto;display:flex;align-items:center;gap:6px;color:var(--muted)}
  .appwin .afilters .date svg{width:14px;height:14px;stroke-width:1.7}
  .appwin .asearch{display:flex;align-items:center;gap:10px;padding:12px 18px;border-bottom:1px solid var(--line-soft)}
  .appwin .asearch .box{flex:1;display:flex;align-items:center;gap:9px;background:var(--canvas-2);border:1px solid var(--line-soft);border-radius:9px;padding:9px 12px;color:var(--faint);font-size:12.5px}
  .appwin .asearch .box svg{width:15px;height:15px;stroke-width:1.8}
  .appwin .asearch .fbtn{width:34px;height:34px;border-radius:9px;border:1px solid var(--line-soft);display:grid;place-items:center;color:var(--muted);flex:none}
  .appwin .asearch .fbtn svg{width:15px;height:15px;stroke-width:1.7}
  .appwin .atable{overflow-x:auto;width:100%}
  .appwin .thead,.appwin .trow{display:grid;grid-template-columns:24px 1.3fr 1.4fr 1.5fr 84px 74px 84px;gap:12px;align-items:center;padding:11px 18px;width:100%}
  .appwin .thead{font-size:10.5px;color:var(--faint);text-transform:uppercase;letter-spacing:.06em;font-weight:600;border-bottom:1px solid var(--line-soft)}
  .appwin .thead>span,.appwin .trow>span{min-width:0}
  .appwin .trow{border-bottom:1px solid var(--line-soft);font-size:12px}
  .appwin .trow:last-child{border-bottom:0}
  .appwin .trow .num{color:var(--faint)}
  .appwin .trow .rad{color:var(--ink-2);font-variant-numeric:tabular-nums;font-size:11px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
  .appwin .trow .juz{color:var(--muted);line-height:1.35;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
  .appwin .trow .par{color:var(--ink-2);line-height:1.35;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
  .appwin .trow .seg{justify-self:start;display:inline-flex;align-items:center;gap:6px;font-size:11px;color:var(--ink-2);border:1px solid var(--line);border-radius:999px;padding:3px 9px;background:rgba(255,255,255,.02);white-space:nowrap}
  .appwin .trow .seg .dot{width:6px;height:6px;border-radius:50%;background:var(--ok)}
  .appwin .trow .tag{justify-self:start;font-size:10.5px;color:var(--indigo-bright);border:1px solid rgba(92,138,230,.28);background:rgba(92,138,230,.08);border-radius:999px;padding:2px 8px}
  .appwin .trow .upd{color:var(--faint);font-size:11px}

  /* dashboard vivo */
  .appwin .trow{transition:background .3s ease}
  .appwin .trow:hover{background:rgba(255,255,255,.025)}
  .appwin .trow.live{background:rgba(92,138,230,.06)}
  .appwin .trow.live .seg{border-color:rgba(92,138,230,.4);color:var(--indigo-bright)}
  .appwin .trow.live .seg .dot{background:var(--indigo-bright);animation:dv-pulse 1.6s ease-out 2}
  @keyframes dv-pulse{0%{box-shadow:0 0 0 0 rgba(138,180,255,.45)}70%{box-shadow:0 0 0 6px rgba(138,180,255,0)}100%{box-shadow:0 0 0 0 rgba(138,180,255,0)}}
  .appwin .trow .upd.live{color:var(--indigo-bright)}
  .appwin .bell{position:relative}
  .dv-badge{position:absolute;top:-6px;right:-8px;background:var(--bad);color:var(--canvas);font-size:9px;font-weight:700;border-radius:50%;min-width:13px;height:13px;display:grid;place-items:center;padding:0 3px;opacity:0;transform:scale(.4);transition:opacity .35s ease,transform .45s cubic-bezier(.34,1.56,.64,1)}
  .dv-badge.on{opacity:1;transform:scale(1)}
  .appwin .nv.dv-live{color:var(--indigo-bright)}
  .appwin .nv.dv-live .dot{background:var(--indigo-bright)}
  .trow-det{overflow:hidden;max-height:0;transition:max-height .5s ease;border-bottom:1px solid var(--line-soft);background:rgba(92,138,230,.04)}
  .trow-det.open{max-height:64px}
  .trow-det .inner{display:flex;align-items:center;gap:10px;padding:9px 18px 9px 52px;font-size:11.5px}
  .trow-det .n2{color:var(--faint);font-size:11px}
  .trow-det b{font-weight:600;color:var(--ink)}
  .trow-det .fbadge{font-size:10px;color:var(--indigo-bright);background:rgba(92,138,230,.12);border-radius:5px;padding:1px 6px;font-weight:500;white-space:nowrap}
  .trow-det .flink{color:var(--indigo);font-weight:500;margin-left:auto;white-space:nowrap}
  .trow-det .ffecha{color:var(--faint);font-size:10.5px;font-variant-numeric:tabular-nums;white-space:nowrap}

  /* dashboard interactivo: pestañas */
  .appwin .anav{cursor:pointer;user-select:none;transition:color .2s,background .2s}
  .appwin .anav:hover{color:var(--ink-2);background:rgba(255,255,255,.03)}
  .appwin .vista{display:none}
  .appwin .vista.on{display:block}
  .vhome{padding:14px 18px}
  .vh-sal{font-size:16px;font-weight:700;letter-spacing:-.02em;color:var(--ink)}
  .vh-sal .sfecha{font-size:11.5px;color:var(--faint);font-weight:400;margin-left:8px}
  .vh-grid{display:grid;grid-template-columns:212px 1fr;gap:12px;margin-top:12px}
  .vh-left{display:flex;flex-direction:column;gap:10px;min-width:0}
  .vh-right{min-width:0}
  .vh-card{border:1px solid var(--line);border-radius:11px;background:rgba(255,255,255,.012);padding:11px 12px;min-width:0}
  .vh-card .k{font-size:10.5px;color:var(--muted)}
  .vh-card .v{font-size:18px;font-weight:700;letter-spacing:-.02em;margin-top:1px;color:var(--ink)}
  .vh-card .v small{font-size:10.5px;color:var(--faint);font-weight:400}
  .vh-card .s{font-size:10px;color:var(--faint);margin-top:1px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
  .vh-bar{height:3px;border-radius:2px;background:var(--line);margin-top:8px;position:relative;overflow:hidden}
  .vh-bar i{position:absolute;inset:0;width:68%;background:linear-gradient(90deg,var(--indigo-solid),var(--indigo-bright))}
  .vh-stats{display:grid;grid-template-columns:repeat(4,1fr);gap:10px}
  .vh-t{font-size:12px;font-weight:600;color:var(--ink-2);margin:10px 0 2px;display:flex;justify-content:space-between}
  .vh-t span{font-size:10.5px;color:var(--indigo);font-weight:500}
  .vh-mini .trow{grid-template-columns:20px 152px 1fr 84px;padding:6.5px 4px;font-size:11.5px}
  .cal .cal-h{display:flex;align-items:center;gap:8px;font-size:11.5px;color:var(--ink)}
  .cal .cal-h b{font-weight:600}
  .cal-nav{color:var(--faint)}
  .cal-hoy{margin-left:auto;font-size:9px;font-weight:600;border:1px solid var(--line);border-radius:6px;padding:2px 6px;color:var(--ink-2)}
  .cal-w,.cal-g{display:grid;grid-template-columns:repeat(7,1fr);text-align:center}
  .cal-w{font-size:9px;color:var(--faint);margin:8px 0 3px}
  .cal-g span{font-size:10px;color:var(--ink-2);padding:3px 0;position:relative;border-radius:5px}
  .cal-g .off{color:var(--faint);opacity:.5}
  .cal-g .hoy{background:rgba(255,255,255,.07);color:var(--ink);font-weight:600}
  .cal-g .d-act::after,.cal-g .d-fes::after{content:"";position:absolute;bottom:-1px;left:50%;transform:translateX(-50%);width:3px;height:3px;border-radius:50%}
  .cal-g .d-act::after{background:var(--indigo-bright)}
  .cal-g .d-fes{color:var(--bad)}
  .cal-g .d-fes::after{background:var(--bad)}
  .cal-leg{display:flex;gap:10px;font-size:9px;color:var(--faint);margin-top:8px;border-top:1px solid var(--line-soft);padding-top:8px}
  .cal-leg i{display:inline-block;width:4px;height:4px;border-radius:50%;margin-right:4px;vertical-align:middle}
  .cal-leg .li{background:var(--indigo-bright)}
  .cal-leg .lf{background:var(--bad)}
  .vh-card.mini .m-h{display:flex;justify-content:space-between;font-size:11px;font-weight:600;color:var(--ink)}
  .vh-card.mini .m-h span{font-size:9.5px;color:var(--indigo);font-weight:500}
  .vh-card.mini .m-b{font-size:10.5px;color:var(--muted);margin-top:4px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
  .vh-card.mini .rojo{color:var(--bad);font-weight:600}
  .vh-card.mini .ind{color:var(--indigo-bright);font-weight:600}
  .vband{display:grid;grid-template-columns:235px 1fr;height:100%}
  .vb-list{border-right:1px solid var(--line-soft);min-width:0}
  .vb-h{padding:11px 14px;border-bottom:1px solid var(--line-soft);font-size:12.5px;font-weight:600;color:var(--ink)}
  .vb-h span{color:var(--muted);font-weight:400;margin-left:6px;font-size:11.5px}
  .vb-g{padding:9px 14px 3px;font-size:10.5px;color:var(--muted)}
  .vb-item{display:flex;gap:9px;padding:9px 14px;align-items:flex-start}
  .vb-item.sel{background:rgba(255,255,255,.03)}
  .vb-ic{width:26px;height:26px;border-radius:7px;background:rgba(217,138,138,.1);border:1px solid rgba(217,138,138,.25);display:grid;place-items:center;flex:none}
  .vb-ic svg{width:13px;height:13px;color:var(--bad)}
  .vb-ic.done{background:rgba(103,199,154,.08);border-color:rgba(103,199,154,.25)}
  .vb-ic.done svg{color:var(--ok)}
  .vb-tx b{display:block;font-size:11.5px;font-weight:600;line-height:1.3;color:var(--ink)}
  .vb-tx span{font-size:10.5px;color:var(--faint)}
  .vb-tx.done b{color:var(--faint);text-decoration:line-through;font-weight:500}
  .vb-det{padding:16px 20px;display:flex;flex-direction:column;min-width:0}
  .vb-flag{display:flex;align-items:center;gap:8px;font-size:11px;margin-bottom:10px}
  .vb-flag .pill{border:1px solid rgba(217,138,138,.35);border-radius:999px;padding:2px 9px;display:inline-flex;align-items:center;gap:5px;color:var(--bad)}
  .vb-flag .fecha{color:var(--faint)}
  .vb-det h4{font-size:15px;font-weight:700;letter-spacing:-.015em;color:var(--ink)}
  .vb-det .partes{font-size:12px;color:var(--ink-2);margin-top:6px}
  .vb-det .meta{font-size:11px;color:var(--muted);margin-top:4px;overflow-wrap:anywhere}
  .vb-det .meta .rad{color:var(--ink-2)}
  .vb-nota{margin-top:14px;padding-top:12px;border-top:1px solid var(--line-soft)}
  .vb-nota .k{font-size:10px;letter-spacing:.08em;color:var(--faint);text-transform:uppercase}
  .vb-nota p{font-size:12px;color:var(--ink-2);margin-top:5px;max-width:520px}
  .vb-acts{display:flex;gap:8px;margin-top:auto;padding-top:18px;flex-wrap:wrap}
  .vb-btn{border:1px solid var(--line);border-radius:9px;padding:7px 13px;font-size:11.5px;font-weight:600;color:var(--ink);background:rgba(255,255,255,.02);display:inline-flex;align-items:center;gap:6px}
  .vb-btn.pri{background:linear-gradient(180deg,var(--indigo-bright),var(--indigo-solid));color:var(--canvas);border-color:transparent}
  .vb-btn.del{color:var(--bad);border-color:rgba(217,138,138,.3);margin-left:auto}
  .vbus{padding:32px 34px 24px}
  .vbus h4{font-size:19px;font-weight:700;letter-spacing:-.02em;color:var(--ink)}
  .vbus .s{font-size:12px;color:var(--muted);margin:4px 0 18px}
  .vbus .row{display:flex;gap:10px}
  .vbus .inp{flex:1;display:flex;align-items:center;gap:9px;border:1px solid var(--line);border-radius:10px;padding:11px 14px;font-size:12.5px;color:var(--faint);background:rgba(255,255,255,.015)}
  .vbus .inp svg{width:14px;height:14px;color:var(--muted);flex:none}
  .vbus .btn{border-radius:10px;padding:11px 20px;font-size:12.5px;font-weight:600;color:var(--canvas);background:linear-gradient(180deg,var(--indigo-bright),var(--indigo-solid))}
  .vbus .hint{display:flex;gap:6px;font-size:11px;color:var(--faint);margin-top:10px;flex-wrap:wrap}
  .vbus .hint .rad{overflow-wrap:anywhere}
  .vbus .add{display:flex;align-items:center;gap:11px;border:1px solid var(--line);border-radius:10px;padding:11px 14px;margin-top:18px;background:rgba(255,255,255,.015)}
  .vbus .add .plus{width:26px;height:26px;border-radius:50%;border:1px solid var(--line);display:grid;place-items:center;color:var(--muted);font-size:13px;flex:none}
  .vbus .add>div{min-width:0;flex:1}
  .vbus .add b{display:block;font-size:12px;font-weight:600;color:var(--ink)}
  .vbus .add span{font-size:11px;color:var(--muted)}
  .vbus .add .arr{margin-left:auto;color:var(--faint);flex:none}

  /* móvil: el dashboard escalado rompe los márgenes del contenedor, como Linear */
  @media (max-width:760px){
    .appscale{margin-left:-4px;margin-right:-16px}
  }
  @media (max-width:375px){
    .appscale{margin-left:0;margin-right:-12px}
  }
  /* modo compacto (solo activo cuando el dashboard está escalado) */
  .appwin.compact{grid-template-columns:128px 1fr}
  .appwin.compact .aside{padding:12px 7px}
  .appwin.compact .alogo{font-size:12px;padding:4px 8px 12px}
  .appwin.compact .anav{font-size:12px;padding:7px 8px;gap:7px}
  .appwin.compact .asec{padding:12px 8px 4px;font-size:9.5px}
  .appwin.compact .afoot{padding:8px;font-size:10.5px}
  /* compacto: sin columna Etiquetas, grilla de 6 */
  .appwin.compact .thead,.appwin.compact .trow{grid-template-columns:24px 1.3fr 1.4fr 1.5fr 84px 84px}
  .appwin.compact .thead span:nth-child(6),.appwin.compact .trow>span:nth-child(6){display:none}
  /* compacto: ajustes por vista */
  .appwin.compact .vhome{padding:12px 14px}
  .appwin.compact .vh-grid{grid-template-columns:186px 1fr;gap:10px;margin-top:10px}
  .appwin.compact .vh-stats{grid-template-columns:1fr 1fr;gap:8px}
  .appwin.compact .vh-card{padding:10px 11px}
  .appwin.compact .vh-mini .trow{grid-template-columns:18px 128px 1fr 72px;font-size:11px;padding:6px 3px}
  .appwin.compact .vband{grid-template-columns:200px 1fr}
  .appwin.compact .vb-det{padding:14px 16px}
  .appwin.compact .vb-nota p{max-width:none}
  .appwin.compact .vbus{padding:26px 22px 20px}

  /* antes / con */
  .compare{display:grid;grid-template-columns:1fr 1fr;gap:24px}
  .citem{display:flex;align-items:flex-start;gap:11px;padding:9px 0;font-size:14px;color:var(--ink-2)}
  .citem svg{width:17px;height:17px;flex:none;margin-top:1px;stroke-width:2}

  /* como funciona */
  .steps3{display:grid;grid-template-columns:repeat(3,1fr);gap:24px;align-items:stretch}
  .s3{position:relative;border:1px solid var(--line);border-radius:14px;padding:30px 28px 26px;background:linear-gradient(180deg,var(--charcoal),var(--charcoal-2));overflow:hidden}
  .s3 .bignum{position:absolute;top:-22px;right:8px;font-size:110px;font-weight:700;line-height:1;color:rgba(255,255,255,.035);letter-spacing:-5px;pointer-events:none}
  .s3 .ico{width:44px;height:44px;border-radius:11px;background:rgba(79,70,229,.10);border:1px solid rgba(79,70,229,.22);display:flex;align-items:center;justify-content:center;position:relative}
  .s3 .ico svg{width:21px;height:21px;stroke:var(--indigo-bright);fill:none;stroke-width:1.6}
  .s3 .lbl{color:var(--faint);font-size:11.5px;font-family:ui-monospace,monospace;letter-spacing:.06em;margin-top:20px}
  .s3 h3{font-size:18px;font-weight:600;letter-spacing:-.3px;margin:8px 0 8px}
  .s3 p{color:var(--muted);font-size:14px;line-height:1.55}
  @media (hover:hover) and (pointer:fine){
    .s3:hover{border-color:rgba(79,70,229,.3)}
  }

  /* testimonials */
  .tgrid{display:grid;grid-template-columns:repeat(2,1fr);gap:24px;max-width:900px;margin:0 auto}
  @media (max-width:760px){.tgrid{grid-template-columns:1fr}}
  .tcard{border:1px solid var(--line);border-radius:14px;background:var(--charcoal-2);box-shadow:0 1px 2px rgba(22,24,29,.05),0 3px 10px rgba(22,24,29,.07);position:relative;display:flex;flex-direction:column;overflow:hidden;transition:border-color .3s ease,opacity .7s ease,transform .7s cubic-bezier(.22,1,.36,1)}
  .tcard:hover{border-color:rgba(255,255,255,.14)}
  .tcard::before{content:"";position:absolute;top:-1px;left:18px;right:18px;height:1px;background:linear-gradient(90deg,transparent,rgba(255,255,255,.14),transparent)}
  .tcard .thead{display:flex;align-items:center;gap:14px;padding:18px 24px;border-bottom:1px solid var(--line-soft);background:rgba(255,255,255,.012)}
  .flogo{color:var(--muted);flex:none;display:grid;place-items:center;transition:color .3s ease}
  .tcard:hover .flogo{color:var(--ink-2)}
  .fdatos b{display:block;font-size:14px;font-weight:600;color:var(--ink);letter-spacing:-.01em}
  .fdatos span{font-size:11.5px;color:var(--muted)}
  .tcard .tbody{padding:20px 24px 26px;flex:1}
  .tcard .q{font-size:15px;color:var(--ink-2);line-height:1.75;letter-spacing:.005em}
  .q .ch{opacity:0;transition:opacity .18s ease}
  .q .ch.v{opacity:1}
  .q .caret{display:inline-block;width:1.5px;height:1.05em;background:var(--indigo-bright);vertical-align:-3px;margin-left:1px;animation:tblink .75s step-end infinite}
  .q.done .caret{opacity:0;animation:none;transition:opacity .4s ease}
  @keyframes tblink{50%{opacity:0}}
  .qo,.qc{font-family:Georgia,serif;font-size:1.65em;line-height:0;color:rgba(79,70,229,.45);vertical-align:-8px}
  .qo{margin-right:3px}
  .qc{margin-left:3px;opacity:0;transition:opacity .5s ease}
  .q.done .qc{opacity:1}
  .lg-delta svg{width:46px;height:39px}
  .lg-trejos{width:44px;height:40px;font-family:Georgia,'Times New Roman',serif;font-size:32px;font-weight:700;line-height:1;display:grid;place-items:center;position:relative;color:inherit}
  .lg-trejos::before{content:"";position:absolute;left:4px;top:6px;bottom:4px;width:7px;background:currentColor;opacity:.35;border-radius:1px}
  @media (prefers-reduced-motion:reduce){.q .ch{opacity:1;transition:none}}

  /* pricing */
  .plans{display:grid;grid-template-columns:repeat(3,1fr);gap:24px;align-items:start}
  .plan{border:1px solid var(--line);border-radius:12px;padding:24px;
    background:var(--charcoal);position:relative;transition:border-color 150ms ease,opacity .7s ease,transform .7s cubic-bezier(.22,1,.36,1);box-shadow:0 1px 2px rgba(22,24,29,.04),0 4px 16px rgba(22,24,29,.05)}
  @media (hover:hover) and (pointer:fine){
    .plan:hover{border-color:rgba(79,70,229,.4)}
  }
  .plan.pop{border:1.5px solid rgba(79,70,229,.35);border-top:2px solid var(--indigo);box-shadow:0 4px 24px rgba(79,70,229,.12);
    background:linear-gradient(180deg,rgba(79,70,229,.1),rgba(79,70,229,.02))}
  .plan .pop-badge{position:absolute;top:12px;right:12px;left:auto;transform:none;
    background:linear-gradient(180deg,var(--indigo),var(--indigo-solid));color:#fff;font-size:10.5px;font-weight:600;
    letter-spacing:.04em;padding:4px 12px;border-radius:999px}
  .plan .pn{font-size:16px;font-weight:600}
  .plan .pd{font-size:12.5px;color:var(--muted);margin-top:5px;min-height:34px}
  .plan .pp{font-size:34px;font-weight:600;letter-spacing:-.03em;margin:14px 0 2px;color:var(--ink)}
  .plan .pp span{font-size:14px;color:var(--muted);font-weight:400}
  .plan ul{list-style:none;margin:18px 0 22px;display:flex;flex-direction:column;gap:11px}
  .plan li{display:flex;gap:10px;font-size:13px;color:var(--ink-2)}
  .plan li svg{width:16px;height:16px;color:var(--indigo-bright);flex:none;stroke-width:2.2}
  .plan:nth-child(1) .pn,
  .plan:nth-child(1) .pd,
  .plan:nth-child(1) li{font-weight:450}
  .plan:nth-child(2) .pn,
  .plan:nth-child(2) .pd,
  .plan:nth-child(2) li{font-weight:550}
  .plan:nth-child(3) .pn,
  .plan:nth-child(3) .pd,
  .plan:nth-child(3) li{font-weight:450}
  .plan .btn{width:100%;justify-content:center}

  /* faq */
  .faq-head{text-align:center;max-width:640px;margin:0 auto 40px}
  .faq-list{max-width:720px;margin:0 auto;border-top:1px solid var(--line)}
  .fq{border-bottom:1px solid var(--line)}
  .fq summary{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:18px 4px;font-size:15.5px;font-weight:500;color:var(--ink);cursor:pointer;list-style:none;letter-spacing:-.01em;transition:color .2s ease}
  .fq summary::-webkit-details-marker{display:none}
  .fq summary:hover{color:var(--indigo-bright)}
  .fq-ic{position:relative;width:12px;height:12px;flex:none}
  .fq-ic::before,.fq-ic::after{content:"";position:absolute;background:var(--muted);transition:transform .3s ease}
  .fq-ic::before{left:0;top:5px;width:12px;height:1.5px}
  .fq-ic::after{left:5.25px;top:0;width:1.5px;height:12px}
  .fq[open] .fq-ic::after{transform:rotate(90deg)}
  .fq-a{overflow:hidden}
  .fq-a p{padding:0 4px 18px;font-size:14px;color:var(--muted);line-height:1.7;max-width:640px}

  /* cta banner */
  .ctab{position:relative;overflow:hidden;border:1px solid rgba(79,70,229,.14);border-radius:12px;padding:46px 50px;
    display:flex;align-items:center;justify-content:space-between;gap:32px;
    background:linear-gradient(180deg,#f4f5fb,#eef0f8)}
  .ctab::before{content:"";position:absolute;top:-1px;left:0;right:0;height:1px;background:linear-gradient(90deg,transparent,rgba(79,70,229,.25),transparent)}
  .ctab p{font-size:15px;color:var(--muted);margin-top:10px;max-width:440px}
  .ctab .acts{display:flex;gap:13px;flex:none}

  /* footer */
  footer{border-top:1px solid var(--line-soft);padding:54px 0 34px;margin-top:40px}
  .fgrid{display:grid;grid-template-columns:1.6fr 1fr 1fr;gap:30px}
  .fbrand .wm{font-weight:700;font-size:18px;letter-spacing:-.03em}
  .fbrand .wm .lex{color:var(--indigo-bright)}
  .fbrand p{font-size:13px;color:var(--muted);margin-top:12px;max-width:260px;line-height:1.5}
  .fcol h5{font-size:12px;font-weight:600;letter-spacing:.08em;text-transform:uppercase;color:var(--muted);margin-bottom:14px}
  .fcol a{display:block;font-size:13.5px;color:var(--ink-2);padding:5px 0}
  .fcol a:hover{color:var(--ink)}
  .fbottom{display:flex;align-items:center;justify-content:space-between;margin-top:40px;padding-top:22px;
    border-top:1px solid var(--line-soft);font-size:12px;color:var(--faint)}
  @media (max-width:760px){
    .ctab{flex-direction:column;align-items:flex-start;padding:34px 28px}
    .ctab .acts{flex-wrap:wrap;width:100%}
    .ctab .acts .btn{flex:1;justify-content:center}
    .fgrid{grid-template-columns:1fr;gap:28px}
    .fbottom{flex-direction:column;align-items:flex-start;gap:8px}
  }


    /* Hamburger menu - hidden on desktop */
  .hamburger {
    display: none;
  }
  

  
  /* Desktop defaults */
  .navcta {
    display: flex;
  }
  
  .navcta-item {
    display: none;
  }
  
/* ========== RESPONSIVE ADAPTATION ========== */
  
  /* TABLET: 768px - 1023px */
  @media (max-width: 1023px) {
    /* Hero: 2 columns -> 1 column */
    .hero .hero-grid { grid-template-columns: 1fr; gap: 32px; }
    
    /* Plans: 3 columns -> 2 columns */
    .plans { grid-template-columns: repeat(2, 1fr); }
    
    /* Steps: 5 columns -> 2-3 columns */
    .steps3 { grid-template-columns: repeat(2, 1fr); }

    /* Reduce padding on large elements */
    .plan { padding: 20px 18px; }
    .card { padding: 16px; }
    
    /* Font sizes slightly smaller */
    h1 { font-size: clamp(1.8rem, 5vw, 2.8rem); }
    .hero h1 { font-size: clamp(1.8rem, 5vw, 2.8rem); }
    h2.sec { font-size: clamp(1.4rem, 3.5vw, 1.8rem); }
  }
  
  /* MOBILE: up to 767px */
  @media (max-width: 767px) {
    /* Hide navcta from top bar */
    .navcta {
      display: none;
    }
    
    /* Style buttons inside dropdown menu */
    .navcta-item {
      width: 100% !important;
      padding: 12px 16px !important;
      display: flex !important;
      align-items: center;
      justify-content: center;
      min-height: 44px;
      border-bottom: 1px solid var(--line);
      margin: 0 !important;
      font-size: 16px;
    }
    
    .navcta-item:last-of-type {
      border-bottom: none;
    }
    
    /* Ghost button in menu - text only */
    .navcta-item.btn-ghost {
      background: transparent;
      color: var(--ink);
      border: none;
      border-bottom: 1px solid var(--line);
    }
    
    /* Primary button in menu - full width */
    .navcta-item.btn-primary {
      background: linear-gradient(180deg, var(--indigo), var(--indigo-solid));
      color: #fff;
      border: none;
      margin-top: 8px;
    }

    /* Hamburger button */
    .hamburger {
      display: flex;
      flex-direction: column;
      gap: 5px;
      background: transparent;
      border: none;
      cursor: pointer;
      padding: 8px;
      width: 44px;
      height: 44px;
      align-items: center;
      justify-content: center;
      position: relative;
      z-index: 100;
    }
    
    .hamburger span {
      display: block;
      width: 24px;
      height: 2px;
      background-color: var(--ink);
      transition: all 200ms ease-out;
      border-radius: 1px;
    }
    
    /* Hamburger active state (X shape) */
    .hamburger[aria-expanded="true"] span:nth-child(1) {
      transform: rotate(45deg) translateY(11px);
    }
    
    .hamburger[aria-expanded="true"] span:nth-child(2) {
      opacity: 0;
    }
    
    .hamburger[aria-expanded="true"] span:nth-child(3) {
      transform: rotate(-45deg) translateY(-11px);
    }
    
    /* Show navlinks when expanded */
    .hamburger[aria-expanded="true"] ~ #navlinks {
      display: flex !important;
      position: absolute;
      top: 100%;
      left: 0;
      right: 0;
      flex-direction: column;
      background: var(--canvas);
      border: 1px solid var(--line);
      border-top: none;
      border-radius: 0 0 8px 8px;
      padding: 12px 16px;
      gap: 8px;
      z-index: 99;
    }
    
    .hamburger[aria-expanded="true"] ~ #navlinks a {
      padding: 12px 0;
      display: block;
      min-height: 44px;
      display: flex;
      align-items: center;
      border-bottom: 1px solid var(--line);
    }
    
    .hamburger[aria-expanded="true"] ~ #navlinks a:last-child {
      border-bottom: none;
    }

    /* Nav: stack links vertically, hide secondary nav items */
    .navlinks { 
      display: none; 
    }
    
    .navcta { 
      flex-direction: column;
      gap: 8px;
      width: 100%;
    }
    
    .navcta a,
    .navcta .login {
      width: 100%;
      padding: 12px 16px;
      min-height: 44px;
      display: flex;
      align-items: center;
      justify-content: center;
    }
    
    /* Hero: 2 columns -> 1 column */
    .hero .hero-grid {
      grid-template-columns: 1fr;
      gap: 24px;
      padding: 0 16px;
    }
    
    /* Plans: 3 columns -> 1 column */
    .plans { 
      grid-template-columns: 1fr; 
      gap: 12px;
    }
    
    /* Steps: 5 columns -> 1 column */
    .steps3 { 
      grid-template-columns: 1fr; 
      gap: 16px;
    }
    
    /* Metrics: 1 column */
    .metrics { 
      grid-template-columns: 1fr;
      gap: 12px;
    }
    
    /* Cards and plans: reduce padding */
    .plan { 
      padding: 16px 12px;
      border-radius: 12px;
    }
    
    .card { 
      padding: 12px;
      border-radius: 8px;
    }
    
    /* Reduce hero padding */
    .hero { 
      padding: 48px 0 40px;
    }
    
    /* Font sizes optimized for mobile */
    h1 {
      font-size: clamp(1.4rem, 5vw, 2.2rem);
      line-height: 1.1;
    }
    .hero h1 {
      font-size: clamp(1.4rem, 5vw, 2.2rem);
      line-height: 1.1;
    }
    
    h3 {
      font-size: clamp(1rem, 3vw, 1.3rem);
    }
    
    /* Body text comfortable for mobile */
    body {
      font-size: 16px;
    }
    
    p { 
      line-height: 1.6;
      margin: 8px 0;
    }
    
    /* Buttons and interactive elements */
    .btn { 
      padding: 12px 20px;
      min-height: 44px;
      min-width: 44px;
      display: inline-flex;
      align-items: center;
      justify-content: center;
      font-size: 16px;
    }
    
    /* Touch targets >= 44px */
    button, a {
      min-height: 44px;
      min-width: 44px;
    }
    
    /* Spacing adjustments */
    .wrap {
      padding: 0 16px;
    }

    section {
      padding: var(--space-section-sm) 0;
    }

    body .section-head, body .cmp-head {
      margin-bottom: var(--space-head-sm);
    }

    body .hero-f, body .hero-p, body .hero-faq, body .hero-cont {
      padding: var(--space-hero-top-sm) 0 var(--space-hero-bot-sm);
    }

    /* Hide decorative elements that don't fit mobile if needed */
    .aurora {
      opacity: 0.5;
    }
    
    /* Modal/overlay safety areas */
    @supports (padding: max(0px)) {
      .hero,
      nav {
        padding-left: max(16px, env(safe-area-inset-left));
        padding-right: max(16px, env(safe-area-inset-right));
      }
    }
    
    /* Respect reduced motion */
    @media (prefers-reduced-motion: reduce) {
      * {
        animation-duration: 0.01ms !important;
        animation-iteration-count: 1 !important;
        transition-duration: 0.01ms !important;
      }
    }

    /* CTA: botones centrados y a su ancho natural, no estirados */
    .ctab .acts{flex-wrap:wrap;width:100%;justify-content:center;gap:10px}
    .ctab .acts .btn{flex:0 0 auto;width:auto;min-width:200px;max-width:100%}
    /* Hero: botones apilados pero centrados y contenidos, no de borde a borde */
    .hero .acts{flex-wrap:wrap;justify-content:center;gap:10px}
    .hero .acts .btn{flex:0 0 auto;width:auto;min-width:200px}

    /* radar compacto: motivo de marca, sin tarjetas */
    .hero-radar{max-width:200px}
    .rr-fr{max-width:188px}
    .hero-radar .rr-card{display:none}
    .rr-ring{border-width:1.5px}
  }

  /* SMALL MOBILE: 320px - 375px */
  @media (max-width: 375px) {
    /* Extra tight on very small screens */
    .wrap {
      padding: 0 12px;
    }
    
    .plan {
      padding: 12px 8px;
    }
    
    h1 {
      font-size: clamp(1.2rem, 5vw, 2rem);
    }
    .hero h1 {
      font-size: clamp(1.2rem, 5vw, 2rem);
    }
    
    .btn {
      font-size: 14px;
      padding: 10px 16px;
    }
  }

.hero .wrap{display:block}
#funciones{padding-top:8px}

/* ===== sección "la plataforma" ===== */
.pl-head{text-align:center;max-width:640px;margin:0 auto 48px}
.pl-grid{display:grid;grid-template-columns:0.9fr 1.1fr;gap:44px;align-items:start}
.pl-grid.flip{grid-template-columns:1.1fr 0.9fr}
.pl-sep{height:44px}
.pl-tx{padding-top:6px}
.pl-t{font-size:24px;font-weight:600;letter-spacing:-.02em;line-height:1.2}
.pl-lead{color:var(--muted);font-size:15.5px;line-height:1.65;margin-top:10px}

/* puntos: filas con división, como el dashboard */
.pl-pts{margin-top:22px;display:flex;flex-direction:column}
.pl-pt{padding:12px 0;border-top:1px solid var(--line-soft)}
.pl-pt:last-child{border-bottom:1px solid var(--line-soft)}
.pl-pt b{display:block;font-size:14px;font-weight:600;letter-spacing:-.01em}
.pl-pt span{display:block;font-size:13px;color:var(--muted);margin-top:3px;line-height:1.55}

/* chips de estado */
.pl-chips{display:flex;gap:8px;flex-wrap:wrap;margin-top:22px}
.pl-chip{display:inline-flex;align-items:center;gap:6px;font-size:11.5px;color:var(--ink-2);
  border:1px solid var(--line-soft);border-radius:999px;padding:4px 11px;background:var(--charcoal)}
.pl-d{width:6px;height:6px;border-radius:50%;flex:none}
.pl-d.ok,.pl-d.c0{background:var(--ok)}
.pl-d.c1{background:var(--warn)}
.pl-d.c2{background:var(--indigo)}
.pl-d.c3{background:var(--bad)}
.pl-d.c4{background:var(--faint)}

/* marco tintado + ventana blanca */
.pl-marco{border-radius:16px;padding:20px}
.pl-win{background:var(--charcoal);border:1px solid var(--line-soft);border-radius:11px;overflow:hidden;
  box-shadow:0 1px 2px rgba(22,24,29,.05),0 6px 18px rgba(22,24,29,.07);min-width:0}
.pl-h{display:flex;justify-content:space-between;align-items:center;gap:10px;padding:9px 13px;
  border-bottom:1px solid var(--line-soft);font-size:9px;font-weight:700;letter-spacing:.09em;
  text-transform:uppercase;color:var(--faint)}
.pl-hr{letter-spacing:.04em}
.pl-tools{display:flex;gap:7px;flex-wrap:wrap;padding:11px 13px 0}
.pl-b{display:inline-flex;align-items:center;gap:6px;font-size:11px;color:var(--ink-2);
  border:1px solid var(--line-soft);border-radius:999px;padding:4px 10px;background:var(--charcoal)}

/* tabla de actuaciones */
.pl-th,.pl-tr{display:grid;grid-template-columns:24px 1fr 84px 80px;gap:10px;padding:9px 13px}
.pl-th{border-bottom:1px solid var(--line);margin-top:11px;font-size:10px;font-weight:700;
  letter-spacing:.06em;text-transform:uppercase;color:var(--faint)}
.pl-tr{border-bottom:1px solid var(--line-soft);align-items:start;font-size:12.5px}
.pl-n{color:var(--faint);font-variant-numeric:tabular-nums}
.pl-desc b{font-weight:600;font-size:12.5px}
.pl-desc em{display:block;font-style:normal;font-size:11px;color:var(--faint);margin-top:3px;
  font-variant-numeric:tabular-nums}
.pl-tag{display:inline-block;font-size:9.5px;font-weight:600;color:var(--indigo-bright);
  background:rgba(79,70,229,.08);border:1px solid rgba(79,70,229,.2);border-radius:4px;
  padding:1px 6px;margin-left:6px;vertical-align:1px}
.pl-link{font-size:11.5px;color:var(--indigo-bright);font-weight:500}
.pl-none{color:var(--faint)}
.pl-date{font-size:11.5px;color:var(--muted);font-variant-numeric:tabular-nums}
.pl-foot{display:flex;justify-content:space-between;padding:11px 13px;font-size:11px;
  color:var(--faint);border-top:1px solid var(--line-soft)}
.pl-foot-c{justify-content:center;color:var(--indigo-bright);font-weight:500}

/* recordatorios */
.pl-grp{padding:9px 13px;font-size:10px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;
  color:var(--faint);border-bottom:1px solid var(--line-soft)}
.pl-rr{display:grid;grid-template-columns:26px 1fr auto;gap:10px;align-items:start;padding:11px 13px;
  border-bottom:1px solid var(--line-soft)}
.pl-ic{width:26px;height:26px;border-radius:50%;border:1px solid var(--line-soft);display:grid;
  place-items:center;color:var(--bad)}
.pl-ic svg{width:13px;height:13px}
.pl-rt b{display:block;font-size:12px;font-weight:600;line-height:1.3}
.pl-rt em{display:block;font-style:normal;font-size:11px;color:var(--faint);margin-top:2px}
.pl-due{font-size:10.5px;color:var(--bad);white-space:nowrap}

@media (max-width:900px){
  .pl-grid,.pl-grid.flip{grid-template-columns:1fr;gap:28px}
  .pl-grid.flip .pl-marco{order:2}
  .pl-sep{height:28px}
  .pl-th,.pl-tr{grid-template-columns:22px 1fr 74px}
  .pl-th span:last-child,.pl-tr .pl-date{display:none}
  .pl-t{font-size:20px}
}

/* fuentes oficiales — marquesina continua */
.f-eyebrow{text-align:center;font-size:11px;font-weight:600;letter-spacing:.14em;text-transform:uppercase;color:var(--muted);margin:56px 0 26px}
.fuentes-marq{position:relative;overflow:hidden;-webkit-mask-image:linear-gradient(90deg,transparent,#000 10%,#000 90%,transparent);mask-image:linear-gradient(90deg,transparent,#000 10%,#000 90%,transparent)}
.f-track{display:inline-flex;align-items:center;white-space:nowrap;will-change:transform;animation:f-desliza 40s linear infinite}
@keyframes f-desliza{from{transform:translateX(0)}to{transform:translateX(-25%)}}
.f-item{display:inline-flex;align-items:center;gap:12px;font-size:22px;font-weight:650;letter-spacing:-.015em;color:var(--ink);white-space:nowrap;padding-right:68px}
.f-ic{width:24px;height:24px;flex:none;color:var(--indigo-bright)}
@media (prefers-reduced-motion:reduce){.f-track{animation:none;justify-content:center;flex-wrap:wrap;gap:20px 40px;width:100%}}
@media (max-width:767px){.f-item{font-size:18px;padding-right:52px}.f-ic{width:20px;height:20px}}

/* cobertura */
.cobertura .lead{color:var(--muted);font-size:16px;line-height:1.6;margin-bottom:24px}
.cobertura .trial{display:inline-flex;align-items:center;gap:8px;background:rgba(79,70,229,.10);border:1px solid rgba(79,70,229,.28);color:var(--indigo-bright);border-radius:999px;padding:6px 14px;font-size:13px;font-weight:500;margin-top:26px}
.cobertura .trial .d{width:7px;height:7px;border-radius:50%;background:var(--indigo-bright)}
.cf-head{text-align:center;max-width:640px;margin:0 auto 44px}
/* ===== franja "cómo funciona" ===== */
.pasos{display:grid;grid-template-columns:repeat(3,1fr);gap:26px;align-items:stretch}
.pcol{display:flex;flex-direction:column}
.marco{border-radius:14px;padding:22px 20px;display:flex;align-items:center;justify-content:center;min-height:214px}
.tinte-a{background:rgba(79,70,229,.09)}
.tinte-b{background:rgba(22,24,29,.055)}
.tinte-c{background:rgba(180,140,60,.10)}
.pcol h3{font-size:17px;font-weight:600;letter-spacing:-.015em;margin-top:20px}
.pcol>p{font-size:13.5px;color:var(--muted);margin-top:8px;line-height:1.6;flex:1}
.mas{align-self:flex-start;margin-top:16px;font-size:12.5px;font-weight:500;color:var(--ink-2);
  background:rgba(22,24,29,.05);border:1px solid var(--line-soft);border-radius:8px;padding:7px 13px;
  transition:background .15s,color .15s}
.mas:hover{background:rgba(22,24,29,.08);color:var(--ink)}

/* mini-panel: lenguaje del dashboard */
.pm-mini{width:100%;background:var(--charcoal);border:1px solid var(--line-soft);border-radius:9px;
  box-shadow:0 1px 2px rgba(22,24,29,.05),0 6px 18px rgba(22,24,29,.07);overflow:hidden}
.pm-h{padding:8px 11px;border-bottom:1px solid var(--line-soft);
  font-size:9px;font-weight:700;letter-spacing:.09em;text-transform:uppercase;color:var(--faint)}
.pm-b{padding:10px 11px;display:flex;flex-direction:column;gap:9px}
.pm-in{display:flex;align-items:center;gap:7px;border:1px solid var(--line-soft);border-radius:6px;
  padding:7px 9px;font-size:10.5px;color:var(--faint)}
.pm-in svg{width:12px;height:12px;flex:none}
.pm-btn{align-self:flex-start;background:var(--indigo);color:#fff;font-size:10.5px;font-weight:600;
  padding:6px 11px;border-radius:6px}
.pm-foot{font-size:10px;color:var(--indigo-bright);border-top:1px solid var(--line-soft);padding-top:9px}
.pm-top{display:flex;justify-content:space-between;align-items:center;gap:8px}
.pm-rad{font-size:10px;color:var(--ink-2);font-variant-numeric:tabular-nums;letter-spacing:-.01em}
.pm-time{font-size:10px;color:var(--faint);flex:none}
.pm-body b{display:block;font-size:11.5px;font-weight:600;line-height:1.3}
.pm-body span{display:block;font-size:10px;color:var(--faint);margin-top:3px}
.pm-pillrow{border-top:1px solid var(--line-soft);padding-top:9px}
.pm-bell{position:relative;display:inline-flex;color:var(--ink-2)}
.pm-bell svg{width:14px;height:14px}
.pm-badge{position:absolute;top:-4px;right:-6px;background:var(--bad);color:#fff;font-size:8px;
  font-weight:700;border-radius:999px;padding:0 3px;line-height:1.5;font-variant-numeric:tabular-nums}
.pm-pill{display:inline-flex;align-items:center;gap:5px;font-size:9.5px;font-weight:500;color:var(--ink-2);
  border:1px solid var(--line-soft);border-radius:5px;padding:2px 7px}
.pm-pill.nv{color:var(--indigo-bright);border-color:rgba(79,70,229,.32);background:rgba(79,70,229,.06)}
.pm-dot{width:5px;height:5px;border-radius:50%;flex:none}
.pm-dot.ok{background:var(--ok)}
.pm-dot.nv{background:var(--indigo)}

@media (max-width:860px){
  .pasos{grid-template-columns:1fr;gap:22px}
  .marco{min-height:0}
}
.faq-more{display:flex;justify-content:center;margin-top:28px}
.navlinks a[aria-current="page"]{color:var(--ink)}
.hero > .wrap{position:relative;z-index:2}
.hero-bg{position:absolute;inset:0;pointer-events:none;z-index:0}
.hero-bg .grid{position:absolute;inset:0;background-image:linear-gradient(rgba(79,70,229,.06) 1px,transparent 1px),linear-gradient(90deg,rgba(79,70,229,.06) 1px,transparent 1px);background-size:52px 52px;-webkit-mask-image:radial-gradient(120% 100% at 15% 20%,#000 30%,transparent 78%);mask-image:radial-gradient(120% 100% at 15% 20%,#000 30%,transparent 78%)}
.hero-bg .glow1{position:absolute;right:-160px;top:-120px;width:720px;height:520px;border-radius:50%;background:radial-gradient(closest-side,rgba(79,70,229,.13),transparent)}
.hero-bg .glow2{position:absolute;left:20%;bottom:-220px;width:640px;height:420px;border-radius:50%;background:radial-gradient(closest-side,rgba(79,70,229,.06),transparent)}

/* ===== interruptor de tema de la vista previa del dashboard (solo .appwin) ===== */
.atheme{appearance:none;-webkit-appearance:none;display:flex;align-items:center;gap:8px;width:100%;margin:0 0 8px;padding:8px 10px;border:1px solid var(--line);border-radius:9px;background:rgba(255,255,255,.03);color:var(--muted);font:inherit;font-size:12px;cursor:pointer;transition:background-color .2s,color .2s,border-color .2s}
.atheme:hover{color:var(--ink)}
.atheme-ic{display:inline-flex;width:15px;height:15px;flex:none}
.atheme-ic svg{width:15px;height:15px}
.atheme .atheme-moon{display:inline-flex}
.atheme .atheme-sun{display:none}
.appwin--light .atheme{background:rgba(0,0,0,.04);border-color:rgba(0,0,0,.1);color:#5b6070}
.appwin--light .atheme:hover{color:#1a1c22}
.appwin--light .atheme .atheme-moon{display:none}
.appwin--light .atheme .atheme-sun{display:inline-flex}
.appwin--dark .atheme-sun{display:none}
.appwin--dark .atheme-moon{display:inline-flex}

/* transición suave del cambio de tema */
.appwin,.appwin *{transition:background-color .25s ease,color .25s ease,border-color .25s ease}

/* tokens de color oscuros, solo dentro del dashboard: restauran el modo oscuro real
   sin reescribir las reglas base (que ya usan var(--...)) */
.appwin--dark{
  --canvas:#08090a;
  --canvas-2:#0a0b0e;
  --panel:rgba(255,255,255,.03);
  --ink:#f7f8f8;
  --ink-2:#c7c9d1;
  --muted:#888d98;
  --faint:#6b7080;
  --line:rgba(255,255,255,.08);
  --line-soft:rgba(255,255,255,.05);
  --indigo:#5c8ae6;
  --indigo-bright:#8ab4ff;
  --indigo-solid:#4a6fd0;
  --charcoal:#0e0f13;
  --charcoal-2:#0b0c0f;
  background:linear-gradient(180deg,#0e0f13,#0b0c0f);
}

.appwin--dark .alogo{color:#ffffff}
.appwin--dark .alogo .wm .lex,
.appwin--dark .alogo .mk circle{color:#818cf8;fill:#818cf8}

/* fondo de la ventana y del sidebar */
.appwin--light{background:linear-gradient(180deg,#ffffff,#f6f7f9)}
.appwin--light .aside{background:#f0f2f5;border-right-color:rgba(0,0,0,.08)}

/* logo interno */
.appwin--light .alogo{color:#16181d}
.appwin--light .alogo .wm .lex{color:#4338ca}

/* navegación del sidebar */
.appwin--light .anav{color:#5b6070}
.appwin--light .anav:hover{color:#1a1c22;background:rgba(0,0,0,.035)}
.appwin--light .anav.active{background:rgba(92,138,230,.12);color:#1a1c22;border-color:rgba(92,138,230,.3)}
.appwin--light .asec{color:#6b7080}
.appwin--light .afoot{border-top-color:rgba(0,0,0,.08)}
.appwin--light .afoot .av{background:rgba(0,0,0,.05);border-color:rgba(0,0,0,.1);color:#5b6070}
.appwin--light .afoot b{color:#383c46}
.appwin--light .afoot small{color:#6b7080}

/* barra superior y filtros */
.appwin--light .atop{border-bottom-color:rgba(0,0,0,.08)}
.appwin--light .atop .ico{color:#6b7080}
.appwin--light .atop .crumb{color:#5b6070}
.appwin--light .atop .crumb .cur{color:#1a1c22}
.appwin--light .atop .crumb svg{color:#6b7080}
.appwin--light .atop .bell{color:#5b6070}
.appwin--light .afilters{border-bottom-color:rgba(0,0,0,.08);color:#5b6070}
.appwin--light .afilters .fp{color:#383c46}
.appwin--light .afilters .fp svg{color:#6b7080}
.appwin--light .afilters .bar{background:rgba(0,0,0,.08)}
.appwin--light .afilters .nv{color:#6b7080}
.appwin--light .afilters .nv .dot{background:#6b7080}
.appwin--light .afilters .date{color:#5b6070}
.appwin--light .asearch{border-bottom-color:rgba(0,0,0,.08)}
.appwin--light .asearch .box{background:#f6f7f9;border-color:rgba(0,0,0,.08);color:#6b7080}
.appwin--light .asearch .fbtn{border-color:rgba(0,0,0,.08);color:#5b6070}

/* tabla de procesos */
.appwin--light .thead{color:#6b7080;border-bottom-color:rgba(0,0,0,.08)}
.appwin--light .trow{border-bottom-color:rgba(0,0,0,.08)}
.appwin--light .trow .num{color:#6b7080}
.appwin--light .trow .rad{color:#383c46}
.appwin--light .trow .juz{color:#5b6070}
.appwin--light .trow .par{color:#383c46}
.appwin--light .trow .seg{color:#383c46;border-color:rgba(0,0,0,.1);background:rgba(0,0,0,.025)}
.appwin--light .trow .tag{color:var(--indigo-solid);border-color:rgba(92,138,230,.3);background:rgba(92,138,230,.08)}
.appwin--light .trow .upd{color:#6b7080}
.appwin--light .trow:hover{background:rgba(0,0,0,.03)}
.appwin--light .trow.live{background:rgba(92,138,230,.1)}
.appwin--light .trow.live .seg{border-color:rgba(92,138,230,.4);color:var(--indigo-solid)}
.appwin--light .trow .upd.live{color:var(--indigo-solid)}
.appwin--light .nv.dv-live{color:var(--indigo-solid)}
.appwin--light .trow-det{background:rgba(92,138,230,.06);border-bottom-color:rgba(0,0,0,.08)}
.appwin--light .trow-det .n2{color:#6b7080}
.appwin--light .trow-det b{color:#1a1c22}
.appwin--light .trow-det .fbadge{color:var(--indigo-solid);background:rgba(92,138,230,.12)}
.appwin--light .trow-det .flink{color:var(--indigo-solid)}
.appwin--light .trow-det .ffecha{color:#6b7080}

/* vista "Inicio" */
.appwin--light .vh-sal{color:#1a1c22}
.appwin--light .vh-sal .sfecha{color:#6b7080}
.appwin--light .vh-card{background:#f6f7f9;border-color:rgba(0,0,0,.08)}
.appwin--light .vh-card .k{color:#5b6070}
.appwin--light .vh-card .v{color:#1a1c22}
.appwin--light .vh-card .v small{color:#6b7080}
.appwin--light .vh-card .s{color:#6b7080}
.appwin--light .vh-bar{background:rgba(0,0,0,.08)}
.appwin--light .vh-t{color:#383c46}
.appwin--light .cal .cal-h{color:#1a1c22}
.appwin--light .cal-nav{color:#6b7080}
.appwin--light .cal-hoy{color:#383c46;border-color:rgba(0,0,0,.1)}
.appwin--light .cal-w{color:#6b7080}
.appwin--light .cal-g span{color:#383c46}
.appwin--light .cal-g .off{color:#6b7080}
.appwin--light .cal-g .hoy{background:rgba(0,0,0,.06);color:#1a1c22}
.appwin--light .cal-g .d-fes{color:#b91c1c}
.appwin--light .cal-g .d-fes::after{background:#b91c1c}
.appwin--light .cal-leg{color:#6b7080;border-top-color:rgba(0,0,0,.08)}
.appwin--light .vh-card.mini .m-h{color:#1a1c22}
.appwin--light .vh-card.mini .m-b{color:#5b6070}
.appwin--light .vh-card.mini .rojo{color:#b91c1c}

/* vista "Bandeja" */
.appwin--light .vb-list{border-right-color:rgba(0,0,0,.08)}
.appwin--light .vb-h{color:#1a1c22;border-bottom-color:rgba(0,0,0,.08)}
.appwin--light .vb-h span{color:#5b6070}
.appwin--light .vb-g{color:#5b6070}
.appwin--light .vb-item.sel{background:rgba(0,0,0,.035)}
.appwin--light .vb-ic svg{color:#b91c1c}
.appwin--light .vb-ic.done svg{color:#15803d}
.appwin--light .vb-tx b{color:#1a1c22}
.appwin--light .vb-tx span{color:#6b7080}
.appwin--light .vb-tx.done b{color:#6b7080}
.appwin--light .vb-flag .pill{color:#b91c1c;border-color:rgba(185,28,28,.35)}
.appwin--light .vb-flag .fecha{color:#6b7080}
.appwin--light .vb-det h4{color:#1a1c22}
.appwin--light .vb-det .partes{color:#383c46}
.appwin--light .vb-det .meta{color:#5b6070}
.appwin--light .vb-det .meta .rad{color:#383c46}
.appwin--light .vb-nota{border-top-color:rgba(0,0,0,.08)}
.appwin--light .vb-nota .k{color:#6b7080}
.appwin--light .vb-nota p{color:#383c46}
.appwin--light .vb-btn{color:#1a1c22;border-color:rgba(0,0,0,.1);background:rgba(0,0,0,.03)}
.appwin--light .vb-btn.del{color:#b91c1c;border-color:rgba(185,28,28,.3)}

/* vista "Buscar" */
.appwin--light .vbus h4{color:#1a1c22}
.appwin--light .vbus .s{color:#5b6070}
.appwin--light .vbus .inp{color:#6b7080;border-color:rgba(0,0,0,.1);background:rgba(0,0,0,.02)}
.appwin--light .vbus .inp svg{color:#5b6070}
.appwin--light .vbus .hint{color:#6b7080}
.appwin--light .vbus .add{border-color:rgba(0,0,0,.1);background:rgba(0,0,0,.02)}
.appwin--light .vbus .add .plus{border-color:rgba(0,0,0,.1);color:#5b6070}
.appwin--light .vbus .add b{color:#1a1c22}
.appwin--light .vbus .add span{color:#5b6070}
.appwin--light .vbus .add .arr{color:#6b7080}

/* inicio: tarjeta de plan con número de casos (versión de 3) */
.plans-3home{display:grid;grid-template-columns:repeat(3,1fr);gap:22px}
.plans-3home .plan{text-align:center;position:relative}
.plan-casos{font-size:34px;font-weight:700;line-height:1;color:var(--ink);text-align:center;padding:6px 0 14px;border-bottom:1px solid var(--line-soft)}
.plan-casos span{display:block;font-size:12px;font-weight:500;color:var(--muted);margin-top:4px}
.plans-3home .pn{margin-top:12px}
.planes-more{display:flex;justify-content:center;margin-top:30px}
@media (max-width:820px){.plans-3home{grid-template-columns:1fr;max-width:420px;margin:0 auto}}

/* hero: micro-línea de confianza */
.hero-trust{margin-top:16px;font-size:13px;color:var(--faint);letter-spacing:.01em}
@media (max-width:767px){.hero-trust{font-size:12px}}

/* ===== EXPERIMENTO modo claro — brillos ambientales apagados =====
   Reversible: borrar este bloque para volver al estado anterior. */
.hero-bg .glow1,
.hero-bg .glow2{display:none}
.hero-bg .grid{display:none}
