/* ================================================
   DIMEMSA — Capa de mejora visual (no altera contenido)
   Tipografía unificada, acentos en rojo, micro-interacciones.
   ================================================ */

html { scroll-behavior: smooth; }

/* Transiciones suaves y consistentes en toda la web */
a, button, .theme-btn, .btn-style-one, .btn-style-two,
.service-block-one .inner-box, .project-block-one .inner-box,
.header-top, .main-header, img {
  transition: all 0.35s cubic-bezier(.4,0,.2,1);
}

/* Header: sombra al hacer scroll (activada por theme-enhance.js) */
.main-header.scrolled {
  box-shadow: 0 6px 24px rgba(0,0,0,0.35);
}

/* Botones: efecto hover más vivo, coherente con el acento rojo */
.theme-btn:hover, .btn-style-one:hover, .btn-style-two:hover {
  transform: translateY(-3px);
  box-shadow: 0 10px 24px rgba(228, 0, 43, 0.35);
}

/* Tarjetas de servicios / proyectos: levantar en hover */
.service-block-one .inner-box:hover,
.project-block-one .inner-box:hover,
.team-block-one .inner-box:hover {
  transform: translateY(-8px);
  box-shadow: 0 18px 40px rgba(0,0,0,0.28);
}

/* Imágenes dentro de tarjetas: leve zoom al pasar el mouse */
.service-block-one .image-box img,
.project-block-one .image img,
.gallery-block .image img {
  transition: transform 0.6s ease;
}
.service-block-one:hover .image-box img,
.project-block-one:hover .image img,
.gallery-block:hover .image img {
  transform: scale(1.08);
}

/* Enlaces del menú: subrayado animado */
.main-menu .navigation > li > a {
  position: relative;
}
.main-menu .navigation > li > a::after {
  content: "";
  position: absolute;
  left: 0; bottom: -4px;
  width: 0; height: 2px;
  background: #F5A623;
  transition: width 0.3s ease;
}
.main-menu .navigation > li:hover > a::after,
.main-menu .navigation > li.current > a::after {
  width: 100%;
}

/* Reveal suave por scroll (usado por theme-enhance.js) */
.reveal-on-scroll {
  opacity: 0;
  transform: translateY(24px);
  transition: opacity 0.7s ease, transform 0.7s ease;
}
.reveal-on-scroll.is-visible {
  opacity: 1;
  transform: translateY(0);
}

/* Botón de WhatsApp flotante: pulso sutil para llamar la atención */
@keyframes dimemsa-pulse {
  0%   { box-shadow: 0 0 0 0 rgba(245,166,35,0.45); }
  70%  { box-shadow: 0 0 0 14px rgba(245,166,35,0); }
  100% { box-shadow: 0 0 0 0 rgba(245,166,35,0); }
}
.whatsapp-btn, .fixed-whatsapp, a[href*="wa.me"], a[href*="whatsapp"] {
  animation: dimemsa-pulse 2.4s infinite;
  border-radius: 50%;
}

/* Contadores: leve resalte en rojo para consistencia de marca */
.count-box .count-text {
  color: #F5A623;
}

/* ================================================
   Esquinas ovaladas en fotografías de contenido
   (no afecta logos, iconos ni el slider a pantalla completa)
   ================================================ */
.image img,
.image-box img,
.image-outer img {
  border-radius: 18px;
}

/* ================================================
   Resplandores degradados amarillos suaves
   (cabeceras internas, pie de página y estadísticas)
   ================================================ */
.page-title:before {
  background-image:
    radial-gradient(circle at top right, rgba(245,166,35,0.22) 0%, rgba(245,166,35,0) 55%),
    linear-gradient(to left, rgba(0,0,0,0) 0%, #000000 100%);
}

.main-footer {
  overflow: hidden;
}
.main-footer:before {
  content: '';
  position: absolute;
  left: -100px;
  bottom: -100px;
  width: 340px;
  height: 340px;
  background: radial-gradient(circle, rgba(245,166,35,0.14) 0%, rgba(245,166,35,0) 70%);
  pointer-events: none;
  z-index: 0;
}
.main-footer .widgets-section,
.main-footer .footer-bottom {
  position: relative;
  z-index: 1;
}

/* ================================================
   Sección "Nuestros Principales Clientes" (solo Inicio)
   Franja horizontal con desplazamiento continuo
   ================================================ */
.clients-marquee-section {
  position: relative;
  padding: 65px 0 75px;
  background-color: #12151c;
  overflow: hidden;
}

.clients-marquee-section .sec-title {
  margin-bottom: 45px;
}

.clients-marquee {
  position: relative;
  width: 100%;
  overflow: hidden;
  -webkit-mask-image: linear-gradient(to right, transparent 0, #000 8%, #000 92%, transparent 100%);
  mask-image: linear-gradient(to right, transparent 0, #000 8%, #000 92%, transparent 100%);
}

.clients-track {
  display: flex;
  align-items: center;
  width: max-content;
  animation: clients-scroll 32s linear infinite;
}

.clients-marquee:hover .clients-track {
  animation-play-state: paused;
}

.client-logo {
  flex: 0 0 auto;
  margin: 0 18px;
  width: 92px;
  height: 106px;
  display: block;
  border-radius: 14px;
  overflow: hidden;
  box-shadow: 0 8px 20px rgba(0,0,0,0.25);
  transition: transform 0.3s ease, box-shadow 0.3s ease;
}

.client-logo:hover {
  transform: translateY(-4px);
  box-shadow: 0 14px 28px rgba(0,0,0,0.35);
}

.client-logo a {
  display: block;
  width: 100%;
  height: 100%;
}

.client-logo img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
  border-radius: 14px;
}

@keyframes clients-scroll {
  from { transform: translateX(0); }
  to { transform: translateX(-50%); }
}

@media (max-width: 767px) {
  .client-logo {
    width: 74px;
    height: 86px;
    margin: 0 12px;
  }
}

/* Header: logo y menú alineados a los bordes de la pantalla en todas las páginas */
.header-top .auto-container,
.header-upper .auto-container {
  max-width: 100%;
  padding: 0 30px;
}

/* Fondo gris tipo "sombra" detrás de algunas imágenes: se elimina */
.story-section .image-column .image:before {
  display: none;
}
.story-section .image-column .image {
  padding-right: 0;
  padding-top: 0;
}

/* Slider principal de Inicio: sin franjas laterales, de borde a borde */
.main-slider.style-two:before,
.main-slider.style-two:after {
  display: none;
}

.counter-section {
  overflow: hidden;
}
.counter-section:before {
  content: '';
  position: absolute;
  right: -80px;
  top: -80px;
  width: 300px;
  height: 300px;
  background: radial-gradient(circle, rgba(245,166,35,0.18) 0%, rgba(245,166,35,0) 70%);
  pointer-events: none;
  z-index: 0;
}

/* ================================================
   Tarjeta de estadísticas (solo sección de Inicio)
   ================================================ */
.fact-counter.stats-card {
  position: relative;
  z-index: 1;
  background: linear-gradient(180deg, #1a1e26 0%, #14171d 100%);
  border: 1px solid rgba(255,255,255,0.06);
  border-radius: 22px;
  padding: 45px 20px 0px;
  box-shadow: 0 25px 60px rgba(0,0,0,0.35);
}

@media (min-width: 992px) {
  .fact-counter.stats-card .counter-column:not(:last-child) {
    border-right: 1px solid rgba(255,255,255,0.12);
  }
}
