/* ==========================================================================
   MAKTRA CONSTRUCTORA — Ajustes de marca sobre el template Skyre
   Paleta: Amarillo #FFCC00 · Negro #000 · Blanco #FFF
   Este archivo se carga DESPUÉS de main.css para sobrescribir detalles.
   ========================================================================== */

:root {
  --maktra-yellow: #ffcc00;
  --theme: #ffcc00;
  --yellow: #ffcc00;
  --Primary: #ffcc00;
}

/* --- Botones: relleno amarillo + texto negro; hover a negro con texto blanco --- */
.theme-btn,
.theme-btn a,
.theme-btn i {
  color: #000 !important;
}
.theme-btn:before {
  background: #000 !important;
}
.theme-btn:hover,
.theme-btn:hover a,
.theme-btn:hover i {
  color: #fff !important;
}

/* Botón sobre secciones oscuras (negras): que el hover invierta a amarillo */
.bg-black .theme-btn:before,
.bg-dark .theme-btn:before {
  background: #fff !important;
}
.bg-black .theme-btn:hover,
.bg-black .theme-btn:hover a,
.bg-black .theme-btn:hover i,
.bg-dark .theme-btn:hover,
.bg-dark .theme-btn:hover a,
.bg-dark .theme-btn:hover i {
  color: #000 !important;
}

/* --- Bloques con fondo amarillo: asegurar texto negro legible --- */
.bg-theme,
.bg-theme * {
  color: #000 !important;
}

/* --- Secciones del template que MAKTRA no usa (one-page) --- */
.blog1 {
  display: none !important;
}

/* --- Hero MAKTRA: trabajador + fondo asfalto + badge amarillo --- */
.maktra-hero-visual {
  position: relative;
  min-height: 560px;
}
.maktra-hero-visual__bg {
  position: absolute;
  inset: 0;
  background: url("../images/hero/maktra-asphalt.png") center/cover no-repeat;
  border-radius: 16px;
  filter: grayscale(100%) contrast(1.05);
}
.maktra-hero-visual__overlay {
  position: absolute;
  inset: 0;
  border-radius: 16px;
  background: linear-gradient(180deg, rgba(0, 0, 0, 0.15) 0%, rgba(0, 0, 0, 0.6) 100%);
}
.maktra-hero-visual__worker {
  position: absolute;
  bottom: 0;
  left: 50%;
  transform: translateX(-50%);
  max-height: 560px;
  width: auto;
  z-index: 2;
}
.maktra-hero-visual__badge {
  position: absolute;
  top: 28px;
  right: 0;
  background: #ffcc00;
  color: #000;
  padding: 14px 20px;
  border-radius: 10px;
  z-index: 3;
  text-align: center;
  max-width: 170px;
  box-shadow: 0 14px 34px rgba(0, 0, 0, 0.35);
}
.maktra-hero-visual__badge .num {
  display: block;
  font-size: 30px;
  font-weight: 800;
  line-height: 1;
}
.maktra-hero-visual__badge .lbl {
  display: block;
  font-size: 11px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 1px;
  margin-top: 4px;
}
@media (max-width: 991px) {
  .maktra-hero-visual {
    min-height: 440px;
    margin-top: 30px;
  }
  .maktra-hero-visual__worker {
    max-height: 440px;
  }
}

/* --- Iconos/acentos amarillos sobre fondo claro: reforzar con negro donde
       el amarillo pierde contraste (se puede afinar tras revisar el preview) --- */

/* --- Popup del video MAKTRA (sección de video, auto-alojado) --- */
.maktra-video-popup {
  max-width: 1000px;
  margin: 20px auto;
  background: #000;
  border-radius: 10px;
  overflow: hidden;
  box-shadow: 0 24px 60px rgba(0, 0, 0, 0.55);
  border: 3px solid #ffcc00;
}
.maktra-video-popup__player {
  display: block;
  width: 100%;
  height: auto;
}

/* =========================================================
   AJUSTES DE FEEDBACK (revisión cliente)
   ========================================================= */

/* --- Botones: amarillo sólido + texto negro; hover: negro + texto amarillo --- */
.theme-btn,
.theme-btn[class*="style"] {
  background: #ffcc00 !important;
  border: 2px solid #ffcc00 !important;
  color: #000 !important;
}
.theme-btn span,
.theme-btn a,
.theme-btn i {
  color: #000 !important;
}
.theme-btn:before,
.theme-btn:after {
  display: none !important;
}
.theme-btn:hover,
.theme-btn:focus {
  background: #000 !important;
  border-color: #000 !important;
}
.theme-btn:hover span,
.theme-btn:hover a,
.theme-btn:hover i,
.theme-btn:hover {
  color: #ffcc00 !important;
}

/* --- Hero: título en amarillo para que resalte --- */
.hero1-content__title h1 {
  color: #ffcc00 !important;
  font-weight: 700 !important;
}

/* --- Logo del menú principal: tamaño correcto (logo ya recortado) --- */
#header-area .tp-logo img {
  height: 44px !important;
  max-height: 44px !important;
  max-width: none !important;
  width: auto !important;
}

/* --- 3 cajas de features (bajo el hero): misma altura --- */
.feature1-hero .row {
  align-items: stretch;
}
.feature1-hero .col-lg-4 {
  display: flex;
}
.feature1-hero .feature1-card {
  width: 100%;
  height: 100%;
}
/* Íconos de esas 3 cajas a negro (vienen en rojo) */
.feature1-hero .feature1-card__icon img {
  filter: brightness(0) saturate(100%);
}

/* --- Nosotros: párrafos justificados --- */
.about1__desc,
.about1__desc2 p {
  text-align: justify;
}

/* --- Ventajas Competitivas: 4 columnas en una sola fila (más esbelto) --- */
@media (min-width: 992px) {
  .feature1.section-padding .row > .col-lg-6 {
    flex: 0 0 auto;
    width: 25%;
  }
}

/* --- Video MAKTRA reproduciéndose directo en la sección (inline) --- */
.maktra-video-inline {
  position: relative;
  border-radius: 16px;
  overflow: hidden;
  box-shadow: 0 24px 60px rgba(0, 0, 0, 0.35);
  border: 3px solid #ffcc00;
}
.maktra-video-inline video {
  display: block;
  width: 100%;
  height: auto;
}