/* Componentes: tarjetas, chips, botones, métricas, terminal */
  ::selection { background:rgba(122,162,255,.3); color:#fff; }
  h1,h2 { text-wrap:balance; }
  body { letter-spacing:-.005em; -webkit-font-smoothing:antialiased; }
  .grad-text { background:linear-gradient(100deg,#8fb0ff,#6cd0ff); -webkit-background-clip:text; background-clip:text; color:transparent; }
  .acc { font-weight:600; color:#8fb0ff; margin-top:.05em; }
  .num { font-weight:600; font-size:2.75rem; line-height:1; color:#fff; letter-spacing:-.04em; }
  .eyebrow { display:flex; align-items:center; gap:.75rem; margin-bottom:1.1rem; font-size:.72rem; font-weight:600; letter-spacing:.16em; text-transform:uppercase; color:#7aa2ff; }
  .eyebrow::before { content:""; width:1.75rem; height:1px; background:#7aa2ff; opacity:.7; }
  .glow { background:radial-gradient(55% 45% at 75% 0%,rgba(59,108,255,.20),transparent 70%); }
  .btn-solid { background:#fff !important; color:#09090b !important; box-shadow:none !important; }
  .btn-solid:hover { background:#e4e4e7 !important; filter:none !important; }
  .btn-solid::after { display:none; }
  article.card { background:transparent !important; border-color:rgba(255,255,255,.08) !important; border-radius:1.25rem; padding:1.75rem !important; }
  article.card:hover { background:rgba(255,255,255,.025) !important; border-color:rgba(255,255,255,.2) !important; }
  #proceso li { background:transparent !important; border-color:rgba(255,255,255,.08) !important; }
  #proceso li > span { color:#7aa2ff; letter-spacing:.14em; text-transform:uppercase; font-size:.7rem; }
  #app-grid article > div:first-child > div:first-child { filter:saturate(.8); border-radius:1rem; }
  #app-grid article a { background:transparent; }
  .rv { opacity:0; transform:translateY(20px); transition:opacity .9s cubic-bezier(.2,.7,.2,1), transform .9s cubic-bezier(.2,.7,.2,1); }
  .rv.in { opacity:1; transform:none; }
  @media (prefers-reduced-motion:reduce){ .rv{ opacity:1; transform:none; transition:none; } }
  #rot { display:inline-block; transition:opacity .35s, transform .35s; }
  #rot.out { opacity:0; transform:translateY(8px); }
  .card { position:relative; }
  .card::before { content:""; position:absolute; inset:0; border-radius:inherit; background:radial-gradient(380px circle at var(--x,50%) var(--y,0%),rgba(122,162,255,.12),transparent 45%); opacity:0; transition:opacity .3s; pointer-events:none; }
  .card:hover::before { opacity:1; }
  .shot { position:relative; display:flex; justify-content:center; align-items:flex-end; height:12rem; margin:-.25rem -.25rem 1.5rem; border-radius:1rem; overflow:hidden; perspective:700px; }
  .shot svg { width:7.5rem; height:auto; transform:translateY(14%) rotateX(var(--rx,0deg)) rotateY(var(--ry,0deg)); transition:transform .45s cubic-bezier(.2,.7,.2,1); filter:drop-shadow(0 18px 30px rgba(0,0,0,.55)); }
  .card:hover .shot svg { transform:translateY(3%) rotateX(var(--rx,0deg)) rotateY(var(--ry,0deg)); }
  .shot img { width:100%; height:100%; object-fit:cover; }
  .fchip { border:1px solid rgba(255,255,255,.1); border-radius:9999px; padding:.5rem 1.1rem; font-size:.85rem; color:#a1a1aa; transition:all .2s; }
  .fchip:hover { color:#fff; border-color:rgba(255,255,255,.3); }
  .fchip[aria-pressed="true"] { background:#fff; color:#09090b; border-color:#fff; }
  .appear { animation:appear .5s cubic-bezier(.2,.7,.2,1) both; }
  @keyframes appear { from { opacity:0; transform:translateY(14px); } to { opacity:1; transform:none; } }
  .px { transition:transform .35s ease-out; }
  .pf { animation:pfloat 7s ease-in-out infinite; }
  @keyframes pfloat { 50% { transform:translateY(-12px); } }
  .mq-wrap { -webkit-mask-image:linear-gradient(90deg,transparent,#000 12%,#000 88%,transparent); mask-image:linear-gradient(90deg,transparent,#000 12%,#000 88%,transparent); }
  .marquee { display:flex; gap:3.5rem; width:max-content; animation:mq 45s linear infinite; }
  .marquee:hover { animation-play-state:paused; }
  .mq-i { font-size:1.05rem; font-weight:500; color:#52525b; white-space:nowrap; transition:color .2s; }
  .mq-i:hover { color:#e4e4e7; }
  @keyframes mq { to { transform:translateX(-50%); } }
  .ln { opacity:0; transition:opacity .25s var(--d,0ms); }
  .play .ln { opacity:1; }
  @media (prefers-reduced-motion:reduce){ .pf,.marquee,.appear{ animation:none; } .ln{ opacity:1; transition:none; } }