/* PLOT — tokens de marca y base funcional.
   El diseño del sitio llega con el copy aprobado (gate de copy); esto solo hace usable el esqueleto. */

:root {
  --azul: #006699;     /* primario · 6.3:1 sobre blanco: sirve para texto y botones */
  --naranja: #FF9900;  /* acento · 2.1:1 sobre blanco: NUNCA texto sobre blanco; sí fondo con texto --texto (5.9:1) */
  --gris: #999999;     /* secundario · 2.9:1: solo líneas y bordes, no texto */
  --texto: #333333;
  --fondo: #ffffff;
}

* { box-sizing: border-box; }
body { margin: 0; font: 16px/1.6 system-ui, -apple-system, "Segoe UI", Roboto, sans-serif; color: var(--texto); background: var(--fondo); }
a { color: var(--azul); }
h1 { color: var(--azul); line-height: 1.2; }

.barra { padding: 16px; border-bottom: 4px solid var(--azul); }
.barra img { display: block; height: 48px; width: auto; }
.pagina { max-width: 720px; margin: 0 auto; padding: 32px 16px 64px; }
.pie { padding: 24px 16px; border-top: 1px solid var(--gris); font-size: 14px; text-align: center; }

.formulario { display: grid; gap: 16px; }
.formulario > label { display: grid; gap: 4px; font-weight: 600; }
.formulario input, .formulario select, .formulario textarea {
  width: 100%; padding: 10px 12px; font: inherit; color: inherit;
  border: 1px solid var(--gris); border-radius: 4px; background: var(--fondo);
}
.formulario :focus-visible { outline: 2px solid var(--azul); outline-offset: 1px; }
.aviso { font-size: 14px; }
.casilla { display: flex; gap: 8px; align-items: flex-start; }
.casilla input { width: auto; margin-top: 4px; }
.trampa { position: absolute; left: -9999px; }
button, .boton {
  display: inline-block; justify-self: start; padding: 12px 32px; font: inherit; font-weight: 700;
  color: var(--texto); background: var(--naranja); border: 0; border-radius: 4px; cursor: pointer;
  text-decoration: none;
}
.datos { margin-top: 48px; font-style: normal; }