/* Páginas de cuenta (ingresar, pagar, cuenta, negocio, descargar, vincular, unirse) con la apariencia del sitio nuevo.
   Va DESPUÉS de styles.css y theme.css: sus pantallas las arma el JS con esas clases, así que acá solo se cambia el aspecto
   (colores, fuentes, botones, encabezado y pie), sin tocar la estructura. El resto del sitio usa nodo.css. */
@font-face{font-family:'Bricolage Grotesque';font-style:normal;font-weight:600 800;font-display:swap;src:url(/fonts/bricolage-v2.woff2) format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:'Geist';font-style:normal;font-weight:400 600;font-display:swap;src:url(/fonts/geist-v2.woff2) format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:'Geist fallback';src:local('Arial'),local('Helvetica Neue'),local('Roboto');size-adjust:103.16%;ascent-override:97.42%;descent-override:28.60%;line-gap-override:0%}
@font-face{font-family:'Bricolage Grotesque fallback';src:local('Arial Bold'),local('Arial'),local('Roboto');font-weight:700 800;size-adjust:91%;ascent-override:102.2%;descent-override:29.67%;line-gap-override:0%}

:root{
  --ink:#1A1714;--muted:#57534E;--soft:#8A847D;--bg:#FFFFFF;--bg2:#F5F4F2;--line:#EAE8E5;--card:#F5F4F2;
  --blue:#1A1714;--blue-d:#000000;--blue-l:#FCEBDD;--blue-xl:#F5F4F2;--navy:#1A1714;
  --grad:linear-gradient(#E4580B,#E4580B);
  --naranja:#E4580B;--naranja-osc:#9A3A07;
}
body{font-family:'Geist','Geist fallback',system-ui,-apple-system,sans-serif;background:#FFFFFF;color:var(--ink)}
h1,h2,h3,.h2,.wm,.logo{font-family:'Bricolage Grotesque','Bricolage Grotesque fallback',system-ui,sans-serif}
h1,h2,.h2{letter-spacing:-.035em}
.ph h1{font-weight:800;letter-spacing:-.045em}
.grad-t{background:none;-webkit-background-clip:border-box;background-clip:border-box;color:var(--naranja)}
a:focus-visible,button:focus-visible,input:focus-visible,select:focus-visible{outline:3px solid var(--ink);outline-offset:3px}

/* encabezado: plano, sin desenfoque (traba celulares baratos) */
header.px,header.px.lifted{background:#FFFFFF;backdrop-filter:none;-webkit-backdrop-filter:none;box-shadow:none}
.logo{gap:9px}
.logo .wm{font-weight:700;font-size:22px;letter-spacing:-.03em}
.nav .cta{background:var(--ink);color:#FFFFFF;border-radius:999px}
.nav .cta:hover{color:#FFFFFF;filter:brightness(1.15)}

/* botones */
.btn{border-radius:18px;font-weight:600;font-family:'Geist','Geist fallback',system-ui,sans-serif;background:var(--ink);color:#FFFFFF;transition:transform .18s cubic-bezier(.2,.8,.2,1),filter .18s ease}
.btn:hover{background:var(--ink);color:#FFFFFF;filter:brightness(1.15)}
.btn:active{transform:scale(.97)}
.btn-w,.btn-w:hover{background:var(--bg2);color:var(--ink);filter:none}
.btn-w:hover{background:var(--line)}
.offer-i .btn-w,.subc .btn-w,.pg-c .btn-w{background:var(--bg2)}
.acc>.btn-w,.acc-out .btn-w,.acc-actions .btn-w{background:#FFFFFF}
/* el botón que lleva a pagar o a probar se ve en naranja, con texto negro, como en el resto del sitio */
.btn:not(.btn-w)[href^="/api/checkout"],.btn:not(.btn-w)[href^="/pagar/"]{background:var(--naranja);color:var(--ink)}
.btn:not(.btn-w)[href^="/api/checkout"]:hover,.btn:not(.btn-w)[href^="/pagar/"]:hover{background:var(--naranja);color:var(--ink);filter:brightness(1.06)}

/* tarjetas y bloques claros en piedra */
.card,.acc{background:var(--bg2)}

/* pie del sitio nuevo */
.wordmark{display:none}
.pie{border-top:2px solid var(--line);margin-top:64px}
.pie-in{max-width:1200px;margin:0 auto;padding:28px 32px 32px;display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:12px 28px;font-size:15px;color:var(--muted)}
.pie-in nav{display:flex;flex-wrap:wrap;gap:4px 24px}
.pie-in a{min-height:44px;display:flex;align-items:center;color:var(--muted);text-decoration:underline;text-underline-offset:3px}
.pie-in a:hover{color:var(--ink)}
@media (max-width:760px){.pie-in{padding-left:20px;padding-right:20px}}
@media (prefers-reduced-motion:reduce){.btn{transition:none}}