/* Generado por prod/css.py — extraido de index.html. No editar a mano:
   se regenera desde la portada para que no deriven. */
/* Bricolage Grotesque, subconjuntada a las letras que usamos: 39,7 KB -> 17,3 KB.
   Va como ARCHIVO y no embebida en base64 porque la CSP del sitio declara
   font-src 'self', que no admite data:. Y swap para que el titular se lea desde
   el primer fotograma con la del sistema mientras llega. */
@font-face{font-family:'Bricolage';src:url('/fonts/bg.woff2') format('woff2');
  font-weight:700;font-style:normal;font-display:swap}
.hx-ojo,.hx h1,.hx-b1,.hx-b2{font-family:'Bricolage',ui-sans-serif,system-ui,sans-serif}
.hx h1{letter-spacing:-.045em}
.hx-ojo{letter-spacing:.16em}

:root{--noche:#0a0918;--noche2:#120f2b;--tinta:#f4f3fb;--tenue:#a5a3c4;
    --violeta:#7c5cff;--teal:#2dd4bf;--sol:#fde047}
body{background:var(--noche)}
body{background:var(--noche);color:var(--tinta);margin:0;font-family:ui-sans-serif,system-ui,-apple-system,sans-serif}
/* ---- Cuerpo de la página, en el mismo mundo oscuro que la portada.
   Las tarjetas blancas de Tailwind quedaban de otra web al lado del hero. ---- */
.hy{background:var(--noche);color:var(--tinta);padding:0 24px 8px}
.hy-sec{max-width:74rem;margin:0 auto;padding:92px 0 0}
.hy-ojo{font:650 .72rem/1 ui-monospace,SFMono-Regular,Menlo,monospace;letter-spacing:.18em;
    text-transform:uppercase;color:var(--teal);margin:0 0 14px}
.hy h2{font-family:'Bricolage',ui-sans-serif,system-ui,sans-serif;font-weight:700;
    font-size:clamp(1.85rem,3.2vw,2.5rem);line-height:1.1;letter-spacing:-.035em;
    margin:0 0 12px;text-wrap:balance}
.hy-sub{color:var(--tenue);font-size:1.02rem;margin:0 0 40px;max-width:38rem;line-height:1.6}

.hy-rej{display:grid;gap:20px;grid-template-columns:1fr}
@media(min-width:900px){.hy-rej{grid-template-columns:1fr 1fr}}
.hy-t{position:relative;background:linear-gradient(180deg,rgba(255,255,255,.055),rgba(255,255,255,.022));
    border:1px solid rgba(255,255,255,.1);border-radius:20px;padding:30px 28px;
    transition:border-color .25s,transform .25s;display:flex;flex-direction:column}
.hy-t:hover{border-color:rgba(124,92,255,.5);transform:translateY(-3px)}
.hy-ancha{grid-column:1/-1}
@media(min-width:900px){.hy-ancha{display:grid;grid-template-columns:1fr 1.25fr;gap:38px;align-items:start}}
.hy-t h3{font-family:'Bricolage',ui-sans-serif,system-ui,sans-serif;font-weight:700;
    font-size:1.5rem;letter-spacing:-.02em;margin:0 0 6px}
.hy-baja{color:var(--tenue);margin:0 0 18px;line-height:1.55}
.hy-txt{color:var(--tenue);font-size:.95rem;line-height:1.62;margin:0}
.hy-txt+.hy-txt{margin-top:12px}
.hy-t ul{list-style:none;margin:0 0 20px;padding:0;display:flex;flex-direction:column;gap:13px}
.hy-t li{display:flex;gap:11px;font-size:.95rem;line-height:1.55;color:var(--tenue)}
.hy-t li span:first-child{color:var(--violeta);flex:none;font-weight:700}
.hy-t li b{color:var(--tinta);font-weight:640}
.hy-star{background:rgba(253,224,71,.07);border-left:2px solid var(--sol);
    margin:0 -10px;padding:11px 10px;border-radius:0 8px 8px 0}
.hy-star span:first-child{color:var(--sol)!important}

.hy-chip{display:inline-flex;align-items:center;gap:7px;align-self:flex-start;
    font:650 .68rem/1 ui-monospace,SFMono-Regular,Menlo,monospace;letter-spacing:.12em;
    text-transform:uppercase;padding:7px 13px;border-radius:999px;margin:0 0 16px}
.hy-vivo{background:rgba(45,212,191,.14);color:#5eead4;border:1px solid rgba(45,212,191,.35)}
.hy-inv{background:rgba(124,92,255,.16);color:#b6a6ff;border:1px solid rgba(124,92,255,.4)}
.hy-punto{width:6px;height:6px;border-radius:50%;background:currentColor}

.hy-acc{display:flex;flex-wrap:wrap;gap:12px;align-items:center;margin-top:auto;padding-top:22px}
.hy-p{display:inline-flex;align-items:center;gap:9px;padding:12px 22px;border-radius:999px;
    background:var(--sol);color:#2a1e00;font-weight:660;font-size:.95rem;text-decoration:none;
    transition:transform .18s}
.hy-p:hover{transform:translateY(-2px)}
.hy-s{color:var(--tenue);text-decoration:none;font-size:.93rem;border-bottom:1px solid rgba(255,255,255,.2)}
.hy-s:hover{color:var(--tinta);border-color:var(--tinta)}
.hy-p:focus-visible,.hy-s:focus-visible{outline:2px solid var(--teal);outline-offset:3px}

.hy-tres{display:grid;gap:34px;grid-template-columns:1fr}
@media(min-width:820px){.hy-tres{grid-template-columns:repeat(3,1fr);gap:40px}}
.hy-tres h3{font-family:'Bricolage',ui-sans-serif,system-ui,sans-serif;font-size:1.12rem;
    font-weight:700;letter-spacing:-.015em;margin:16px 0 8px}
.hy-ic{width:42px;height:42px;border-radius:12px;display:grid;place-items:center;
    background:rgba(124,92,255,.14);border:1px solid rgba(124,92,255,.3);color:#b6a6ff}

.hy-cierre{max-width:74rem;margin:96px auto 0;padding:56px 40px;border-radius:26px;
    background:radial-gradient(90% 140% at 20% 0%,rgba(124,92,255,.32),rgba(255,255,255,.03));
    border:1px solid rgba(255,255,255,.12);text-align:center}
.hy-cierre h2{margin-bottom:14px}
.hy-cierre .hy-sub{margin:0 auto 28px}
.hy-cierre .hy-acc{justify-content:center}
.hy-tel{margin:22px 0 0;color:var(--tenue);font-size:.95rem}
.hy-tel a{color:var(--sol);text-decoration:none;font-weight:620}

.hy-pie{max-width:74rem;margin:0 auto;padding:64px 0 44px;
    display:grid;gap:34px;grid-template-columns:1fr}
@media(min-width:760px){.hy-pie{grid-template-columns:1.4fr 1fr 1fr}}
.hy-pie h4{font:650 .72rem/1 ui-monospace,SFMono-Regular,Menlo,monospace;letter-spacing:.16em;
    text-transform:uppercase;color:var(--tenue);margin:0 0 16px}
.hy-pie ul{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:10px}
.hy-pie a{color:var(--tenue);text-decoration:none;font-size:.94rem}
.hy-pie a:hover{color:var(--tinta)}
.hy-marca{font-family:'Bricolage',ui-sans-serif,system-ui,sans-serif;font-size:1.35rem;
    font-weight:700;letter-spacing:-.02em;margin:0 0 10px}
.hy-marca i{font-style:normal;color:var(--sol)}
.hy-legal{max-width:74rem;margin:0 auto;padding:22px 0 40px;border-top:1px solid rgba(255,255,255,.09);
    color:var(--tenue);font-size:.86rem}
/*@idi*/

/* ---- Paginas de producto. Encabezado propio; el resto es la misma hoja que
   el cuerpo de la portada, extraida de ahi para que no deriven. ---- */
*{box-sizing:border-box}
.pp-nav{max-width:74rem;margin:0 auto;padding:26px 24px 0;display:flex;
    align-items:center;justify-content:space-between;gap:16px}
.pp-nav a{color:var(--tenue);text-decoration:none;font:650 .78rem/1 ui-monospace,
    SFMono-Regular,Menlo,monospace;letter-spacing:.1em;text-transform:uppercase}
.pp-nav a:hover{color:var(--tinta)}
.pp-idi{display:flex;gap:2px;padding:4px;border-radius:999px;
    background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.13)}
.pp-idi a{padding:7px 11px;border-radius:999px;font-size:.7rem}
.pp-idi a[aria-current]{background:var(--sol);color:#2a1e00}
.pp-cab{max-width:74rem;margin:0 auto;padding:54px 24px 8px}
.pp-cab h1{font-family:'Bricolage',ui-sans-serif,system-ui,sans-serif;font-weight:700;
    font-size:clamp(2rem,4vw,3rem);line-height:1.08;letter-spacing:-.035em;
    margin:0 0 20px;text-wrap:balance;max-width:22ch}
.pp-cab h1 em{font-style:normal;color:var(--sol)}
.pp-lede{color:var(--tenue);font-size:clamp(1.02rem,1.4vw,1.16rem);line-height:1.62;
    max-width:40rem;margin:0}
.pp-cifras{display:grid;grid-template-columns:1fr 1fr;gap:22px 30px;
    max-width:74rem;margin:38px auto 0;padding:26px 24px 0;
    border-top:1px solid rgba(255,255,255,.1)}
@media(min-width:760px){.pp-cifras{grid-template-columns:repeat(4,1fr)}}
.pp-cifras b{display:block;font:700 1.5rem/1 ui-monospace,SFMono-Regular,Menlo,monospace;
    color:var(--tinta);letter-spacing:-.02em}
.pp-cifras span{display:block;margin-top:7px;color:var(--tenue);font-size:.86rem;line-height:1.45}
.pp-cuerpo .hy-sec{padding:64px 0 0}
.pp-lista{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:15px}
.pp-lista li{display:flex;gap:11px;font-size:.98rem;line-height:1.6;color:var(--tenue)}
.pp-lista li span:first-child{color:var(--violeta);flex:none;font-weight:700}
.pp-lista li b{color:var(--tinta);font-weight:640}
.pp-no li span:first-child{color:#f59e9e}
.pp-pie{max-width:74rem;margin:0 auto;padding:56px 24px 48px;
    border-top:1px solid rgba(255,255,255,.09);color:var(--tenue);font-size:.9rem;
    display:flex;flex-wrap:wrap;gap:12px 26px;align-items:center}
.pp-pie a{color:var(--tenue)}
.pp-cuerpo a{color:var(--sol);text-decoration:none;
    border-bottom:1px solid rgba(253,224,71,.38)}
.pp-cuerpo a:hover{border-bottom-color:var(--sol)}
