/* ════════════════════════════════════════════════════════════════════
   BERA — Base compartida por las cinco páginas del sitio.

   Tokens del sistema de diseño, reset, fondo ambiente y las clases de tipo
   y botón que usan todas las páginas (.display, .eyebrow, .dot, .grad-text,
   .lead, .btn*, .wrap).

   Vive separada de landing.css porque landing.css pesa 30 KB de estilos que
   solo usa el home, y hasta agosto de 2026 se cargaba render-blocking también
   en /form, /thankyouform y /privacidad, que usan de ella nada más que este
   bloque. El layout raíz carga SOLO este archivo; el home y /invest agregan
   landing.css aparte, con un <link> propio en paralelo (nunca con @import,
   que encadenaría un round trip más).

   Al agregar acá, preguntarse si de verdad lo necesitan las cinco páginas:
   todo lo que entre a este archivo entra al camino crítico de todas.
   ════════════════════════════════════════════════════════════════════ */

/* ── fuentes ────────────────────────────────────────────────────────────
   Auto-hospedadas. Antes venían por <link> a Google Fonts, que costaba dos
   handshakes —fonts.googleapis.com para la hoja y fonts.gstatic.com para los
   archivos— y ponía una hoja render-blocking de un tercero en el camino
   crítico de las cinco páginas. Ahora las declaraciones viajan dentro de este
   archivo, que ya se cargaba igual: cero requests nuevos y cero orígenes
   nuevos.

   Son las dos fuentes VARIABLES, no una estática por peso: un solo archivo por
   familia cubre todo el rango que usa el sitio (Bricolage 500-800, Inter
   400-700) en vez de los ocho que servía Google. Se guardan sólo los subsets
   latin y latin-ext; el castellano entra entero en latin, y el resto
   —cirílico, griego, vietnamita— no lo pide nadie acá.

   font-display: swap en las cuatro: el texto pinta con la fuente de sistema y
   cambia cuando llega la real. Es lo que evita que una fuente lenta retrase el
   LCP, que se mide sobre ese primer pintado.

   Las dos familias son OFL, así que auto-hospedarlas está permitido. Al
   actualizarlas hay que volver a bajar los .woff2, no alcanza con tocar el CSS.
   ────────────────────────────────────────────────────────────────────── */

/* Bricolage Grotesque · latin */
@font-face {
  font-family: 'Bricolage Grotesque';
  font-style: normal;
  font-weight: 500 800;
  font-stretch: 100%;
  font-display: swap;
  src: url('/fonts/bricolage-grotesque-v9-latin.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;
}
/* Bricolage Grotesque · latin-ext */
@font-face {
  font-family: 'Bricolage Grotesque';
  font-style: normal;
  font-weight: 500 800;
  font-stretch: 100%;
  font-display: swap;
  src: url('/fonts/bricolage-grotesque-v9-latin-ext.woff2') format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* Inter · latin */
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 400 700;
  font-display: swap;
  src: url('/fonts/inter-v20-latin.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;
}
/* Inter · latin-ext */
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 400 700;
  font-display: swap;
  src: url('/fonts/inter-v20-latin-ext.woff2') format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}

/* ── reset ──────────────────────────────────────────────────────────────
   Esto es el preflight de Tailwind, traído a mano. Tailwind nunca se usó para
   clases utilitarias, pero su reset SÍ era el reset del sitio: llegaba como una
   hoja aparte que Next emitía desde app/globals.css.

   Se trajo acá en agosto de 2026 porque Lighthouse la marcó como el ÚNICO
   recurso que bloqueaba el render de /form —674 ms estimados— y el costo no
   eran sus bytes sino el viaje de ida y vuelta extra en el <head>. Una
   evaluación anterior la había dejado pasar justamente por mirar los bytes y no
   el bloqueo.

   Va antes de las reglas propias de más abajo, que es como se aplicaba antes:
   primero el reset, después lo de Bera encima.
   ────────────────────────────────────────────────────────────────────── */

*,:after,:before,::backdrop{box-sizing:border-box;border:0 solid;margin:0;padding:0}::file-selector-button{box-sizing:border-box;border:0 solid;margin:0;padding:0}html,:host{-webkit-text-size-adjust:100%;tab-size:4;line-height:1.5;font-family:var(--default-font-family,ui-sans-serif, system-ui, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji");font-feature-settings:var(--default-font-feature-settings,normal);font-variation-settings:var(--default-font-variation-settings,normal);-webkit-tap-highlight-color:transparent}hr{height:0;color:inherit;border-top-width:1px}abbr:where([title]){-webkit-text-decoration:underline dotted;text-decoration:underline dotted}h1,h2,h3,h4,h5,h6{font-size:inherit;font-weight:inherit}a{color:inherit;-webkit-text-decoration:inherit;-webkit-text-decoration:inherit;-webkit-text-decoration:inherit;-webkit-text-decoration:inherit;text-decoration:inherit}b,strong{font-weight:bolder}code,kbd,samp,pre{font-family:var(--default-mono-font-family,ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace);font-feature-settings:var(--default-mono-font-feature-settings,normal);font-variation-settings:var(--default-mono-font-variation-settings,normal);font-size:1em}small{font-size:80%}sub,sup{vertical-align:baseline;font-size:75%;line-height:0;position:relative}sub{bottom:-.25em}sup{top:-.5em}table{text-indent:0;border-color:inherit;border-collapse:collapse}:-moz-focusring{outline:auto}progress{vertical-align:baseline}summary{display:list-item}ol,ul,menu{list-style:none}img,svg,video,canvas,audio,iframe,embed,object{vertical-align:middle;display:block}img,video{max-width:100%;height:auto}button,input,select,optgroup,textarea{font:inherit;font-feature-settings:inherit;font-variation-settings:inherit;letter-spacing:inherit;color:inherit;opacity:1;background-color:#0000;border-radius:0}::file-selector-button{font:inherit;font-feature-settings:inherit;font-variation-settings:inherit;letter-spacing:inherit;color:inherit;opacity:1;background-color:#0000;border-radius:0}:where(select:is([multiple],[size])) optgroup{font-weight:bolder}:where(select:is([multiple],[size])) optgroup option{padding-inline-start:20px}::file-selector-button{margin-inline-end:4px}::placeholder{opacity:1}@supports (not ((-webkit-appearance:-apple-pay-button))) or (contain-intrinsic-size:1px){::placeholder{color:currentColor}@supports (color:color-mix(in lab, red, red)){::placeholder{color:color-mix(in oklab, currentcolor 50%, transparent)}}}textarea{resize:vertical}::-webkit-search-decoration{-webkit-appearance:none}::-webkit-date-and-time-value{min-height:1lh;text-align:inherit}::-webkit-datetime-edit{display:inline-flex}::-webkit-datetime-edit-fields-wrapper{padding:0}::-webkit-datetime-edit{padding-block:0}::-webkit-datetime-edit-year-field{padding-block:0}::-webkit-datetime-edit-month-field{padding-block:0}::-webkit-datetime-edit-day-field{padding-block:0}::-webkit-datetime-edit-hour-field{padding-block:0}::-webkit-datetime-edit-minute-field{padding-block:0}::-webkit-datetime-edit-second-field{padding-block:0}::-webkit-datetime-edit-millisecond-field{padding-block:0}::-webkit-datetime-edit-meridiem-field{padding-block:0}::-webkit-calendar-picker-indicator{line-height:1}:-moz-ui-invalid{box-shadow:none}button,input:where([type=button],[type=reset],[type=submit]){appearance:button}::file-selector-button{appearance:button}::-webkit-inner-spin-button{height:auto}::-webkit-outer-spin-button{height:auto}[hidden]:where(:not([hidden=until-found])){display:none!important}

:root {
  --orange: #F2A03E;
  --pink:   #E63B7A;
  --purple: #B14EE3;
  --cyan:   #2BCAD8;

  --bg:     #07060B;
  --bg2:    #0C0A14;
  --ink:    #FFFFFF;
  --soft:   rgba(255,255,255,0.66);
  --faint:  rgba(255,255,255,0.52);
  --line:   rgba(255,255,255,0.10);
  --line2:  rgba(255,255,255,0.06);
  --glass:  rgba(255,255,255,0.045);
  --glass2: rgba(255,255,255,0.07);

  --grad: linear-gradient(120deg, var(--orange), var(--pink) 55%, var(--purple));
  --grad-warm: linear-gradient(120deg, var(--orange), var(--pink));
  --maxw: 1240px;
  --ease: cubic-bezier(.22,.61,.36,1);

  --display: "Bricolage Grotesque", system-ui, sans-serif;
  --body: "Inter", system-ui, sans-serif;
}

* { box-sizing: border-box; margin: 0; padding: 0; }
html { scroll-behavior: smooth; -webkit-text-size-adjust: 100%; overflow-x: hidden; }
body {
  background: var(--bg);
  color: var(--ink);
  font-family: var(--body);
  line-height: 1.5;
  overflow-x: hidden;
  -webkit-font-smoothing: antialiased;
}
a { color: inherit; text-decoration: none; }
img { display: block; max-width: 100%; }
button { font-family: inherit; cursor: pointer; }
::selection { background: var(--pink); color: #fff; }

/* page-wide ambient grain + base gradient */
body::before {
  content: ""; position: fixed; inset: 0; z-index: -2; pointer-events: none;
  background:
    radial-gradient(900px 600px at 78% -8%, rgba(242,160,62,0.16), transparent 60%),
    radial-gradient(800px 700px at 8% 12%, rgba(177,78,227,0.16), transparent 58%),
    radial-gradient(900px 800px at 50% 108%, rgba(230,59,122,0.14), transparent 60%),
    var(--bg);
}
body::after {
  content: ""; position: fixed; inset: 0; z-index: -1; pointer-events: none; opacity: .035;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.85' numOctaves='3'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
}

.wrap { max-width: var(--maxw); margin: 0 auto; padding: 0 28px; }

/* ── type ───────────────────────────────────────────────────────────── */
.display { font-family: var(--display); font-weight: 700; letter-spacing: -0.03em; line-height: 0.98; }
.eyebrow {
  display: inline-flex; align-items: center; gap: 9px;
  font-size: 12.5px; font-weight: 600; letter-spacing: .14em; text-transform: uppercase;
  color: var(--soft);
}
.eyebrow .dot { width: 7px; height: 7px; border-radius: 50%; background: var(--grad-warm); box-shadow: 0 0 14px var(--pink); }
.grad-text {
  background: var(--grad); -webkit-background-clip: text; background-clip: text;
  -webkit-text-fill-color: transparent; color: transparent;
}
.lead { color: var(--soft); font-size: 19px; line-height: 1.6; }

/* ── buttons ────────────────────────────────────────────────────────── */
.btn {
  display: inline-flex; align-items: center; gap: 9px; border: 0;
  padding: 14px 24px; border-radius: 14px; font-size: 15px; font-weight: 650;
  transition: transform .2s var(--ease), box-shadow .3s var(--ease), background .2s;
  white-space: nowrap;
}
.btn-primary {
  background: var(--grad-warm); color: #1a0e06;
  box-shadow: 0 14px 34px -10px rgba(230,59,122,.6), inset 0 1px 0 rgba(255,255,255,.4);
}
.btn-primary:hover { transform: translateY(-2px); box-shadow: 0 20px 44px -10px rgba(230,59,122,.75), inset 0 1px 0 rgba(255,255,255,.5); }
.btn-ghost { background: var(--glass); color: #fff; border: 1px solid var(--line); backdrop-filter: blur(10px); }
.btn-ghost:hover { background: var(--glass2); transform: translateY(-2px); }
.btn svg { width: 17px; height: 17px; }
