/*
  Estilos de las páginas que no son la landing: privacidad, términos y la 404.
  La landing (index.html) lleva los suyos adentro para cargar en un solo pedido; los colores,
  el encabezado y el pie son los mismos que acá. Si cambiás uno, cambiá el otro.
*/
@font-face { font-family: 'Outfit'; font-style: normal; font-weight: 400; font-display: swap; src: url(data:font/woff2;base64,d09GMgABAAAAAAScABAAAAAACIwAAARAAAEAAAAAAAAAAAAAAAAAAAAAAAAAAAAAGjAbgTwcVgZgP1NUQVQuAFQRCAqEXIN7CxIAATYCJAMgBCAFhBoHIAwHGwEHyAQe+O/0O3fmVnhyQQQqgFSaVG+hdNfJmv1aCF9CsNQXOVYNp6X7Or5Uj1AIiUM5/qDvHMW1plpRpTswAs/gkD3FRWdwaS4TIyNkhPR5xpacFckcxocDAkiQRhtCEURDaBLZI2woKDJC6ggFe4gkhaI7LLbmbmKXnBsrxCIB/iKpxek1iIYbPt8gUQhPLxAJKBjXbKUOOUPI/HPMP/nS71s/6l/pX++bVlAZIaIyFJYHFSeru/jBj6OhsJe9s/zSFqT+O27PpflZp1RC+LwzhiSBQ5DUpFIjLmXOKB6lH2g6RIxSJI7grInSXTNrzlmeJ4EN9bv//wX1OyH7q+JD5dFbQcQOCG/B7nDiMMoJs3Mb4rRQIa2IS0U8vSQUUmgkqzOyEsPtEv3PSxIwM43Ghq6v7i9J1n9B/1Z/Vr9Jv1K/DKMAk9B14hAeSuMjsUD4WB/BkiesrNzXE0gpZVJafHxW8hMyKiROTsSo0T31PTVDtd11Tk8gEBBbwWAwyuuv7X42EOnx+Xy4/X5/lDdY3/O8r5cEITzpx33t7mgRU7EVeGMMCUJwl93xdLfP1+sNBgWoAg/1eAJvZHXd4Y/yPsWNPPlK4JUXxdZLI1+f237nK5Gex3E/8fLLL7+A2xcVEiUHRQyxOo7+7+14NPLRu0Za/25Nvu38jz8+X0Zf8O13F3BhRNMZZaPO4q3GpuKt0fHTy5o6TynXDQY5mllbPpRmtqc4q6pSnNy/P5RWbhzLkob6n9zlHImwrxqMmt1m0FYMVtNUdcW8OXJv3mVNzuiCRJMvJ8+anmovLEpvbMgoyDAdOuX6fROZHIywaUajy2Y1rmhGm9VlMGpWm9HlMlp6c62Z6Y78vAy7JSM315qRbs/LT3dYM3kvIsO2+9HB624xH83K+ujgwebLDTtvMmdn39yYWFrRm/bodZV3paZ79u+vvO3nW6w55tEWvNuD22+c32npxLs9uP3G+Z1jnW+cvz24zfV74SVx4PqH0s+5aCyu5rdwVf2uqfLRh1//D49+VrUvS3f/f2/sUfUjoE8jMMP/rI+KHdfd/4/HHn1Ub4dw5V46lPvJV/aTrJSRLO5iv3CxV/Gyl7d2HQznYWJp+YiXHP/jzkSwliZlhKy/XUC/Mf4VLAqxfGNRKeJhi+Qw11pCqGLUEsphTOZYyoiOivWehz6mmWeWOTb84Q1crFNFvvTYOpOsMY+LDT6SZ3rhq5fIQ2ONWfJpw0YzbWyywQzzbJBLJ9PMsskSTtbolbE2Z1hjhQQKyeMjBVKtmllmWESDx5ZYZ4gC8qiUd4soZ2RFVwlLK5x/hjWczFKNYUVpadSgGQ0XJ53RT8BfSqCIAoooJIFu5pgmAclz7ayhscA0k2UYezBHSWSdbc4gEbOzInP8+AR5TKKxTN3CikTOilo2FxthRDsyf4BC3affSBFO/+NCP+d+eREAAA==) format('woff2'); }
:root {
  --negro: #000000;
  --gris-oscuro: #3e3e3e;
  --blanco: #ffffff;
  --gris-claro: #e8e8e8;
  --azul: #0067c8;
  --azul-hover: color-mix(in srgb, var(--azul) 85%, var(--negro));
  --fondo-suave: color-mix(in srgb, var(--gris-claro) 40%, var(--blanco));
}
* { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; text-size-adjust: 100%; }
body {
  margin: 0;
  font-family: system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif;
  font-size: 1.125rem;
  line-height: 1.45;
  color: var(--negro);
  background: var(--blanco);
  overflow-wrap: break-word;
  overflow-x: clip;
}
h1, h2 { margin: 0; font-weight: 500; letter-spacing: -0.025em; text-wrap: balance; }
h1 { font-size: clamp(2.25rem, 1.6rem + 2.6vw, 3.25rem); line-height: 1.02; }
h2 { font-size: 1.5rem; line-height: 1.15; letter-spacing: -0.015em; }
p { margin: 0; }
a { color: inherit; }
:focus-visible { outline: 3px solid var(--azul); outline-offset: 3px; border-radius: 0.25rem; }
.caja-ancha { width: min(100% - 2rem, 72rem); margin-inline: auto; }
.ojo { font-size: 0.9375rem; font-weight: 600; letter-spacing: 0.08em; text-transform: uppercase; color: var(--azul); }

/* Encabezado */
.barra { border-bottom: 1px solid var(--gris-claro); }
.barra .caja-ancha { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 0.75rem 1.5rem; padding-block: 0.875rem; }
.marca { display: flex; align-items: center; gap: 0.55rem; font-family: 'Outfit', system-ui, sans-serif; font-weight: 400; font-size: 1.625rem; line-height: 1; letter-spacing: -0.01em; text-decoration: none; }
.logo { display: inline-block; width: 2.25rem; height: 2.25rem; flex: none; background: url("data:image/png;base64,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") center / contain no-repeat; }
.boton {
  display: inline-flex; align-items: center; justify-content: center; min-height: 3.5rem; padding: 0.85rem 1.75rem;
  font: inherit; font-size: 1.125rem; font-weight: 600; line-height: 1.25; text-align: center; text-decoration: none;
  color: var(--blanco); background: var(--azul); border-radius: 0.5rem; transition: background-color 0.2s;
}
.boton:hover { background: var(--azul-hover); }
.boton-chico { min-height: 2.75rem; padding: 0.55rem 1.1rem; font-size: 1rem; }

/* La barra de arriba. En el celular: logo y botón. En la compu, la cápsula de la landing de Milo:
   transparente arriba de todo y blanca, con borde y sombra, al bajar (data-abajo lo pone el script del final) */
.barra-nav, .marca .lema { display: none; }
@media (min-width: 64rem) {
  .barra { position: sticky; top: 0; z-index: 10; padding-top: 0.5rem; border-bottom: 0; background: transparent; }
  .barra .caja-ancha { display: grid; grid-template-columns: 1fr auto 1fr; gap: 1rem; height: 3.5rem; padding: 0 0.5rem 0 1rem; border: 1px solid transparent; border-radius: 999px; transition: background-color 0.3s, border-color 0.3s, box-shadow 0.3s; }
  .barra[data-abajo] .caja-ancha { background: var(--blanco); border-color: var(--gris-claro); box-shadow: 0 1px 2px rgba(0, 0, 0, 0.04), 0 6px 20px rgba(0, 0, 0, 0.06); }
  .barra .marca { justify-self: start; font-size: 1.375rem; }
  .barra .logo { width: 2rem; height: 2rem; }
  .marca .lema { display: block; margin-top: 0.15rem; font-family: system-ui, -apple-system, 'Segoe UI', Roboto, sans-serif; font-size: 0.75rem; letter-spacing: 0; color: var(--gris-oscuro); white-space: nowrap; }
  .barra-nav { display: flex; gap: 0.25rem; margin: 0; padding: 0; list-style: none; }
  .barra-nav a { display: block; padding: 0.375rem 0.75rem; border: 1px solid transparent; border-radius: 999px; font-size: 0.9375rem; font-weight: 500; text-decoration: none; transition: border-color 0.2s; }
  .barra-nav a:hover { border-color: var(--gris-claro); }
  .barra .boton-chico { justify-self: end; min-height: 2.5rem; padding: 0 1rem; border-radius: 999px; background: rgba(0, 0, 0, 0.06); color: var(--negro); transition: background-color 0.3s, color 0.3s; }
  .barra .boton-chico:hover { background: rgba(0, 0, 0, 0.1); }
  .barra[data-abajo] .boton-chico { background: var(--azul); color: var(--blanco); }
  .barra[data-abajo] .boton-chico:hover { background: var(--azul-hover); }
  /* Que la barra no tape el título al saltar a una sección */
  [id] { scroll-margin-top: 5rem; }
}

/* Textos legales: una columna angosta para leer cómodo */
.legal { width: min(100% - 2rem, 45rem); margin-inline: auto; padding-block: clamp(2.5rem, 1.5rem + 4vw, 5rem) clamp(4rem, 3rem + 5vw, 7rem); }
.aviso { padding: 0.85rem 1rem; border: 1px solid var(--gris-claro); border-left: 4px solid var(--azul); border-radius: 0.5rem; background: var(--fondo-suave); font-size: 1rem; }
.legal header { margin-top: 2.5rem; }
.legal header h1 { margin-top: 0.75rem; }
.legal header p:last-child { margin-top: 1rem; font-size: 1.25rem; color: var(--gris-oscuro); }
.legal section { margin-top: 2.5rem; padding-top: 2rem; border-top: 1px solid var(--gris-claro); }
.legal section h2 { margin-bottom: 0.75rem; }
.legal section p, .legal section li { color: var(--gris-oscuro); }
.legal section > * + * { margin-top: 0.75rem; }
.legal ul { margin-bottom: 0; padding-left: 1.25rem; }
.legal li + li { margin-top: 0.5rem; }
.legal li::marker { color: var(--azul); }
.legal a { color: var(--azul); }
.legal code { padding: 0.1rem 0.3rem; border-radius: 0.25rem; background: var(--fondo-suave); font-size: 0.9em; }

/* La página que no existe */
.no-encontrada { display: grid; place-items: center; min-height: 60vh; padding: 4rem 1rem; text-align: center; }
.no-encontrada > div { display: grid; justify-items: center; gap: 1.25rem; max-width: 30rem; }
.no-encontrada .num { font-family: ui-monospace, 'SF Mono', Menlo, Consolas, monospace; font-size: 1rem; color: var(--azul); }
.no-encontrada p { color: var(--gris-oscuro); font-size: 1.25rem; }

/* Pie: el mismo que en index.html */
.pie-pagina { padding-block: 3rem 2rem; border-top: 1px solid var(--gris-claro); font-size: 1rem; color: var(--gris-oscuro); }
.pie-arriba { display: grid; gap: 2.5rem; }
.pie-marca p { margin-top: 0.75rem; }
.pie-columnas { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 11rem), 1fr)); gap: 2rem; }
.pie-titulo { margin-bottom: 0.75rem; font-size: 0.875rem; font-weight: 600; letter-spacing: 0.08em; text-transform: uppercase; color: var(--negro); }
.pie-columnas ul { display: grid; gap: 0.6rem; margin: 0; padding: 0; list-style: none; }
.pie-columnas a { text-decoration: none; }
.pie-columnas a:hover { color: var(--azul); text-decoration: underline; }
.pie-columnas a[aria-current] { color: var(--azul); }
.pie-firma { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 0.5rem 1.5rem; margin-top: 2.5rem; padding-top: 1.5rem; border-top: 1px solid var(--gris-claro); font-size: 0.9375rem; }
@media (min-width: 60rem) {
  .pie-arriba { grid-template-columns: 1fr 2fr; }
}