/* aimh-skin-legacy.css — la piel del mockup sobre los cuerpos legacy
   ═══════════════════════════════════════════════════════════════════════════
   #608 bloque 3 (Dirección, 2026-09-19: «ahora ponlo en toda la página con
   esta skin»). TRANSITORIO, como aimh-bridge.css, y con la misma vida: se
   borra el día que la última página legacy se migre a la fundación.

   Qué es: las 65 páginas públicas puenteadas ya llevan el cascarón nuevo
   pero su CUERPO sigue siendo css/style.css (2024): degradados, sombras que
   levantan, botones verdes, fondo con foto fija, cabeceras de página con
   focos radiales. Reescribir 65 cuerpos es la migración completa y no cabe
   en una ola; lo que sí cabe es que esos componentes hablen la piel de la
   portada: la paleta y las medidas de 021, el azul de marca como única
   superficie fuerte, tarjetas planas con filete, botones de la fundación,
   nada que brille ni se mueva solo.

   Cómo: (1) las variables legacy (--primary, --bg, --text-body…) que style.css
   y los style="" inline consultan se REMAPEAN a tokens de la fundación —
   con eso hasta los estilos inline heredan la paleta nueva; (2) los
   componentes con más presencia (page-header, section-header, sc-card,
   service-card, glass-card, btn-primary/secondary, section) se redibujan
   con tokens. Todo cuelga de body.aimh-legacy-bridge y va sin capa, porque
   style.css va sin capa y hay que ganarle en orden de fuente.

   Lo que NO hace: no toca la lógica, los formularios ni el texto; no añade
   fotos (los huecos siguen en la Media Library); no inventa un color: cada
   valor es un var(--aimh-*). Si aquí aparece un número suelto, es un error. */

/* ── 1 · la paleta legacy pasa a ser la de la fundación ───────────────── */
body.aimh-legacy-bridge {
  --primary: var(--aimh-brand-primary);
  --primary-dark: var(--aimh-brand-primary-pressed);
  --primary-light: var(--aimh-brand-primary-hover);
  --primary-50: var(--aimh-surface-canvas-alt);
  --primary-100: var(--aimh-border-subtle);
  --green: var(--aimh-brand-primary);
  --green-accion: var(--aimh-button-primary-bg);
  --green-accion-dark: var(--aimh-button-primary-bg-hover);
  --green-dark: var(--aimh-button-primary-bg-pressed);
  --green-50: var(--aimh-surface-canvas-alt);
  --secondary: var(--aimh-brand-primary-pressed);
  --bg: var(--aimh-surface-canvas);
  --white: var(--aimh-surface-default);
  --text: var(--aimh-text-primary);
  --text-body: var(--aimh-text-primary);
  --text-secondary: var(--aimh-text-secondary);
  --text-light: var(--aimh-text-secondary);
  --border: var(--aimh-border-subtle);
  --border-light: var(--aimh-border-divider);
  --linea: var(--aimh-border-divider);
  --radius: var(--aimh-radius-lg);
  --radius-sm: var(--aimh-radius-md);
  --radius-lg: var(--aimh-radius-lg);
  --radius-full: var(--aimh-radius-pill);
  --shadow-sm: none;
  --shadow-md: none;
  --shadow-lg: none;
  --font-heading: var(--aimh-font-family-heading);
  --font-body: var(--aimh-font-family-sans);
  background: var(--aimh-surface-canvas);
  color: var(--aimh-text-primary);
  font-family: var(--aimh-font-family-sans);
  font-size: var(--aimh-text-body-size);
  line-height: var(--aimh-lh-body);
}
/* sin fondo fotográfico fijo detrás del texto: la portada no lo lleva */
body.aimh-legacy-bridge { background-image: none; background-attachment: scroll; }

/* ── 2 · tipografía: la escala de la portada ──────────────────────────── */
body.aimh-legacy-bridge :is(h1, h2, h3, h4) { font-family: var(--aimh-font-family-heading); color: var(--aimh-text-primary); letter-spacing: -0.02em; }
body.aimh-legacy-bridge h1 { font-size: var(--aimh-text-display-size); line-height: var(--aimh-text-display-lh); letter-spacing: -0.025em; font-weight: 700; text-wrap: balance; }
body.aimh-legacy-bridge h2, body.aimh-legacy-bridge .section-header h2, body.aimh-legacy-bridge .section-title { font-size: var(--aimh-text-statement-size); line-height: 1.1; font-weight: 700; text-wrap: balance; }
body.aimh-legacy-bridge h3 { font-size: var(--aimh-text-subsection-size); line-height: var(--aimh-lh-heading); font-weight: 600; letter-spacing: 0; }
body.aimh-legacy-bridge .section-header p { color: var(--aimh-text-secondary); font-size: var(--aimh-text-lead-size); line-height: 1.55; }
body.aimh-legacy-bridge main a:not([class]) { color: var(--aimh-text-link); text-decoration: underline; }

/* ── 3 · cabecera de página: la superficie azul de marca, plana ────────
   Era un degradado oscuro con dos focos radiales. Ahora es el azul de marca
   con el titular a escala de display y el texto claro — la misma superficie
   fuerte que la portada usa para la tarjeta de cifras. */
body.aimh-legacy-bridge .page-header { margin-top: 0; padding: var(--aimh-space-96) 0 var(--aimh-space-64); background: var(--aimh-brand-primary); color: var(--aimh-brand-on-primary); text-align: start; }
body.aimh-legacy-bridge .page-header::before, body.aimh-legacy-bridge .page-header::after { display: none; }
body.aimh-legacy-bridge .page-header :is(h1, h2, p, span, small, li) { color: inherit; }
body.aimh-legacy-bridge .page-header h1 { font-size: var(--aimh-text-display-size); font-weight: 700; margin: 0 0 var(--aimh-space-16); max-inline-size: 22ch; }
body.aimh-legacy-bridge .page-header p { font-size: var(--aimh-text-lead-size); line-height: 1.55; max-inline-size: 46ch; margin: 0; opacity: 0.94; }
body.aimh-legacy-bridge .page-header .hero-badge, body.aimh-legacy-bridge .page-header .badge { background: transparent; border: 1px solid currentColor; color: inherit; border-radius: var(--aimh-radius-pill); box-shadow: none; }
body.aimh-legacy-bridge .page-header a:not([class]) { color: inherit; }
@media (max-width: 599px) { body.aimh-legacy-bridge .page-header { padding: var(--aimh-space-48) 0; } }

/* el héroe legacy de las pocas páginas que aún lo llevan */
body.aimh-legacy-bridge .hero { min-height: 0; background: var(--aimh-surface-canvas); }

/* ── 4 · secciones: ritmo de la portada, sin bandas alternas ─────────── */
body.aimh-legacy-bridge .section { padding: var(--aimh-space-section-public-lg) 0; background: transparent; }
body.aimh-legacy-bridge .section:nth-child(even) { background: var(--aimh-surface-canvas-alt); }
body.aimh-legacy-bridge .container { max-width: var(--aimh-max-public); padding-inline: var(--aimh-space-margin-public); }
@media (max-width: 599px) { body.aimh-legacy-bridge .container { padding-inline: var(--aimh-space-margin-public-narrow); } }

/* ── 5 · tarjetas: planas, con filete, como las seis puertas ───────────
   Sin sombra, sin levantarse al pasar el ratón, sin cristal. El borde se
   vuelve azul al hover/focus, exactamente como .aimh-door. */
body.aimh-legacy-bridge :is(.sc-card, .service-card, .glass-card, .icon-box, .gl-item, .card) {
  background: var(--aimh-surface-default); border: 1px solid var(--aimh-border-subtle); border-radius: var(--aimh-radius-lg);
  box-shadow: none; transform: none; transition: border-color var(--aimh-motion-duration-fast) var(--aimh-motion-easing-state);
}
body.aimh-legacy-bridge :is(.sc-card, .service-card, .glass-card, .icon-box, .gl-item, .card):hover,
body.aimh-legacy-bridge :is(.sc-card, .service-card, .glass-card, .icon-box, .gl-item, .card):focus-within { box-shadow: none; transform: none; border-color: var(--aimh-brand-primary); }
body.aimh-legacy-bridge .service-content { padding: var(--aimh-space-24); }
body.aimh-legacy-bridge .service-icon { background: var(--aimh-surface-canvas-alt); border-radius: var(--aimh-radius-md); box-shadow: none; }
body.aimh-legacy-bridge .gradient-line { display: none; }

/* ── 6 · botones: los de la fundación ──────────────────────────────────
   El primario era verde y saltaba con sombra al pasar el ratón; el
   mockup tiene un solo color de acción, el azul de marca, y quieto. */
body.aimh-legacy-bridge :is(.btn-primary, .btn-primary-small, .btn-submit, button[type="submit"]:not([class])) {
  display: inline-flex; align-items: center; justify-content: center; gap: var(--aimh-control-gap-icon);
  min-block-size: var(--aimh-control-height-md); padding: 0 var(--aimh-control-padding-inline);
  background: var(--aimh-button-primary-bg); color: var(--aimh-button-primary-fg); border: 1px solid var(--aimh-button-primary-bg);
  border-radius: var(--aimh-control-radius); font-family: var(--aimh-font-family-sans); font-size: var(--aimh-text-button-size); font-weight: 500; line-height: 1;
  box-shadow: none; transform: none; text-decoration: none; letter-spacing: 0; text-transform: none;
}
body.aimh-legacy-bridge :is(.btn-primary, .btn-primary-small, .btn-submit):hover { background: var(--aimh-button-primary-bg-hover); border-color: var(--aimh-button-primary-bg-hover); color: var(--aimh-button-primary-fg); transform: none; box-shadow: none; }
body.aimh-legacy-bridge :is(.btn-primary, .btn-primary-small, .btn-submit):active { background: var(--aimh-button-primary-bg-pressed); border-color: var(--aimh-button-primary-bg-pressed); transform: none; }
body.aimh-legacy-bridge .btn-secondary {
  display: inline-flex; align-items: center; justify-content: center; min-block-size: var(--aimh-control-height-md); padding: 0 var(--aimh-control-padding-inline);
  background: transparent; color: var(--aimh-button-secondary-fg); border: 1px solid var(--aimh-button-secondary-border); border-radius: var(--aimh-control-radius);
  font-family: var(--aimh-font-family-sans); font-size: var(--aimh-text-button-size); font-weight: 500; line-height: 1; box-shadow: none; transform: none; text-decoration: none;
}
body.aimh-legacy-bridge .btn-secondary:hover { background: var(--aimh-surface-canvas-alt); color: var(--aimh-button-secondary-fg); transform: none; box-shadow: none; }
/* dentro de la cabecera azul, el secundario va en contorno claro */
body.aimh-legacy-bridge .page-header .btn-secondary { color: var(--aimh-brand-on-primary); border-color: var(--aimh-brand-on-primary); }
body.aimh-legacy-bridge .page-header .btn-secondary:hover { background: var(--aimh-brand-on-primary); color: var(--aimh-brand-primary); }
body.aimh-legacy-bridge .page-header .btn-primary { background: var(--aimh-brand-on-primary); color: var(--aimh-brand-primary); border-color: var(--aimh-brand-on-primary); }
body.aimh-legacy-bridge .page-header .btn-primary:hover { background: var(--aimh-surface-canvas-alt); border-color: var(--aimh-surface-canvas-alt); color: var(--aimh-brand-primary); }

/* ── 7 · formularios: los campos de la fundación ──────────────────────── */
body.aimh-legacy-bridge :is(input, select, textarea):not([type="checkbox"]):not([type="radio"]) {
  border: 1px solid var(--aimh-border-strong); border-radius: var(--aimh-radius-control); background: var(--aimh-surface-default); color: var(--aimh-text-primary);
  font-family: var(--aimh-font-family-sans); box-shadow: none;
}
body.aimh-legacy-bridge :is(input, select, textarea):focus-visible { outline: 2px solid var(--aimh-focus-ring); outline-offset: 1px; border-color: var(--aimh-brand-primary); box-shadow: none; }

/* ── 8 · nada se mueve solo ────────────────────────────────────────────
   Las entradas por scroll del cuerpo legacy siguen valiendo (una vez, sin
   bucle); lo que se quita es el brillo, el flotar y el levantarse. */
body.aimh-legacy-bridge :is(.float, .floating, [class*="pulse"], [class*="shimmer"]) { animation: none; }