/* =========================================================================
   VektaC — acento del sitio
   Pedido del usuario (2026-10-16): VektaC usa los colores del sitio anterior
   de VektaConsulting (azul #0056d2), en lugar del azul petróleo, también en su
   logo y su favicon. Solo VektaC; las ramas mantienen sus acentos y el logo
   de VektaC en azul petróleo.
   Contraste verificado (WCAG AA):
     día:   blanco sobre #0056d2 6,4:1 · #0056d2 sobre #f1f1f1 5,7:1
     noche: blanco sobre #0056d2 6,4:1 · texto #8fbaf0 sobre #2e2f30 6,7:1
   ========================================================================= */

:root {
  --acento: #0056d2;              /* fondos de botones, líneas, detalles */
  --acento-hover: #0047ae;        /* hover de botones */
  --acento-sobre: #ffffff;        /* texto sobre el acento */
  --acento-texto: #0056d2;        /* el acento usado como texto (enlaces, rótulos) */
  --acento-hover-texto: #0047ae;
  --acento-fondo: #0056d2;        /* animación de fondo de la portada */
  --marca: #0056d2;               /* logo de VektaC en este sitio (como el sitio anterior) */
}

.dark {
  --acento: #0056d2;
  --acento-hover: #0047ae;
  --acento-sobre: #ffffff;
  --acento-texto: #8fbaf0;
  --acento-hover-texto: #b3d0f5;
  --acento-fondo: #5795d9;
  --marca: #ffffff;               /* de noche el logo va en blanco (el azul no se distingue sobre oscuro) */
}

/* Nombre como en el sitio anterior: "Vekta" en el color de los títulos y la "C" en azul */
.brand__name { color: var(--heading); }
.brand:hover .brand__name { color: var(--heading); }

/* Portada como en el sitio anterior: fondo con brillo azul y título con degradé */
.hero {
  background:
    radial-gradient(ellipse 80% 60% at 50% 0%, #d6e5fb 0%, transparent 70%),
    radial-gradient(ellipse 60% 50% at 100% 100%, #e1ebf8 0%, transparent 70%),
    #f6f8fb;
}
.dark .hero {
  background:
    radial-gradient(ellipse 80% 60% at 50% 0%, #10284d 0%, transparent 70%),
    radial-gradient(ellipse 60% 50% at 100% 100%, #0b1d3a 0%, transparent 70%),
    #111111;
}
.hero h1 {
  background: linear-gradient(180deg, #0f1d33 35%, #0a3f95 100%);
  -webkit-background-clip: text; background-clip: text;
  color: transparent;
}
.dark .hero h1 { background-image: linear-gradient(180deg, #ffffff 30%, #a9b9cf 100%); }

/* Ficha ampliada del equipo: enlaces a Instagram y LinkedIn como íconos */
.ficha__body .ficha__redes { margin-top: 0.5rem; flex-wrap: wrap; align-items: center; list-style: none; padding: 0; }
.ficha .ficha__redes li + li { margin-top: 0; }
.ficha__redes a.ficha__enlace { display: inline; width: auto; height: auto; border: 0; border-radius: 0; color: var(--acento-texto); }