/* Colores Corporativos - Gobierno del Estado de Guanajuato */
/* Manual de Identidad - Gobierno de la Gente 2024-2030 */

/* Importar Google Fonts como fallback universal */
@import url('https://fonts.googleapis.com/css2?family=Vollkorn:wght@400;500;600;700;800;900&family=Inter:wght@300;400;500;600;700;800;900&display=swap');

/* Fuentes Corporativas - Con fallback a Google Fonts */
@font-face {
  font-family: 'Vollkorn-Local';
  src: url('../fonts/Vollkorn-Regular.ttf') format('truetype');
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: 'Vollkorn-Local';
  src: url('../fonts/Vollkorn-Medium.ttf') format('truetype');
  font-weight: 500;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: 'Vollkorn-Local';
  src: url('../fonts/Vollkorn-SemiBold.ttf') format('truetype');
  font-weight: 600;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: 'Vollkorn-Local';
  src: url('../fonts/Vollkorn-Bold.ttf') format('truetype');
  font-weight: 700;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: 'Vollkorn-Local';
  src: url('../fonts/Vollkorn-ExtraBold.ttf') format('truetype');
  font-weight: 800;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: 'Vollkorn-Local';
  src: url('../fonts/Vollkorn-Black.ttf') format('truetype');
  font-weight: 900;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: 'Helvetica Neue LT Std-Local';
  src: url('../fonts/HelveticaNeueLTStd-Roman.otf') format('opentype');
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: 'Helvetica Neue LT Std-Local';
  src: url('../fonts/HelveticaNeueLTStd-Md.otf') format('opentype');
  font-weight: 500;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: 'Helvetica Neue LT Std-Local';
  src: url('../fonts/HelveticaNeueLTStd-Bd.otf') format('opentype');
  font-weight: 700;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: 'Helvetica Neue LT Std-Local'; 
  src: url('../fonts/HelveticaNeueLTStd-Hv%202.otf') format('opentype');
  font-weight: 800;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: 'Helvetica Neue LT Std-Local';
  src: url('../fonts/HelveticaNeueLTStd-Blk.otf') format('opentype');
  font-weight: 900;
  font-style: normal;
  font-display: swap;
}

:root {
  /* Fuentes Corporativas con fallbacks robustos */
  --font-primary: 'Vollkorn-Local', 'Vollkorn', 'Georgia', 'Times New Roman', serif;
  --font-secondary: 'Helvetica Neue LT Std-Local', 'Inter', 'Helvetica Neue', 'Helvetica', 'Arial', sans-serif;

  /* Azul Primario - PANTONE 301 C */
  --gto-blue-primary: #004B87;
  --gto-blue-primary-rgb: 0, 75, 135;

  /* Azul Secundario - PANTONE 292 C */
  --gto-blue-secondary: #69B3E7;
  --gto-blue-secondary-rgb: 105, 179, 231;

  /* Azul Terciario - PANTONE 657 C */
  --gto-blue-tertiary: #C8D8EB;
  --gto-blue-tertiary-rgb: 200, 216, 235;

  /* Gris Oscuro - PANTONE Coolgray 10C */
  --gto-gray-dark: #63666A;
  --gto-gray-dark-rgb: 99, 102, 106;

  /* Gris Medio - PANTONE Coolgray 7C */
  --gto-gray-medium: #97989B;
  --gto-gray-medium-rgb: 151, 152, 155;

  /* Gris Claro - PANTONE Coolgray 3C */
  --gto-gray-light: #C8C9C7;
  --gto-gray-light-rgb: 200, 201, 199;
}

/* Clases de utilidad para colores de texto */
.text-gto-blue-primary { color: var(--gto-blue-primary); }
.text-gto-blue-secondary { color: var(--gto-blue-secondary); }
.text-gto-blue-tertiary { color: var(--gto-blue-tertiary); }
.text-gto-gray-dark { color: var(--gto-gray-dark); }
.text-gto-gray-medium { color: var(--gto-gray-medium); }
.text-gto-gray-light { color: var(--gto-gray-light); }

/* Clases de utilidad para colores de fondo */
.bg-gto-blue-primary { background-color: var(--gto-blue-primary); }
.bg-gto-blue-secondary { background-color: var(--gto-blue-secondary); }
.bg-gto-blue-tertiary { background-color: var(--gto-blue-tertiary); }
.bg-gto-gray-dark { background-color: var(--gto-gray-dark); }
.bg-gto-gray-medium { background-color: var(--gto-gray-medium); }
.bg-gto-gray-light { background-color: var(--gto-gray-light); }

/* Clases de utilidad para bordes */
.border-gto-blue-primary { border-color: var(--gto-blue-primary); }
.border-gto-blue-secondary { border-color: var(--gto-blue-secondary); }
.border-gto-blue-tertiary { border-color: var(--gto-blue-tertiary); }

/* Botones con colores corporativos */
.btn-gto-primary {
  background-color: var(--gto-blue-primary);
  color: white;
  transition: all 0.3s ease;
}

.btn-gto-primary:hover {
  background-color: rgba(var(--gto-blue-primary-rgb), 0.9);
  transform: translateY(-1px);
  box-shadow: 0 4px 12px rgba(var(--gto-blue-primary-rgb), 0.3);
}

.btn-gto-secondary {
  background-color: var(--gto-blue-secondary);
  color: white;
  transition: all 0.3s ease;
}

.btn-gto-secondary:hover {
  background-color: rgba(var(--gto-blue-secondary-rgb), 0.9);
  transform: translateY(-1px);
  box-shadow: 0 4px 12px rgba(var(--gto-blue-secondary-rgb), 0.3);
}

/* Badges con colores corporativos */
.badge-gto-primary {
  background-color: var(--gto-blue-primary);
  color: white;
}

.badge-gto-secondary {
  background-color: var(--gto-blue-secondary);
  color: white;
}

.badge-gto-tertiary {
  background-color: var(--gto-blue-tertiary);
  color: var(--gto-blue-primary);
}

.badge-gto-gray {
  background-color: var(--gto-gray-light);
  color: var(--gto-gray-dark);
}

/* Iconos con colores corporativos */
.icon-gto-primary { color: var(--gto-blue-primary); }
.icon-gto-secondary { color: var(--gto-blue-secondary); }
.icon-gto-gray { color: var(--gto-gray-dark); }

/* Gradientes corporativos */
.gradient-gto-primary {
  background: linear-gradient(135deg, var(--gto-blue-primary) 0%, var(--gto-blue-secondary) 100%);
}

.gradient-gto-secondary {
  background: linear-gradient(135deg, var(--gto-blue-secondary) 0%, var(--gto-blue-tertiary) 100%);
}

/* Efectos hover para iconos */
.icon-gto-primary:hover {
  color: var(--gto-blue-secondary);
  transition: color 0.3s ease;
}

/* Overlays con colores corporativos */
.overlay-gto-primary {
  background-color: rgba(var(--gto-blue-primary-rgb), 0.9);
}

.overlay-gto-secondary {
  background-color: rgba(var(--gto-blue-secondary-rgb), 0.9);
}

/* Utilidades responsive/estado para usar con Tailwind (hover/focus) */
.hover\:text-gto-blue-primary:hover { color: var(--gto-blue-primary); }
.hover\:bg-gto-blue-tertiary:hover { background-color: var(--gto-blue-tertiary); }
.focus\:ring-gto-blue-primary:focus { --tw-ring-color: var(--gto-blue-primary); }

/* TIPOGRAFÍA CORPORATIVA */
/* Basada en Manual de Identidad - Gobierno de la Gente 2024-2030 */

/* Fuente base del documento */
body {
  font-family: var(--font-secondary);
  font-weight: 400;
}

/* Vollkorn - Tipografía Principal para títulos y elementos destacados */
.font-primary {
  font-family: var(--font-primary);
}

.font-secondary {
  font-family: var(--font-secondary);
}

/* Jerarquía de títulos con Vollkorn */
h1, .heading-1 {
  font-family: var(--font-primary);
  font-weight: 800; /* ExtraBold */
  font-size: 2.5rem;
  line-height: 1.2;
  letter-spacing: -0.02em;
}

h2, .heading-2 {
  font-family: var(--font-primary);
  font-weight: 700; /* Bold */
  font-size: 2rem;
  line-height: 1.3;
  letter-spacing: -0.01em;
}

h3, .heading-3 {
  font-family: var(--font-primary);
  font-weight: 600; /* SemiBold */
  font-size: 1.5rem;
  line-height: 1.4;
}

h4, .heading-4 {
  font-family: var(--font-primary);
  font-weight: 500; /* Medium */
  font-size: 1.25rem;
  line-height: 1.4;
}

h5, .heading-5 {
  font-family: var(--font-primary);
  font-weight: 500;
  font-size: 1.125rem;
  line-height: 1.4;
}

h6, .heading-6 {
  font-family: var(--font-primary);
  font-weight: 500;
  font-size: 1rem;
  line-height: 1.4;
}

/* Texto de contenido con Helvetica Neue */
p, .body-text {
  font-family: var(--font-secondary);
  font-weight: 400;
  line-height: 1.6;
}

.body-text-medium {
  font-family: var(--font-secondary);
  font-weight: 500;
  line-height: 1.6;
}

.body-text-bold {
  font-family: var(--font-secondary);
  font-weight: 700;
  line-height: 1.6;
}

/* Navegación con Helvetica Neue */
nav, .nav-text {
  font-family: var(--font-secondary);
  font-weight: 500;
}

/* Botones con Helvetica Neue */
button, .btn, input[type="button"], input[type="submit"] {
  font-family: var(--font-secondary);
  font-weight: 600;
}

/* Enlaces con Helvetica Neue */
a {
  font-family: var(--font-secondary);
}

/* Formularios con Helvetica Neue */
input, textarea, select {
  font-family: var(--font-secondary);
  font-weight: 400;
}

/* Labels con Helvetica Neue Medium */
label {
  font-family: var(--font-secondary);
  font-weight: 500;
}

/* Texto pequeño/metadata con Helvetica Neue */
.text-sm, small, .caption {
  font-family: var(--font-secondary);
  font-weight: 400;
  font-size: 0.875rem;
  line-height: 1.5;
}

/* Clases de peso específicas para cada fuente */
.font-vollkorn-regular { font-family: var(--font-primary); font-weight: 400; }
.font-vollkorn-medium { font-family: var(--font-primary); font-weight: 500; }
.font-vollkorn-semibold { font-family: var(--font-primary); font-weight: 600; }
.font-vollkorn-bold { font-family: var(--font-primary); font-weight: 700; }
.font-vollkorn-extrabold { font-family: var(--font-primary); font-weight: 800; }
.font-vollkorn-black { font-family: var(--font-primary); font-weight: 900; }

.font-helvetica-regular { font-family: var(--font-secondary); font-weight: 400; }
.font-helvetica-medium { font-family: var(--font-secondary); font-weight: 500; }
.font-helvetica-bold { font-family: var(--font-secondary); font-weight: 700; }
.font-helvetica-heavy { font-family: var(--font-secondary); font-weight: 800; }
.font-helvetica-black { font-family: var(--font-secondary); font-weight: 900; }

/* Overrides responsive para títulos */
@media (max-width: 768px) {
  h1, .heading-1 {
    font-size: 2rem;
  }
  
  h2, .heading-2 {
    font-size: 1.75rem;
  }
  
  h3, .heading-3 {
    font-size: 1.375rem;
  }
}
.slider-container {
  width: 100%;
  overflow: hidden;
  position: relative;
  display: block; /* Aseguramos que se comporte como bloque */
}

.slider-track {
  display: flex;
  width: max-content; 
  animation: scroll-infinite 60s linear infinite;
}

@keyframes scroll-infinite {
  0% {
    transform: translateX(0);
  }
  100% {
    /* Usamos el valor exacto para evitar saltos decimales */
    transform: translateX(-33.333333%);
  }
}

/* Pausar al pasar el mouse */
.slider-track:hover {
  animation-play-state: paused;
}