/* Web pública provisional de pisioapp.com. Los colores son los de Pisio-web
   (src/app/globals.css); las fuentes, las del sistema, para no pedir nada a
   Google Fonts: cada visita le enviaría la IP del visitante. */
:root {
  --fondo: hsl(180 30% 98%);
  --texto: hsl(200 30% 8%);
  --suave: hsl(200 12% 38%);
  --borde: hsl(180 14% 88%);
  --marca: hsl(173 80% 26%);
  --sobre-marca: #fff;
  color-scheme: light dark;
}
@media (prefers-color-scheme: dark) {
  :root {
    --fondo: hsl(200 32% 6%);
    --texto: hsl(175 25% 96%);
    --suave: hsl(190 12% 70%);
    --borde: hsl(200 20% 18%);
    --marca: hsl(168 75% 52%);
    --sobre-marca: hsl(200 32% 6%);
  }
}
* { box-sizing: border-box; }
body {
  margin: 0;
  background: var(--fondo);
  color: var(--texto);
  font: 17px/1.6 system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
}
header, main, footer {
  max-width: 46rem;
  margin: 0 auto;
  padding-inline: 1.25rem;
}
header { padding-block: 1.5rem; }
.marca {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  font-weight: 700;
  font-size: 1.25rem;
  color: var(--texto);
  text-decoration: none;
}
a { color: var(--marca); }
.portada { padding-block: 3rem 2rem; }
.portada h1 { font-size: clamp(2.5rem, 8vw, 3.5rem); line-height: 1.1; margin: 0 0 1rem; }
.lema { font-size: 1.3rem; }
.boton {
  display: inline-block;
  margin-top: 0.5rem;
  padding: 0.7rem 1.4rem;
  border-radius: 1rem;
  background: var(--marca);
  color: var(--sobre-marca);
  font-weight: 600;
  text-decoration: none;
}
.empresa { border-top: 1px solid var(--borde); padding-block: 1.5rem; color: var(--suave); }
.empresa h2 { font-size: 1.1rem; color: var(--texto); }
.legal { padding-block: 1rem 2rem; overflow-wrap: anywhere; }
.legal h1 { font-size: 2rem; line-height: 1.2; }
.legal table { display: block; overflow-x: auto; border-collapse: collapse; }
.legal th, .legal td { border: 1px solid var(--borde); padding: 0.4rem 0.6rem; text-align: left; }
footer {
  border-top: 1px solid var(--borde);
  padding-block: 1.5rem 3rem;
  font-size: 0.9rem;
  color: var(--suave);
}
.version { font-size: 0.8rem; }