/* Declaración de Fuente Institucional */
@font-face {
    font-family: 'Imaki';
    src: url('../fonts/Imaki_Italic.otf') format('opentype');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'Imaki';
    src: url('../fonts/Imaki_Italic.otf') format('opentype');
    font-weight: bold;
    font-style: normal;
}

/* Variables de marca */
:root {
    --tecnom-blue: #111c4e;
    --tecnom-green: #93d500;
    --tecnom-green-dark: #38d430;
    --white: #ffffff;
}

.bg-tecnom-blue { background-color: var(--tecnom-blue) !important; }
.text-tecnom-green { color: var(--tecnom-green) !important; }

/* Botón personalizado con tipografía Imaki-style */
.btn-tecnom {
    background-color: var(--tecnom-green);
    color: var(--tecnom-blue);
    border: none;
    font-weight: 700;
    transition: all 0.3s ease;
}

.btn-tecnom:hover {
    background-color: var(--tecnom-green-dark);
    color: var(--tecnom-blue);
    transform: scale(1.05);
}

.nav-link:hover {
    color: var(--tecnom-green) !important;
}

/* Estilos Generales */
body {
    font-family: sans-serif; /* Tipografía oficial */
    color: var(--tecnom-blue);
}

h1, h2, h3, .fw-bold {
    font-family: 'Imaki', sans-serif;
    font-weight: bold; /* Uso de Imaki Bold para énfasis [cite: 39] */
}

/* Header & Footer */
.header-main {
    background-color: var(--white);
    border-bottom: 3px solid var(--tecnom-green);
}

.navbar-dark .navbar-nav .nav-link.active {
    color: var(--tecnom-green) !important;
    border-bottom: 2px solid var(--tecnom-green);
}

footer a:hover {
    color: var(--tecnom-green) !important;
    opacity: 1 !important;
    transition: 0.3s;
}

footer .footer-link-active {
    color: var(--tecnom-green) !important;
    font-weight: bold;
}

.grayscale-logo {
    filter: grayscale(100%);
    opacity: 0.6;
    transition: all 0.3s ease;
}
.grayscale-logo:hover {
    filter: grayscale(0%);
    opacity: 1;
    transform: scale(1.1);
}

.aHeader:hover {
    color: var(--tecnom-green) !important;
    opacity: 1 !important;
    transition: 0.3s;
}

/** SPINNER CREATION **/

.loader {
  position: relative;
  text-align: center;
  margin: 15px auto 35px auto;
  z-index: 9999;
  display: block;
  width: 80px;
  height: 80px;
  border: 10px solid rgba(0, 0, 0, .3);
  border-radius: 50%;
  border-top-color: #000;
  animation: spin 1s ease-in-out infinite;
  -webkit-animation: spin 1s ease-in-out infinite;
}

@keyframes spin {
  to {
    -webkit-transform: rotate(360deg);
  }
}

@-webkit-keyframes spin {
  to {
    -webkit-transform: rotate(360deg);
  }
}

.modal-content {
  border-radius: 0px;
  box-shadow: 0 0 20px 8px rgba(0, 0, 0, 0.7);
}

.modal-backdrop.show {
  opacity: 0.75;
}

.loader-txt {
  p {
    font-size: 13px;
    color: #666;
    small {
      font-size: 11.5px;
      color: #999;
    }
  }
}