/* MCA · D · Faena con los colores del logo */
:root{
  --background:210 14% 94%;--foreground:210 14% 10%;--card:210 20% 99%;--muted:210 12% 89%;--muted-foreground:210 8% 38%;--border:210 10% 83%;
  --primary:208 66% 44%;--primary-foreground:0 0% 100%;--accent:208 66% 44%;--ring:208 66% 44%;
  --secondary:98 52% 42%;--secondary-foreground:0 0% 100%;
  --hero-overlay:linear-gradient(135deg,hsla(210,14%,6%,.92),hsla(208,40%,11%,.82));--section-dark:210 12% 9%;--radius:.25rem;
  --acc-claro:hsl(208 66% 40%);--acc-oscuro:hsl(98 57% 57%);
  --anillo:linear-gradient(135deg, hsl(208 68% 55%), hsl(98 57% 52%), hsl(208 68% 55%), hsl(98 57% 52%));
}

/* El acento va en un solo color, sin degradado animado: más profundo sobre fondo claro y más claro sobre fondo oscuro. */
.text-gradient{background:none!important;-webkit-text-fill-color:currentColor!important;color:var(--acc-claro)!important;animation:none!important}
.text-primary{color:var(--acc-claro)!important}
.hover\:text-primary:hover{color:var(--acc-claro)!important}
#inicio .text-gradient,#servicios .text-gradient,#contacto .text-gradient,footer .text-gradient,.bg-\[hsl\(var\(--section-dark\)\)\] .text-gradient,
#inicio .text-primary,#servicios .text-primary,#contacto .text-primary,footer .text-primary,.bg-\[hsl\(var\(--section-dark\)\)\] .text-primary{color:var(--acc-oscuro)!important}

/* Más industrial: títulos de sección en mayúsculas y esquinas casi rectas. El título del hero conserva su forma original. */
h1,h2,h3{text-transform:uppercase;letter-spacing:.015em}
#inicio h1{text-transform:none;letter-spacing:normal}
.rounded-xl,.rounded-2xl,.rounded-lg,.rounded-md{border-radius:.25rem!important}

/* Carrusel de la galería: las flechas se centraban sobre el bloque entero (foto + puntos) y quedaban 28 px
   más abajo que la foto. El bloque de puntos mide 3,5 rem (1,5 de margen + 2 de alto), así que se sube la mitad. */
#galeria button[aria-label="Anterior"],#galeria button[aria-label="Siguiente"]{top:calc(50% - 1.75rem)!important}

/* Cifras bajo el hero */
.mca-hero-stats{display:flex;flex-wrap:wrap;justify-content:center;gap:14px 44px;margin:3rem auto 0;padding-top:1.5rem;border-top:1px solid hsl(0 0% 100% / .14);max-width:46rem}
.mca-hero-stats div{display:flex;flex-direction:column;gap:2px;text-align:center}
.mca-hero-stats b{font-family:'Space Grotesk',sans-serif;font-size:1.4rem;font-weight:700;color:#fff;line-height:1.2;text-transform:none;letter-spacing:normal}
.mca-hero-stats span{font-size:.8rem;color:hsl(0 0% 72%)}

/* Cómo trabajamos */
.mca-proceso{padding:6rem 0;background:hsl(var(--background))}
.mca-sec-cab{text-align:center;margin-bottom:3.25rem}
.mca-eyebrow{margin:0 0 .5rem;font-size:.8rem;font-weight:600;letter-spacing:.15em;text-transform:uppercase;color:var(--acc-claro)}
.mca-sec-cab h2{margin:0;font-family:'Space Grotesk',sans-serif;font-size:clamp(1.8rem,4vw,3rem);font-weight:700;line-height:1.15;color:hsl(var(--foreground))}
.mca-sub{margin:1rem auto 0;max-width:40rem;color:hsl(var(--muted-foreground))}
.mca-pasos{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:1rem}
.mca-paso{display:flex;flex-direction:column;gap:.5rem;padding:1.25rem;background:hsl(var(--card));border:1px solid hsl(var(--border));border-radius:var(--radius)}
.mca-num{display:grid;place-items:center;width:2.5rem;height:2.5rem;border-radius:999px;background:hsl(var(--primary));color:hsl(var(--primary-foreground));font-weight:700;font-size:.9rem}
.mca-paso h3{margin:.25rem 0 0;font-size:1.05rem;font-weight:700;line-height:1.25;color:hsl(var(--foreground))}
.mca-paso p{margin:0;font-size:.9rem;line-height:1.5;color:hsl(var(--muted-foreground))}
.mca-informe{display:flex;gap:1.25rem;align-items:flex-start;margin-top:1.5rem;padding:1.5rem;background:hsl(var(--card));border:1px solid hsl(var(--border));border-left:4px solid hsl(var(--primary));border-radius:var(--radius)}
.mca-informe-tag{flex:none;font-size:.72rem;font-weight:700;letter-spacing:.08em;text-transform:uppercase;background:hsl(var(--primary) / .14);color:var(--acc-claro);padding:.35rem .7rem;border-radius:999px;white-space:nowrap}
.mca-informe h3{margin:0 0 .25rem;font-size:1.1rem;font-weight:700;color:hsl(var(--foreground))}
.mca-informe p{margin:0;color:hsl(var(--muted-foreground));line-height:1.55}
@media(max-width:1024px){.mca-pasos{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:640px){.mca-pasos{grid-template-columns:1fr}.mca-informe{flex-direction:column}.mca-proceso{padding:4rem 0}}

/* El verde del logo queda como acento: la etiqueta del informe, su filo y las cifras del hero */
.mca-informe{border-left-color:hsl(98 52% 45%)}
.mca-informe-tag{background:hsl(98 57% 57% / .28);color:hsl(98 55% 22%)}
.mca-hero-stats b{color:hsl(98 57% 62%)}

/* Fondos y grises con matiz azul marino reescritos a un neutro (generado a partir del CSS compilado) */
input::-moz-placeholder,textarea::-moz-placeholder{opacity:1!important;color:hsl(210 3% 65%)!important}
input::placeholder,textarea::placeholder{opacity:1!important;color:hsl(210 3% 65%)!important}
.bg-\[hsl\(220\,25\%\,12\%\,0\.5\)\]{background-color:hsl(210 7% 12% / 0.50)!important}
.bg-\[hsl\(220\,25\%\,12\%\,0\.6\)\]{background-color:hsl(210 7% 12% / 0.60)!important}
.bg-\[hsl\(220\,25\%\,8\%\,0\.6\)\]{background-color:hsl(210 8% 8% / 0.60)!important}
.from-\[hsl\(220\,25\%\,8\%\)\]{--tw-gradient-from: hsl(210 8% 8%) var(--tw-gradient-from-position)!important;--tw-gradient-to: hsl(210 8% 8% / 0) var(--tw-gradient-to-position)!important;--tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to)!important}
.from-\[hsl\(220\,25\%\,8\%\,0\.92\)\]{--tw-gradient-from: hsl(210 8% 8% / .92) var(--tw-gradient-from-position)!important;--tw-gradient-to: hsl(210 8% 8% / 0) var(--tw-gradient-to-position)!important;--tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to)!important}
.to-\[hsl\(220\,25\%\,8\%\,0\.96\)\]{--tw-gradient-to: hsl(210 8% 8% / .96) var(--tw-gradient-to-position)!important}

/* Botón flotante «volver al inicio»: mismo tamaño que el de WhatsApp, justo encima */
.mca-subir{position:fixed;right:1.5rem;bottom:6.5rem;z-index:50;width:4rem;height:4rem;border-radius:9999px;border:0;cursor:pointer;display:flex;align-items:center;justify-content:center;background:hsl(var(--primary));color:#fff;box-shadow:0 25px 50px -12px rgba(0,0,0,.45);opacity:0;visibility:hidden;transform:translateY(8px);transition:opacity .25s,transform .25s,visibility .25s,background-color .2s}
.mca-subir.visible{opacity:1;visibility:visible;transform:none}
.mca-subir:hover{background:hsl(var(--primary) / .88)}
.mca-subir:active{transform:scale(.95)}

/* Logo del pie: sus letras son oscuras, sobre el carbón necesita una placa clara */
footer img[src*="MCHM_LOGO"]{background:#f1f3f4;padding:.6rem .85rem;border-radius:.25rem;box-sizing:content-box}

/* Móvil: botones flotantes a escala de celular y tarjeta de cifras dentro de la pantalla */
@media (max-width:640px){
  a[aria-label="Contactar por WhatsApp"]{width:3rem!important;height:3rem!important;right:1rem!important;bottom:1rem!important}
  a[aria-label="Contactar por WhatsApp"] svg{width:24px!important;height:24px!important}
  .mca-subir{width:3rem;height:3rem;right:1rem;bottom:4.75rem}
  .mca-subir svg{width:24px;height:24px}
  #nosotros .grid.grid-cols-2 + .glass{width:max-content;max-width:calc(100% - 1rem);padding:.7rem 1rem;gap:.75rem}
  #nosotros .grid.grid-cols-2 + .glass p:first-child{font-size:1.5rem;line-height:1.75rem}
  #nosotros .grid.grid-cols-2 + .glass p+p,#nosotros .grid.grid-cols-2 + .glass .text-xs{font-size:.65rem}
  #nosotros .grid.grid-cols-2 img{height:11rem}
}

/* La tarjeta de cifras perdía su translate(-50%) al animarse (framer-motion pisa el transform): se centra con márgenes */
#nosotros .grid.grid-cols-2 + .glass{left:0!important;right:0!important;margin-inline:auto!important;width:max-content}

/* Galería: la fila de puntos cambiaba de alto (32→22→32 px) al animar el punto activo y movía toda la sección */
#galeria .flex.justify-center.items-center.gap-2\.5{height:2rem;min-height:2rem}
#galeria{overflow-anchor:none}