/* CFP N°21 · base compartida (sitio público e intranet) */
:root {
  --tinta: #1E1B3A;
  --pie: #14122A;
  --violeta: #6B2FA0;
  --violeta-enlace: #4B2380;
  --violeta-hover: #2E1452;
  --lila: #C9A8F0;
  --fondo: #F7F5FB;
  --fondo-alt: #EFEBF6;
  --borde: #E4DEEE;
  --borde-fuerte: #CFC7DD;
  --texto-2: #4A4560;
  --texto-3: #6A6482;
  --dorado: #F2A516;
  --dorado-oscuro: #7A4F00;
  --verde: #1C9A5B;
  --verde-oscuro: #135E38;
  --verde-claro: #E6F5EC;
  --rojo: #D93A2E;
  --rojo-oscuro: #A3201A;
  --rojo-claro: #FDE8DF;
  --error: #8A2C07;
  --blanco: #FFFFFF;
  --radio: 18px;
  --sombra: 0 1px 2px rgba(30, 27, 58, .04), 0 8px 24px rgba(30, 27, 58, .06);
  --arcoiris: linear-gradient(90deg, #2E3E8F 0 12.5%, #1C9A5B 12.5% 25%, #1A9FD6 25% 37.5%, #E0307A 37.5% 50%, #7A3E9D 50% 62.5%, #E2463C 62.5% 75%, #F2A516 75% 87.5%, #A4C639 87.5% 100%);
  --f-titulo: 'Rubik', 'Segoe UI', system-ui, sans-serif;
  --f-texto: 'Nunito Sans', 'Segoe UI', system-ui, sans-serif;
}

*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; scroll-behavior: smooth; }
body {
  margin: 0;
  font-family: var(--f-texto);
  font-size: 16px;
  line-height: 1.5;
  color: var(--tinta);
  background: var(--fondo);
}
img { max-width: 100%; height: auto; }
a { color: var(--violeta-enlace); }
a:hover { color: var(--violeta-hover); }
h1, h2, h3, h4 { font-family: var(--f-titulo); line-height: 1.15; margin: 0; }
p { margin: 0; }
button, input, select, textarea { font: inherit; color: inherit; }
:focus-visible { outline: 3px solid var(--dorado); outline-offset: 2px; border-radius: 4px; }

.arcoiris { height: 6px; background: var(--arcoiris); }

.contenedor { max-width: 1200px; margin: 0 auto; padding-left: 24px; padding-right: 24px; }
@media (max-width: 600px) {
  .contenedor { padding-left: 16px; padding-right: 16px; }
}

.solo-lectores {
  position: absolute !important; width: 1px; height: 1px; padding: 0; margin: -1px;
  overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; border: 0;
}
.saltar {
  position: absolute; left: 16px; top: -60px; z-index: 100; background: var(--tinta); color: #fff;
  padding: 12px 16px; border-radius: 10px; font-weight: 700; text-decoration: none;
}
.saltar:focus { top: 12px; color: #fff; }

/* Botones */
.btn {
  display: inline-flex; align-items: center; justify-content: center; gap: 8px;
  min-height: 44px; padding: 10px 20px; border-radius: 10px; border: 2px solid transparent;
  font-weight: 700; font-size: 16px; line-height: 1.2; text-decoration: none; cursor: pointer;
  transition: background-color .15s, border-color .15s, color .15s;
}
.btn:disabled, .btn[aria-disabled="true"] { opacity: .55; cursor: not-allowed; }
.btn-primario { background: var(--violeta); color: #fff; }
.btn-primario:hover { background: #5A2589; color: #fff; }
.btn-dorado { background: var(--dorado); color: var(--tinta); }
.btn-dorado:hover { background: #DE9408; color: var(--tinta); }
.btn-oscuro { background: var(--tinta); color: #fff; }
.btn-oscuro:hover { background: #2C2852; color: #fff; }
.btn-verde { background: var(--verde); color: #fff; }
.btn-verde:hover { background: #157A48; color: #fff; }
.btn-borde { background: #fff; color: var(--violeta-enlace); border-color: var(--lila); }
.btn-borde:hover { background: #F6F0FD; color: var(--violeta-hover); }
.btn-gris { background: #fff; color: var(--tinta); border: 1px solid var(--borde-fuerte); }
.btn-gris:hover { background: var(--fondo-alt); color: var(--tinta); }
.btn-peligro { background: #fff; color: var(--error); border: 1px solid #F0B49C; }
.btn-peligro:hover { background: var(--rojo-claro); color: var(--error); }
.btn-chico { min-height: 40px; padding: 8px 12px; font-size: 14px; }
.btn svg { flex-shrink: 0; }

/* Chips */
.chip {
  display: inline-flex; align-items: center; gap: 6px; padding: 5px 11px; border-radius: 999px;
  font-size: 13px; font-weight: 700; line-height: 1.3; white-space: nowrap;
  background: var(--fondo-alt); color: var(--tinta);
}
.chip-verde { background: var(--verde-claro); color: var(--verde-oscuro); }
.chip-rojo { background: #FBE3E1; color: var(--rojo-oscuro); }
.chip-dorado { background: #FDF3E1; color: var(--dorado-oscuro); }
.chip-gris { background: #F1F0F4; color: var(--texto-2); }
.chip-violeta { background: #EFE6F8; color: var(--violeta-enlace); }
.chip-azul { background: #EAF6FC; color: #0D5F82; }
.chip-rosa { background: #FCE8F0; color: #8A1745; }
.chip-dios { background: var(--dorado); color: var(--tinta); }

.punto { width: 10px; height: 10px; border-radius: 50%; display: inline-block; flex-shrink: 0; }
.punto-verde { background: var(--verde); box-shadow: 0 0 0 3px #CDEBD9; }
.punto-rojo { background: var(--rojo); box-shadow: 0 0 0 3px #F8D3CF; }
.punto-gris { background: #8C87A0; box-shadow: 0 0 0 3px #E2E0E8; }

/* Avisos */
.alerta {
  border-radius: 12px; padding: 14px 16px; font-size: 15px; line-height: 1.5; border: 1px solid transparent;
}
.alerta-ok { background: var(--verde-claro); color: var(--verde-oscuro); border-color: #9FD3B4; }
.alerta-error { background: var(--rojo-claro); color: var(--error); border-color: #F0B49C; }
.alerta-aviso { background: #FFF8E6; color: #5C3B00; border-color: #EBC77D; }
.alerta-info { background: #F3EEFB; color: var(--violeta-enlace); border-color: #DCCBF3; }
.alerta ul { margin: 6px 0 0; padding-left: 20px; }

/* Formularios */
.campo { display: flex; flex-direction: column; gap: 6px; font-weight: 700; font-size: 15px; }
.campo .ayuda { font-weight: 600; font-size: 13px; color: var(--texto-2); }
.campo input[type=text], .campo input[type=email], .campo input[type=tel], .campo input[type=number],
.campo input[type=date], .campo input[type=url], .campo input[type=password], .campo select, .campo textarea,
.input {
  font-weight: 400; font-size: 16px; padding: 11px 14px; min-height: 46px;
  border: 1px solid var(--borde-fuerte); border-radius: 10px; background: #fff; width: 100%;
}
.campo textarea { min-height: 96px; resize: vertical; line-height: 1.5; }
.campo input:focus, .campo select:focus, .campo textarea:focus, .input:focus {
  outline: none; border-color: var(--violeta); box-shadow: 0 0 0 3px rgba(107, 47, 160, .18);
}
.campo input[aria-invalid="true"], .campo select[aria-invalid="true"], .campo textarea[aria-invalid="true"] { border-color: var(--error); }
.req { color: var(--error); }
.check { display: flex; align-items: flex-start; gap: 10px; font-size: 15px; line-height: 1.45; cursor: pointer; }
.check input { width: 22px; height: 22px; margin: 1px 0 0; flex-shrink: 0; accent-color: var(--violeta); }

.avatar {
  border-radius: 50%; background: var(--borde); color: var(--violeta); display: inline-flex; align-items: center; justify-content: center;
  font-family: var(--f-titulo); font-weight: 700; object-fit: cover; flex-shrink: 0; overflow: hidden;
}

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after { animation: none !important; transition: none !important; }
}