/* Diseño provisional: se reemplaza cuando exista la identidad visual de Kinexus Labs. */
:root {
  --fondo: #f6f4ef;
  --texto: #1c1d21;
  --suave: #5f6168;
  --acento: #8a6a2f;
  --linea: #dcd8cd;
  color-scheme: light;
}

@media (prefers-color-scheme: dark) {
  :root {
    --fondo: #14161a;
    --texto: #ecebe6;
    --suave: #a3a4a9;
    --acento: #c9a65e;
    --linea: #2c2f36;
    color-scheme: dark;
  }
}

* { box-sizing: border-box; }

html, body { height: 100%; }

body {
  margin: 0;
  display: flex;
  flex-direction: column;
  min-height: 100vh;
  padding: 0 1.25rem;
  background: var(--fondo);
  color: var(--texto);
  font-family: system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
  line-height: 1.6;
  -webkit-font-smoothing: antialiased;
}

main {
  flex: 1;
  display: flex;
  flex-direction: column;
  justify-content: center;
  width: 100%;
  max-width: 36rem;
  margin: 0 auto;
  padding: 4rem 0;
}

.estado {
  margin: 0 0 1.25rem;
  font-size: 0.75rem;
  font-weight: 600;
  letter-spacing: 0.2em;
  text-transform: uppercase;
  color: var(--acento);
}

h1 {
  margin: 0;
  font-size: clamp(2.5rem, 9vw, 4rem);
  font-weight: 700;
  letter-spacing: -0.02em;
  line-height: 1.05;
}

.etimologia {
  margin: 0.75rem 0 2rem;
  padding-bottom: 2rem;
  border-bottom: 1px solid var(--linea);
  color: var(--suave);
  font-size: 0.95rem;
}

.etimologia span { font-style: italic; color: var(--texto); }

.vision {
  margin: 0 0 2rem;
  font-size: 1.125rem;
}

.contacto { margin: 0; color: var(--suave); }

a {
  color: var(--texto);
  text-decoration-color: var(--acento);
  text-underline-offset: 0.2em;
}

a:hover, a:focus-visible { color: var(--acento); }

footer {
  max-width: 36rem;
  width: 100%;
  margin: 0 auto;
  padding: 1.5rem 0;
  font-size: 0.8rem;
  color: var(--suave);
}