/* =========================================================
   TEMA OSCURO (prueba)
   Para volver al sitio blanco: quita la línea
   <link rel="stylesheet" href="css/tema-oscuro.css"> de las páginas,
   o borra este archivo.
   ========================================================= */
:root {
  --bg: #0a0a0a;
  --ink: #f2f2f2;
  --muted: #9b9b9b;
  --rule: #262626;
  --soft: #151515;
}
html { color-scheme: dark; }
body, .is-home body { background: var(--bg); color: var(--ink); }

/* encabezado y submenú */
.header { background: var(--bg); color: var(--ink); box-shadow: 0 1px 0 var(--rule); }
.sub { background: #0f0f0f; color: var(--ink); box-shadow: 0 1px 0 var(--rule), 0 24px 40px -24px rgba(0,0,0,.6); }
.brand img.brand__logo { filter: brightness(0) invert(1); }
.nav > .nav__cta:hover { background: var(--ink); border-color: var(--ink); color: var(--bg); }

/* botones */
.pill { background: var(--ink); color: var(--bg); border-color: var(--ink); }
.pill:hover { background: transparent; color: var(--ink); }
.chip { background: transparent; color: var(--ink); border-color: #333; }
.chip:hover { border-color: var(--ink); }
.chip[aria-pressed="true"] { background: var(--ink); border-color: var(--ink); color: var(--bg); }

/* textos que estaban en gris oscuro */
.detail__text, .legal p { color: #c9c9c9; }
.ficha__text { color: #d9d9d9; }
.form input:not([type="checkbox"]), .form select, .form textarea { border-bottom-color: #3a3a3a; }
.form input::placeholder, .form textarea::placeholder { color: #666; }

/* pie: un poco más oscuro que el fondo y con línea de separación */
.footer { background: #000; border-top: 1px solid var(--rule); }

/* inicio: botones grandes de Proyectos / Servicios / Contacto */
.go::before { background: var(--ink); }
.go:hover, .go:focus-visible { color: var(--bg); }
.go:hover .go__n, .go:hover .go__d { color: rgba(0,0,0,.6); }

/* logos de clientes en negativo */
.logos--img li { background: #000; border-color: var(--rule); }
.logos--img img { filter: grayscale(1) invert(1); opacity: .75; }
.logos--img li:hover img { filter: grayscale(1) invert(1); opacity: 1; }

/* catálogo y ficha de proyectos */
.pc__img::after { background: var(--ink); color: var(--bg); }
.ficha { background: var(--bg); color: var(--ink); }
.ficha__bar { background: linear-gradient(var(--bg) 60%, rgba(10,10,10,0)); }
.ficha__close { background: var(--bg); color: var(--ink); border-color: #333; }
.ficha__close:hover { border-color: var(--ink); }

/* =========================================================
   ACENTO AZUL GMP: solo en lo que debe resaltar (cotizar / contactar)
   ========================================================= */
:root { --brand: #1a47e0; --brand-dark: #042eac; }

/* franja "¿Tienes un proyecto en mente?" en azul, de orilla a orilla */
.footer__top { background: var(--brand-dark); box-shadow: 0 0 0 100vmax var(--brand-dark); clip-path: inset(0 -100vmax); border-bottom: 0; }
.footer__top .pill--light { background: var(--white); color: var(--brand-dark); border-color: var(--white); font-weight: 500; }
.footer__top .pill--light:hover { background: transparent; color: var(--white); }

/* botones principales */
.pill { background: var(--brand); border-color: var(--brand); color: #fff; }
.pill:hover { background: transparent; border-color: var(--brand); color: #fff; }
.nav > .nav__cta { background: var(--brand); border-color: var(--brand); color: #fff; }
.nav > .nav__cta:hover, .header--over:not(.is-solid) .nav > .nav__cta:hover { background: #fff; border-color: #fff; color: var(--brand-dark); }

/* filtro activo y etiqueta "Ver proyecto" */
.chip[aria-pressed="true"] { background: var(--brand); border-color: var(--brand); color: #fff; }
.pc__img::after { background: var(--brand); color: #fff; }

/* inicio: los tres accesos se llenan de azul al pasar el mouse */
.go::before { background: var(--brand-dark); }
.go:hover, .go:focus-visible { color: #fff; }
.go:hover .go__n, .go:hover .go__d { color: rgba(255,255,255,.75); }
.go:hover .go__a { border-color: #fff; }

/* cifras de la introducción */
.figures dd { color: #fff; }
.figures div { border-top-color: var(--brand); }
