/* Marco responsive compartido. Sustituye los ajustes de preview-round13. */
:root {
  --content-width: 1440px;
  --layout-gutter: clamp(22px, 5vw, 72px);
  --frame-left: max(var(--layout-gutter), calc((100% - var(--content-width)) / 2), env(safe-area-inset-left, 0px));
  --frame-right: max(var(--layout-gutter), calc((100% - var(--content-width)) / 2), env(safe-area-inset-right, 0px));
  --video-hero-height: clamp(360px, 46svh, 520px);
}
html { scroll-padding-top: 100px; }
body .site-header.is-hidden:not(.is-open):not(:focus-within) { transform: translateY(-100%); pointer-events: none; }
body .site-header:is(.is-open, :focus-within) { transform: translateY(0); pointer-events: auto; }
body .site-nav { flex-wrap: nowrap; }
body .site-header:is(.is-scrolled, .is-open, .is-solid) :is(.nav-dropdown-trigger, .language-switcher a) { color: #fff; }
@media (max-width: 1023px) {
  body .site-header {
    min-height: calc(68px + env(safe-area-inset-top, 0px));
    padding-block: calc(10px + env(safe-area-inset-top, 0px)) 10px;
  }
  body .site-header .brand-logo { width: 136px; height: auto; }
  body .site-header .menu-button {
    position: absolute; display: grid; width: 44px; height: 44px;
    top: calc(12px + env(safe-area-inset-top, 0px)); right: max(22px, env(safe-area-inset-right, 0px));
  }
  body .site-header .site-nav {
    display: none; position: absolute; inset: calc(100% - 1px) 0 auto;
    width: 100%; max-height: calc(100dvh - 68px - env(safe-area-inset-top, 0px));
    overflow-y: auto; overscroll-behavior: contain;
    padding: 12px var(--layout-gutter) max(22px, env(safe-area-inset-bottom, 0px));
    color: #fff; background: var(--wine); box-shadow: 0 18px 32px #2b2b2b14;
  }
  body .site-header.is-open .site-nav { display: grid; grid-template-columns: minmax(0, 1fr); gap: 2px; }
  body .site-nav > :is(a, .nav-dropdown, .language-switcher) { width: 100%; min-width: 0; justify-self: stretch; }
  body .site-nav :is(a, .nav-dropdown-trigger) { min-height: 44px; padding: 10px 12px; }
  body .site-nav .nav-dropdown-trigger { width: 100%; justify-content: space-between; }
  body .site-nav .nav-dropdown { position: relative; }
  body .site-nav .dropdown-menu {
    position: static; inset: auto; width: 100%; min-width: 0;
    grid-template-columns: minmax(0, 1fr); grid-template-rows: none;
    margin: 2px 0 4px; padding: 2px 0 4px; overflow: visible; transform: none;
    color: #fff; background: var(--wine); box-shadow: none;
  }
  body .site-nav .dropdown-menu::before { display: none; }
  body .site-nav .dropdown-menu a { grid-column: 1; color: #fff; }
  body .site-nav .nav-dropdown.is-open .dropdown-menu { display: grid; }
  body .site-nav:has(.nav-dropdown.is-open) > :is(a, .language-switcher) { display: none; }
}
body :is(main, section, article, aside, figure, form) { min-width: 0; }
body :is(.site-header, .page-hero, .contact-barcelona-hero, .taric-hero,
  .section, .hand-feature-section, .solution-visual-story, .eir-process-section,
  .process-interactive-section, .process-faq, .knowledge-tree-section,
  .home-company-section, .home-solutions-summary, .home-values-section,
  .site-donut-section, .contact-section, .blog-section, .footer-cta) {
  padding-left: var(--frame-left);
  padding-right: var(--frame-right);
}
body:not(.home-page) main > :is(.page-hero, .media-hero, .contact-barcelona-hero, .taric-hero),
body .blog-article-header {
  box-sizing: border-box;
  height: auto;
  min-height: var(--video-hero-height) !important;
  padding-block: 120px 56px;
  display: grid;
  align-content: end;
}
body main > :is(.page-hero, .contact-barcelona-hero, .taric-hero) > :is(.page-hero-content, .contact-barcelona-content, .taric-hero-content) {
  width: 100%; max-width: var(--content-width); margin-inline: auto;
}
body:not(.home-page) :is(.page-hero, .media-hero, .contact-barcelona-hero, .taric-hero) h1 {
  font-size: clamp(2.25rem, 5.5vw, 5.5rem);
  line-height: 1.02;
  overflow-wrap: anywhere;
  text-wrap: balance;
}
body .page-hero:not(.media-hero) h1 { font-size: clamp(2rem, 4.2vw, 4rem); }
body :is(.hand-feature-copy, .solution-visual-copy, .solution-main-copy, .eir-process-intro) h2 {
  font-size: clamp(2.1rem, 3.6vw, 4.1rem);
  line-height: 1.02;
  overflow-wrap: break-word;
}
body .hand-feature-copy h2 { max-width: 100%; }
body .consulting-taric-process .eir-process-intro { grid-template-columns: minmax(0, 1fr) minmax(0, 1.15fr); align-items: start; gap: 32px; }
body .consulting-taric-process .eir-process-intro h2 { grid-column: 1; grid-row: 1; }
body .consulting-taric-process .eir-process-intro p { grid-column: 2; grid-row: 1; }
/* Fotografías editoriales: una sola geometría proporcional, sin recortar el original. */
body :is(.consulting-aircraft-break, .about-truck-break, .defense-hammer-break) {
  position: relative; container-type: inline-size;
  width: 100%; height: auto; min-height: 0; max-height: none;
  margin-inline: auto; overflow: hidden; background: #f6f6f4;
}
body :is(.consulting-aircraft-break, .about-truck-break, .defense-hammer-break) img {
  display: block; position: static; width: 100%; height: auto; max-height: none;
  object-fit: contain; transform: none;
}
body :is(.consulting-aircraft-break, .about-truck-break, .defense-hammer-break)::before,
body :is(.consulting-aircraft-break, .about-truck-break, .defense-hammer-break)::after { display: none; }
body :is(.consulting-aircraft-break, .about-truck-break, .defense-hammer-break) blockquote {
  position: absolute; inset: 7% auto auto 6%; width: 58%; max-width: none;
  margin: 0; padding: 0; transform: none; color: var(--wine);
  font-size: clamp(1.75rem, 5cqi, 4.5rem); line-height: 1.02;
  text-wrap: balance; text-align: left; text-shadow: none;
}
/* Nosotros: recuperar la cita fotográfica de Lola, no el rótulo burdeos de la auditoría. */
@media (min-width: 761px) {
  body .about-truck-break blockquote {
    top: clamp(3rem, 6vw, 5.4rem);
    left: 50%;
    width: min(calc(100% - clamp(5.25rem, 13vw, 13.75rem)), 87.5rem);
    color: rgba(255, 255, 255, 0.78);
    font-family: var(--font-display);
    font-style: normal;
    font-weight: 850;
    font-size: clamp(2.75rem, 4.4vw, 5.5rem);
    line-height: 1.03;
    letter-spacing: 0;
    text-align: center;
    text-transform: none;
    text-wrap: balance;
    text-shadow: 0 3px 24px rgba(0, 0, 0, 0.42);
    transform: translateX(-50%);
  }
}
@media (min-width: 761px) {
  body.defense-page-redesign .defense-hammer-break blockquote {
    font-size: clamp(2.75rem, 4.8cqi, 5.5rem);
  }
}
/* Las figuras por capas escalan como una unidad; el texto no depende del viewport ancho. */
body .hand-feature-media:not(.taric-escena) {
  width: 100%; max-width: 680px; height: auto; aspect-ratio: 1 / 1;
  min-height: 0; container-type: inline-size;
}
body .hand-feature-media .hand-visual-word { font-size: clamp(2rem, 13cqi, 6.25rem); }
body #enfoque-visual .solution-profile-media { overflow: hidden; }
body .process-interactive-content :is(img, video) { object-fit: contain; }
body .process-faq summary {
  height: auto; min-height: 75px; white-space: normal;
  padding-block: 22px; line-height: 1.35; gap: 18px;
}
body .process-faq details > div { width: 100%; max-width: none; }
body .process-faq details p { line-height: 1.7; }
body :is(input, textarea, select) { max-width: 100%; }
body :is(button, a, summary):focus-visible { outline: 2px solid var(--wine); outline-offset: 4px; }
body :is(.legal-content, .policy-content, .blog-article-content) { overflow-wrap: anywhere; }
/* Las páginas de lectura tienen su propio contenedor; no heredan dos márgenes panorámicos. */
body .policy-section { width: min(100%, 1040px); max-width: 1040px; margin-inline: auto; padding-inline: var(--layout-gutter); }
body .policy-section article { width: 100%; min-width: 0; }
body .policy-section :is(h2, p) { width: 100%; max-width: 72ch; }
@media (max-width: 1023px) {
  body :is(.hand-feature-section, .hand-feature-section.is-reverse, .solution-visual-story) {
    grid-template-columns: minmax(0, 1fr); gap: 32px;
  }
  body .hand-feature-section.is-reverse :is(.hand-feature-copy, .hand-feature-media) { grid-column: auto; grid-row: auto; }
  body .consulting-taric-process .eir-process-intro { grid-template-columns: minmax(0, 1fr); gap: 20px; }
  body .consulting-taric-process .eir-process-intro :is(h2, p) { grid-column: auto; grid-row: auto; }
}
@media (max-width: 760px) {
  body:not(.home-page) main > :is(.page-hero, .media-hero, .contact-barcelona-hero, .taric-hero),
  body .blog-article-header { padding-block: 104px 44px; }
  body:not(.home-page) :is(.page-hero, .media-hero, .contact-barcelona-hero, .taric-hero) h1 { font-size: clamp(2.1rem, 9vw, 3.15rem); }
  body :is(.hand-feature-copy, .solution-visual-copy, .solution-main-copy, .eir-process-intro) h2 { font-size: clamp(2rem, 8.4vw, 2.85rem); }
  body :is(.consulting-aircraft-break, .about-truck-break, .defense-hammer-break) { display: flex; flex-direction: column; }
  body :is(.consulting-aircraft-break, .about-truck-break, .defense-hammer-break) blockquote,
  body.defense-page-redesign .defense-hammer-break blockquote {
    position: static; order: -1; width: 100%; max-width: none;
    padding: 32px var(--layout-gutter); font-size: clamp(1.75rem, 7vw, 2.75rem); line-height: 1.1;
  }
  body .hand-feature-media:not(.taric-escena) { max-width: 480px; }
  body :is(input, textarea, select) { font-size: max(1rem, 16px); }
}
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  body .site-header { transition: none; }
}

/* Ajuste panorámico aprobado por Lola: la cabecera se ancla al margen real y
   las FAQ conservan un fondo continuo con el contenido dentro del marco. */
@media (min-width: 1024px) {
  body .site-header {
    padding-left: max(var(--layout-gutter), env(safe-area-inset-left, 0px));
    padding-right: max(var(--layout-gutter), env(safe-area-inset-right, 0px));
  }
}

body main > section.process-faq {
  padding-left: max(var(--layout-gutter), calc((100% - 1440px) / 2));
  padding-right: max(var(--layout-gutter), calc((100% - 1440px) / 2));
}

/* Titulares limitados por su columna real, no por el ancho de la pantalla. */
body.home-page .home-values-intro,
body.home-page .home-values-list article,
body.home-page .site-donut-copy,
body.home-page .home-focus-copy,
body.contact-page .contact-copy-heading,
body.defense-page-redesign .hand-collection-copy {
  container-type: inline-size;
}
body.home-page .home-values-intro h2 { font-size: clamp(2rem, 13cqi, 3.5rem); }
body.home-page .site-donut-copy h2 { font-size: clamp(2rem, 10cqi, 4rem); }
body.home-page .home-focus-copy h2 { font-size: clamp(1.65rem, 10cqi, 3.5rem); }
body.home-page .home-values-list h3 { font-size: clamp(1.1rem, 9cqi, 1.45rem); }
body.home-page .home-values-list {
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 230px), 1fr));
}
body.home-page .home-values-list article,
body.home-page .home-values-list article:last-child { padding-inline: 16px; }
body.contact-page .contact-copy-heading h2 {
  font-size: clamp(2rem, 7cqi, 3.5rem);
  line-height: 1.05;
}
body.defense-page-redesign .hand-collection-four .hand-collection-copy h2,
body.defense-page-redesign .hand-collection-four .hand-collection-item:nth-child(4) .hand-collection-copy h2 {
  width: 100%; max-width: 100%; font-size: clamp(1.2rem, 7.1cqi, 1.75rem);
  line-height: 1.12;
}
body.eir-page .eir-workflow-header h2 { max-width: 100%; }
body.eir-page .eir-benefits {
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 240px), 1fr));
}
body.eir-page .eir-benefit-card h3 { font-size: clamp(1.25rem, 1.5vw, 1.65rem); }
body.consulting-page .consulting-authorization-title {
  font-size: clamp(2rem, 4.3vw, 4.1rem); max-width: 100%;
}
body .process-faq > h2 { max-width: 100%; font-size: clamp(2rem, 4.2vw, 4rem); }
/* La composición en dos columnas no deja espacio para palabras completas en móvil. */
@media (max-width: 760px) {
  body.eir-page #enfoque-visual.solution-visual-story,
  body.defense-page-redesign #enfoque-visual.solution-visual-story {
    grid-template-columns: minmax(0, 1fr); gap: 24px;
  }
  body.eir-page #enfoque-visual .solution-visual-copy,
  body.defense-page-redesign #enfoque-visual .solution-visual-copy {
    grid-column: 1; grid-row: auto; width: 100%; max-width: 100%;
  }
  body.eir-page #enfoque-visual .solution-visual-copy h2,
  body.defense-page-redesign #enfoque-visual .solution-visual-copy h2 {
    font-size: clamp(2rem, 7.5vw, 3rem); max-width: 100%;
  }
  body.eir-page #enfoque-visual .solution-visual-media,
  body.defense-page-redesign #enfoque-visual .solution-visual-media {
    grid-column: 1; grid-row: auto;
  }
  body.eir-page .eir-process-step { padding-inline: 16px; }
  body.contact-page .contact-copy-heading { grid-template-columns: minmax(0, 1fr); }
  body.contact-page .contact-copy-heading h2 { font-size: clamp(2rem, 9cqi, 3.5rem); }
}
@media (min-width: 601px) and (max-width: 1279px) {
  body.defense-page-redesign .hand-collection-four { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (min-width: 761px) and (max-width: 1023px) {
  body.defense-page-redesign .defense-decisions-live .defense-decisions-timeline {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}
body.eir-page .eir-workflow-header > div,
body.home-page .to-be-copy,
body.home-page .home-solution-row.is-featured { container-type: inline-size; }
body.eir-page .eir-workflow-header h2 { font-size: clamp(2rem, 11cqi, 3.5rem); }
body.home-page .to-be-copy h2 { font-size: clamp(2rem, 10cqi, 3.5rem); }
body.home-page .home-solution-row.is-featured h3 { font-size: clamp(2rem, 12cqi, 3.75rem); }
@media (max-width: 430px) {
  body.home-page .home-focus-section { grid-template-columns: minmax(0, 1fr); }
}
@media (max-width: 360px) {
  body.eir-page .eir-process-step { padding-inline: 8px; }
}
@media (max-width: 360px) {
  body.eir-page .eir-process-step:nth-child(n) { padding-inline: 8px; }
  body.eir-page .eir-workflow-header h2 { font-size: 1.8rem; }
}
@media (max-width: 760px) {
  body.eir-page #enfoque-visual .solution-visual-copy,
  body.defense-page-redesign #enfoque-visual .solution-visual-copy { display: block; }
  body.eir-page #enfoque-visual .solution-visual-keys,
  body.defense-page-redesign #enfoque-visual .solution-visual-keys {
    grid-column: 1; grid-row: auto; width: 100%;
  }
}
@media (max-width: 430px) {
  body.home-page .home-focus-copy { display: block; grid-column: 1; }
  body.home-page .home-focus-section .guiex-texture-mark { width: 86px; grid-column: 1; }
}
@media (max-width: 430px) {
  body.home-page .home-diamond-section .home-focus-copy { display: block; }
  body.home-page .home-diamond-section .home-focus-copy p { margin-top: 1rem; }
}
/* El bloque está alineado al inicio de una celda; dar ancho evita que la
   contención de tamaño reduzca a cero su medida intrínseca. */
body.home-page .to-be-copy { width: 100%; justify-self: stretch; }
/* Los títulos se ajustan a su columna, no al ancho de toda la ventana. */
body .hand-collection-two .hand-collection-copy,
body .knowledge-tree-panel,
body .legal-section > .legal-title { container-type: inline-size; }
body .hand-collection-two .hand-collection-copy h2 {
  max-width: 100%; font-size: clamp(1.75rem, 10cqi, 4.5rem);
}
body [data-tree-v2] .knowledge-tree-panel { width: 100%; }
body [data-tree-v2] .knowledge-tree-panel h3 { font-size: clamp(1.5rem, 9cqi, 2.1rem); }
body .legal-section .legal-title h2 { font-size: clamp(1.25rem, 10cqi, 2.1rem); }
body .site-header:is(.is-scrolled, .is-open, .is-solid, :focus-within) :is(button, a):focus-visible {
  outline-color: #fff;
}
@media (max-width: 600px) {
  body.consulting-page #enfoque-visual.has-profile-flow .solution-profile-media {
    float: none; width: min(80%, 300px); margin: 0 auto 24px;
  }
}

body .is-motion-paused,
body .is-motion-paused *,
body .is-motion-paused::before,
body .is-motion-paused::after,
body .is-motion-paused *::before,
body .is-motion-paused *::after { animation-play-state: paused !important; }
/* El pie usa el srcset de su imagen; la cabecera conserva sus variantes de color. */
body .site-footer .footer-brand img { content: normal; }

/* Encuadres completos y espacio real de las composiciones editoriales. */
body .home-company-hand.parallax-visual { height: auto; min-height: 0; aspect-ratio: 1051 / 900; align-self: start; }
body .home-company-hand .parallax-visual-stage { height: 100%; min-height: 0; }
body .home-company-principles { margin-top: 40px; }
body .about-walking-visual { height: auto; min-height: 0; align-self: start; }
body .about-walking-visual > img { display: block; width: 100%; height: auto; min-height: 0; max-height: none; aspect-ratio: auto; object-fit: contain; }
body #enfoque-visual .solution-profile-media img { -webkit-mask-image: linear-gradient(to bottom, #000 0%, #000 83%, transparent 100%); mask-image: linear-gradient(to bottom, #000 0%, #000 83%, transparent 100%); }
body .consulting-taric-process { padding-inline: var(--frame-left) var(--frame-right); }

body .about-walking-visual .about-key-data { position: static; inset: auto; width: 100%; max-width: none; margin: 24px 0 0; transform: none; }
/* Diseño de Lola: alternancia original sobre un eje compartido. */
body.taric-page .consulting-taric-process .eir-process-intro { align-items: center; }
body.taric-page .consulting-taric-process .eir-process-flow { display: grid; position: relative; grid-template-columns: repeat(4,minmax(0,1fr)); grid-template-rows: auto 42px auto; gap: 12px 24px; height: auto; min-height: 0; padding: 0; margin: 36px auto 0; background: none; border: 0; }
body.taric-page .consulting-taric-process .eir-process-flow::before,
body.taric-page .consulting-taric-process .eir-process-flow::after { content: none; }
body.taric-page .consulting-taric-process .eir-process-step:nth-child(n) { display: grid; grid-template-rows: subgrid; grid-row: 1 / 4; gap: 12px; justify-items: center; align-items: center; position: relative; inset: auto; min-height: 0; height: auto; margin: 0; padding: 0; transform: none; text-align: center; background: none; border: 0; }
body.taric-page .consulting-taric-process .eir-process-step:nth-child(n)::before { content: ""; position: absolute; grid-row: 2; top: 50%; left: -12px; right: -12px; height: 1px; background: #cfb7bc; }
body.taric-page .consulting-taric-process .eir-process-step:first-child::before { left: 50%; }
body.taric-page .consulting-taric-process .eir-process-step:last-child::before { right: 50%; }
body.taric-page .consulting-taric-process .eir-process-step::after { content: none; }
body.taric-page .consulting-taric-process .eir-process-step:nth-child(n) :is(.taric-step-icon,.taric-step-marker,.taric-step-copy) { position: relative; inset: auto; margin: 0; transform: none; grid-column: 1; }
body.taric-page .consulting-taric-process .eir-process-step:nth-child(n) .taric-step-icon { grid-row: 3; display: grid; place-items: center; width: 88px; height: 88px; padding: 13px; border: 1px solid #ccb2b8; border-radius: 50%; background: #faf7f4; align-self: start; }
body.taric-page .consulting-taric-process .taric-step-icon::before { content: ""; position: absolute; inset: 10px; border-radius: 50%; background: #eadfe0; }
body.taric-page .consulting-taric-process .taric-step-icon img { position: relative; width: 56px; height: 56px; object-fit: contain; }
body.taric-page .consulting-taric-process .eir-process-step:nth-child(n) .taric-step-marker { grid-row: 2; z-index: 1; display: grid; place-items: center; width: 30px; height: 30px; color: var(--wine); background: #fffdfb; border: 1px solid #ccb2b8; border-radius: 50%; font-size: 11px; font-weight: 800; }
body.taric-page .consulting-taric-process .eir-process-step:nth-child(n) .taric-step-copy { grid-row: 1; width: 100%; height: auto; align-self: start; text-align: center; padding: 0 8px; }
body.taric-page .consulting-taric-process .eir-process-step:nth-child(even) .taric-step-icon { grid-row: 1; align-self: end; }
body.taric-page .consulting-taric-process .eir-process-step:nth-child(even) .taric-step-copy { grid-row: 3; }
body.taric-page .consulting-taric-process .taric-step-copy h3 { font-size: clamp(17px,1.6vw,22px); line-height: 1.3; margin: 0 0 14px; }
body.taric-page .consulting-taric-process .taric-step-copy p { font-size: 15px; line-height: 1.65; margin: 0; }
@media(max-width: 760px) {
 body.taric-page .consulting-taric-process .eir-process-flow { display: block; }
 body.taric-page .consulting-taric-process .eir-process-step:nth-child(n) { grid-template-columns: 26px 70px minmax(0,1fr); grid-template-rows: auto; gap: 14px; padding: 0 0 30px; text-align: left; }
 body.taric-page .consulting-taric-process .eir-process-step:nth-child(n)::before { grid-row: 1; left: 13px; right: auto; top: 0; bottom: 0; width: 1px; height: auto; }
 body.taric-page .consulting-taric-process .eir-process-step:last-child::before { content: none; }
 body.taric-page .consulting-taric-process .eir-process-step:nth-child(n) .taric-step-marker { grid-column: 1; grid-row: 1; width: 26px; height: 26px; align-self: start; }
 body.taric-page .consulting-taric-process .eir-process-step:nth-child(n) .taric-step-icon { grid-column: 2; grid-row: 1; width: 70px; height: 70px; padding: 8px; align-self: start; }
 body.taric-page .consulting-taric-process .taric-step-icon img { width: 48px; height: 48px; }
 body.taric-page .consulting-taric-process .eir-process-step:nth-child(n) .taric-step-copy { grid-column: 3; grid-row: 1; padding: 0; text-align: left; }
}

/* El conector comparte la fila del marcador, sin offsets heredados. */
@media(min-width: 761px) {
 body.taric-page .consulting-taric-process .eir-process-step:nth-child(n)::before { position: relative; grid-row: 2; grid-column: 1; inset: auto; transform: none; width: calc(100% + 24px); height: 1px; align-self: center; justify-self: center; }
 body.taric-page .consulting-taric-process .eir-process-step:first-child::before { width: calc(50% + 12px); justify-self: end; margin-right: -12px; }
 body.taric-page .consulting-taric-process .eir-process-step:last-child::before { width: calc(50% + 12px); justify-self: start; margin-left: -12px; }
}

/* Ajustes visuales finales solicitados por Lola para el escalado panorámico. */
@media (min-width: 981px) {
  body .about-text-only {
    grid-template-columns: minmax(0, 1.05fr) minmax(32rem, 0.95fr);
    align-items: center;
    gap: clamp(4rem, 6vw, 8rem);
  }

  body .about-walking-visual {
    position: relative;
    display: block;
    min-height: clamp(34rem, 36vw, 43rem);
    overflow: visible;
  }

  body .about-walking-visual > img {
    width: 100%;
    height: clamp(34rem, 36vw, 43rem);
    object-fit: cover;
    object-position: center;
  }

  body .about-walking-visual .about-key-data {
    position: absolute;
    right: clamp(-2.5rem, -2.25vw, -2rem);
    bottom: clamp(1.25rem, 2vw, 2.25rem);
    left: clamp(3rem, 4.5vw, 4rem);
    z-index: 2;
    display: grid;
    width: auto;
    grid-template-columns: minmax(0, 1fr);
    gap: 0;
    margin: 0;
    overflow: hidden;
    border: 1px solid rgba(112, 44, 54, 0.48);
    background: rgba(251, 250, 247, 0.97);
    box-shadow: 0 18px 42px rgba(35, 31, 32, 0.18);
    transform: none;
  }

  body .about-walking-visual .about-key-data article {
    display: grid;
    grid-template-columns: clamp(5.75rem, 6vw, 7rem) minmax(0, 1fr);
    align-items: stretch;
    gap: 0;
    padding: 0;
    background: transparent;
  }

  body .about-walking-visual .about-key-data strong,
  body .about-walking-visual .about-key-data span {
    display: flex;
    min-height: clamp(3.4rem, 4.4vw, 4.35rem);
    align-items: center;
    box-sizing: border-box;
  }

  body .about-walking-visual .about-key-data strong {
    padding: 0 clamp(0.85rem, 1.2vw, 1.25rem);
    border-right: 1px solid rgba(112, 44, 54, 0.22);
    background: rgba(251, 250, 247, 0.99);
    font-size: clamp(1.75rem, 2vw, 2.35rem);
  }

  body .about-walking-visual .about-key-data span {
    min-height: 0;
    padding: clamp(0.8rem, 1vw, 1rem) clamp(1.25rem, 2vw, 2.25rem);
    border: 0;
    background: transparent;
    font-size: clamp(0.76rem, 0.8vw, 0.92rem);
    line-height: 1.3;
    text-align: left;
  }

  body .about-walking-visual .about-key-data article:not(:first-child) {
    border-top: 1px solid rgba(112, 44, 54, 0.18);
  }
}

body.defense-page-redesign .defense-hammer-break {
  height: auto;
  min-height: 0;
  aspect-ratio: 16 / 9;
}

body.defense-page-redesign .defense-hammer-break img {
  width: 100%;
  height: 100%;
  object-fit: contain;
  object-position: center;
}

body main > section.process-faq {
  width: 100%;
  max-width: none;
  background:
    radial-gradient(ellipse at 54% 42%, rgba(112, 44, 54, 0.075), transparent 66%),
    linear-gradient(90deg, rgba(248, 245, 242, 0) 0%, #f8f5f2 8%, #f2eeeb 50%, #f8f5f2 92%, rgba(248, 245, 242, 0) 100%);
}

body main > section.process-faq .process-faq-answer {
  width: 100%;
  max-width: none;
  padding-right: clamp(9px, 1.2vw, 18px);
}

/* Ronda visual 22-09: pie alineado, foto de Consultoría más contenida y mapa externo. */
@media (min-width: 1024px) {
  body .footer-cta {
    padding-left: max(var(--page-gutter), env(safe-area-inset-left, 0px));
    padding-right: max(var(--page-gutter), env(safe-area-inset-right, 0px));
  }

  body .consulting-aircraft-break {
    height: max(35rem, 42vw);
    aspect-ratio: auto;
  }

  body .consulting-aircraft-break img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    /* Recortar solo cielo: conservar las alas y el tren de aterrizaje. */
    object-position: center bottom;
  }

  body .consulting-aircraft-break blockquote {
    inset: 24% auto auto 6%;
    width: min(76%, 68rem);
    padding: clamp(1.25rem, 2.2vw, 2.25rem) clamp(1.4rem, 2.6vw, 2.8rem);
    background: rgba(248, 246, 242, 0.78);
    color: var(--wine);
    font-size: clamp(3rem, 4.8cqi, 4.6rem);
    line-height: 0.96;
    box-shadow: 0 18px 50px rgba(35, 31, 32, 0.12);
    backdrop-filter: blur(8px);
  }

  body.consulting-page .consulting-aircraft-break blockquote {
    top: clamp(24px, 2vw, 48px);
  }
}

/* A3-05 · Mapa de Contacto. Antes de mostrarlo, un aviso sobrio en su sitio: fondo marfil liso, etiqueta, una frase,
   el botón y «Cómo llegar» en la misma línea, y una nota pequeña. 4:3 en escritorio y, en tableta y móvil, el alto de su
   texto (240 px como mínimo); si el texto pide más alto, el recuadro crece en vez de recortarlo o de ensancharse (de ahí
   el min-width: 0, que impide que la proporción lo saque de la pantalla). Mientras se ve el aviso, el panel termina con él; con el
   mapa cargado vuelve el recuadro alineado con el formulario (ronda 14-09-3). El panel pierde su degradado (regla de
   Milton del 11-11: tarjetas sin degradados) y la dirección va en su propio <address>, sin el mapa. [revisar Lola] */
body.contact-page .contact-panel {
  background: var(--paper);
}

body.contact-page .contact-panel-details {
  display: grid;
  gap: inherit;
  min-width: 0;
  font-style: normal;
}

body.contact-page .contact-panel .contact-map.google-map {
  position: relative;
  display: grid;
  place-items: stretch;
  min-height: 22rem;
  overflow: hidden;
  border: 1px solid rgba(112, 44, 54, 0.18);
  background: #e8e4df;
}

body.contact-page .contact-panel .contact-map.google-map:has(> [data-google-map-placeholder]) {
  height: auto;
  min-width: 0;
  min-height: 240px;
  aspect-ratio: auto;
  overflow: visible;
  background: #f3f1ed;
}

body.contact-page .google-map iframe {
  width: 100%;
  height: 100%;
  min-height: 22rem;
  border: 0;
}

body.contact-page .google-map-consent {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: flex-start;
  gap: 12px;
  padding: clamp(20px, 2.6vw, 32px);
  background: #f3f1ed;
}

body.contact-page .google-map-consent > p {
  margin: 0;
}

body.contact-page .google-map-consent-label {
  color: var(--gray);
  font-size: 0.75rem;
  font-weight: 700;
  letter-spacing: 0.12em;
  line-height: 1.4;
  text-transform: uppercase;
}

body.contact-page .google-map-consent-text {
  max-width: 36ch;
  color: var(--graphite);
  font-size: 1rem;
  line-height: 1.55;
}

body.contact-page .google-map-consent-actions {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 10px 20px;
  margin-top: 4px;
}

/* «Cómo llegar» con el tamaño del texto: no compite con el botón (antes heredaba los 22 px del teléfono). */
body.contact-page .google-map-consent .google-map-directions {
  color: var(--wine);
  font-size: 1rem;
  font-weight: 700;
  line-height: 1.4;
  text-decoration: underline;
  text-decoration-thickness: 1px;
  text-underline-offset: 0.2em;
}

body.contact-page .google-map-consent .google-map-directions:hover,
body.contact-page .google-map-consent .google-map-directions:focus-visible {
  color: var(--wine-dark);
  text-decoration-thickness: 2px;
}

body.contact-page .google-map-consent-note {
  max-width: 44ch;
  color: var(--gray);
  font-size: 0.8125rem;
  line-height: 1.5;
}

body.contact-page .google-map-consent .google-map-consent-note a {
  color: var(--wine);
  font-size: inherit;
  font-weight: 700;
  line-height: inherit;
  text-decoration: underline;
  text-underline-offset: 0.2em;
}

@media (min-width: 981px) {
  body.contact-page .contact-panel { grid-template-rows: auto minmax(0, 1fr); }
  body.contact-page .contact-panel:has(> .contact-map > [data-google-map-placeholder]) {
    height: auto;
    grid-template-rows: auto auto;
  }
  body.contact-page .contact-panel .contact-map.google-map:has(> [data-google-map-placeholder]) { min-height: auto; aspect-ratio: 4 / 3; }
}

@media (max-width: 760px) {
  body .consulting-aircraft-break {
    height: auto;
  }

  body .consulting-aircraft-break img {
    width: 100%;
    height: auto;
    object-fit: contain;
    object-position: center bottom;
  }

  body.consulting-page .consulting-aircraft-break blockquote {
    width: 100%;
    padding: 24px var(--layout-gutter);
    background: transparent;
    font-size: clamp(1.7rem, 8vw, 2.4rem);
    backdrop-filter: none;
  }
}

/* Home · revisión 2026-09-30: principios en una sola fila y firma móvil junto al título. */
@media (min-width: 901px) {
  body.home-page .home-values-intro h2 {
    font-size: clamp(2.85rem, 16cqi, 4.5rem);
    line-height: 0.94;
  }

  body.home-page .home-values-intro p {
    font-size: clamp(1.08rem, 1.45vw, 1.35rem);
  }

  body.home-page .home-values-list {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
}

@media (max-width: 430px) {
  body.home-page .home-focus-section {
    grid-template-columns: minmax(0, 1fr) 78px;
    column-gap: 14px;
    row-gap: 0;
    align-items: start;
  }

  body.home-page .home-focus-section .guiex-texture-mark {
    grid-column: 2;
    grid-row: 1;
    align-self: center;
    width: 78px;
    height: 78px;
    margin: 0;
  }

  body.home-page .home-diamond-section .home-focus-copy {
    display: contents;
  }

  body.home-page .home-diamond-section .home-focus-copy h2 {
    grid-column: 1;
    grid-row: 1;
    align-self: center;
    margin: 0;
  }

  body.home-page .home-diamond-section .home-focus-copy p,
  body.home-page .home-focus-contact {
    grid-column: 1 / -1;
  }

  body.home-page .home-diamond-section .home-focus-copy p {
    margin-top: 1.25rem;
  }
}

/* =====================================================================
   Auditoría 2026-10 · W5 (PRO-47): roturas de móvil en Nosotros, Legal y EIR.
   Solo piezas y tokens existentes; prototipo validado de S3 (frentes/S3/prototipos/s3-prototipo.css).
   ===================================================================== */

/* FMT-001 · Nosotros: se han borrado las dos copias antiguas de la cita (antes líneas 422-438 y 577-584), que anulaban
   la regla nueva de este fichero (burdeos, a la izquierda y, en móvil, en flujo sobre #f6f6f4), como ya hace Consultoría. [revisar Lola] */
/* FMT-001 · Legal ≤ 760 px: la regla antigua de styles-burdeos.css (body.defense-page-redesign .defense-hammer-break blockquote,
   blanco, centrada con translateX(-50 %)) y su padding: 0 !important dejaban la cita medio fuera de pantalla y en blanco sobre claro. */
@media (max-width: 760px) {
  /* La cita va en flujo sobre la fotografía: la sección suma ambas alturas. */
  body.defense-page-redesign .defense-hammer-break {
    aspect-ratio: auto;
    overflow: visible;
  }
  body.defense-page-redesign .defense-hammer-break img {
    height: auto;
    flex: none;
  }
  body.defense-page-redesign .defense-hammer-break blockquote {
    transform: none; left: auto; top: auto; color: var(--wine); text-shadow: none; text-align: left;
    padding: 32px var(--layout-gutter) !important;
  }
}

/* EIR: paneles de Lola controlados por JS para cerrar también con Escape,
   incluso si el cursor o el foco permanecen sobre la tarjeta. */
body.eir-page .hand-collection-four .hand-phase-description {
  right: 20px;
  bottom: 20px;
  left: 20px;
  padding: 18px;
  color: var(--graphite);
  background: var(--paper);
  border: 1px solid var(--line);
  border-top: 2px solid var(--wine);
  box-shadow: var(--shadow);
  font-size: clamp(0.94rem, 1.1vw, 1.05rem);
  line-height: 1.55;
  visibility: hidden;
  opacity: 0;
  pointer-events: none;
  transform: translateY(16px);
  transition: opacity 260ms ease, transform 260ms ease, visibility 0s linear 260ms;
}
body.eir-page .hand-collection-four .hand-collection-item.is-open .hand-phase-description {
  visibility: visible; opacity: 1; transform: translateY(0); pointer-events: auto; transition-delay: 0s;
}
body.eir-page .hand-collection-four .hand-collection-item:focus-visible { z-index: 2; outline: 3px solid var(--wine); outline-offset: -3px; }
@media (prefers-reduced-motion: reduce) {
  body.eir-page .hand-collection-four .hand-phase-description { transition: none; }
}

/* =====================================================================
   Auditoría 2026-10 · W5 (PRO-48/49/50, PRO-31): accesibilidad, contraste y lectura.
   Bloque del prototipo validado de S3 (frentes/S3/prototipos/s3-prototipo.css) sin FMT-005 (va en styles-consent.css, W2)
   y con FMT-013; solo piezas y tokens existentes, ningún color nuevo. Cambios visibles marcados [revisar Lola].
   ===================================================================== */

/* FMT-004 · «Saltar al contenido» (los dueños lo ponen como primer hijo de <body>): fuera de pantalla hasta recibir el foco. */
.skip-link {
  position: absolute; left: 16px; top: -64px; z-index: 10000; padding: 12px 18px;
  color: #fff; background: var(--wine); border-radius: var(--radius);
  font-weight: 800; letter-spacing: 0.04em; text-decoration: none; transition: top 160ms ease;
}
.skip-link:focus, .skip-link:focus-visible { top: 12px; outline: 3px solid #fff; outline-offset: 2px; box-shadow: 0 0 0 5px var(--wine); }
main:focus { outline: none; }

/* FMT-003 · glifos que se tocan: la «¿» de «¿Tienes una consulta?» (interlineado 0,88) y la «Ç» del h1 de la Home en catalán a 390 px. [revisar Lola] */
.defense-short-contact h2 { line-height: 1; }
@media (max-width: 760px) {
  body.home-page .home-hero-content h1 { line-height: 1.02; }
}

/* FMT-007 · cifras de altura uniforme (lining) en todo el texto en Raleway, como ya hacen EIR, Legal y TARIC. [revisar Lola] */
body { font-variant-numeric: lining-nums; }

/* FMT-008 · texto atenuado con opacity o alfa: valores que alcanzan 4,5:1 sin cambiar la jerarquía (cada línea cita lo que había). [revisar Lola] */
.home-solution-option .home-solution-number { color: var(--wine); }                 /* era burdeos al 66 %: 3,45 a 3,78:1 */
.hand-collection-copy > span { opacity: 0.72; }                                    /* era 0,56: 3,38 a 3,96:1 */
.hand-collection-copy p { opacity: 0.86; }                                         /* era 0,72: el énfasis burdeos sobre la tarjeta gris daba 3,73:1 */
.blog-results-count { color: var(--gray); }                                        /* era rgba(35, 31, 32, .62): 4,37:1 */
.eir-requirements span { color: rgba(255, 255, 255, 0.86); }                       /* era .77: 4,46:1 */
.solution-index-intro .solution-tile .eyebrow,
.solution-index-intro .solution-tile span { color: rgba(255, 255, 255, 0.78) !important; }  /* era .58: 3,70 y 4,46:1 en «03» y «04» */
.policy-page .page-hero .eyebrow { color: #f0d7dc; }                               /* el mismo de .media-hero .eyebrow; era burdeos sobre casi negro: 1,98:1 */

/* FMT-009 · pie legal: el punto separador no se anuncia (texto alternativo vacío) y en móvil desaparece, porque al plegarse
   dejaba puntos huérfanos al inicio de línea; los enlaces pasan a 24 px de alto (WCAG 2.5.8). */
.footer-legal li + li::before { content: "·" / ""; }
@media (max-width: 760px) {
  .footer-legal a, .footer-legal button { display: inline-flex; align-items: center; min-height: 24px; padding-block: 4px; }
  .footer-legal li + li::before { content: none; }
  .footer-legal { column-gap: 20px; row-gap: 4px; }
}

/* EXT-023 · pie: sus tres columnas (mínimos de 260, 180 y 180 px más separaciones de 6vw) no caben entre 761 y 768 px con
   barra de desplazamiento clásica; colapsa a una columna también ahí, igual que a ≤ 760 px. */
@media (min-width: 761px) and (max-width: 768px) {
  .site-footer { grid-template-columns: 1fr; }
  .footer-bottom { display: grid; }
}

/* FMT-010 · buscador del blog: anillo de foco opaco con el token --wine (era burdeos al 24 %, 1,5:1). */
.blog-search-field input:focus-visible { outline: 2px solid var(--wine); outline-offset: -2px; }

/* Revisión Lola 07/10: conservar las FAQ de Milton, usando todo el ancho disponible. */
body .process-faq-answer p { width: 100%; max-width: none; }

/* FMT-012 · rótulos de los planetas del sistema solar de la Home: la contrarrotación vuelve a cancelar el giro en las órbitas
   inversas («Consultoría» y «Procesos» quedaban boca abajo). */
body.home-page .solar-orbit.is-reverse .solar-planet span,
body.home-page .solar-orbit.is-reverse .solar-area span { animation-direction: reverse; }

/* FMT-013 · Aviso legal: la tabla de cinco columnas de tratamientos (657 px) sobresalía de su columna de texto (591 a 616 px)
   desde 1101 px; usa también en escritorio la presentación apilada con etiquetas que ya existe para móvil (decisión de Milton). [revisar Lola] */
@media (min-width: 1101px) {
  #privacidad-tratamientos table, #privacidad-tratamientos tbody, #privacidad-tratamientos tr, #privacidad-tratamientos td { display: block; width: 100%; }
  #privacidad-tratamientos thead { display: none; }
  #privacidad-tratamientos tr { padding: 4px 0 10px; border-top: 1px solid rgba(97, 97, 96, 0.16); }
  #privacidad-tratamientos tbody tr:nth-child(even) td { background: transparent; }
  #privacidad-tratamientos td { padding: 8px 14px; border-top: 0; }
  #privacidad-tratamientos td::before { content: attr(data-label); display: block; margin-bottom: 2px; color: var(--wine); font-size: 0.7rem; font-weight: 800; letter-spacing: 0.08em; text-transform: uppercase; }
  #privacidad-tratamientos td:first-child { padding-top: 12px; font-size: 1rem; }
}

/* FMT-014 · impresión: sin cabecera fija, cierre ni banner; el texto de las páginas largas deja de quedar tapado. */
@media print {
  .site-header, .footer-cta, .gx-consent-bar, .gx-consent-overlay, video, .menu-button, .skip-link { display: none !important; }
  body { background: #fff !important; color: #000 !important; }
  .page-hero, .media-hero { background: none !important; min-height: 0 !important; padding-block: 0 12pt !important; }
  .page-hero h1, .media-hero h1 { color: var(--wine) !important; }
  .legal-section table { break-inside: auto; }
  .legal-section tr { break-inside: avoid; }
  a[href^="http"]::after { content: " (" attr(href) ")"; font-size: 0.8em; word-break: break-all; }
}

/* FMT-016 · campos de formulario: el borde de 1 px pasa de 1,4:1 a más de 3:1 con el token --gray (WCAG 1.4.11). [revisar Lola] */
.field input, .field select, .field textarea, .defense-mini-form input, .defense-mini-form textarea { border-color: var(--gray); }

/* FMT-018 · el desplegable de Soluciones se descarta con Escape sin mover el foco (script.js añade .is-dismissed; WCAG 1.4.13). */
.nav-dropdown.is-dismissed .dropdown-menu { display: none !important; }

/* FMT-019 · cortes de línea: el navegador evita la última línea de una sola palabra (sin efecto donde no se soporta). [revisar Lola] */
main p, main li, main blockquote, main figcaption { text-wrap: pretty; }

/* FMT-021 · el teléfono no se parte entre líneas («+34 93 488 / 50 34» en legal.html a 390 y 430 px). */
a[href^="tel:"] { white-space: nowrap; }

/* FMT-023 · titular de la Home con el espaciado de texto de WCAG 1.4.12: «internacional» se parte en vez de salirse 29 px y recortarse. */
body.home-page .home-hero-content h1,
body.home-page .home-hero-content .hero-muted { overflow-wrap: anywhere; }

/* PRO-31 · Contacto en móvil: el panel «Contacto directo» (teléfono y correo) va antes del formulario (decisión de Milton). [revisar Lola] */
@media (max-width: 760px) {
  body.contact-page .contact-side { order: -1; }
}

/* FMT-025 · Legal >= 761 px: velo con el degradado que ya usa el sistema solar de la Home (styles-burdeos.css, .solar-area::before:
   rgba(35, 31, 32, .68) -> .08), girado para que lo oscuro quede detrás de la cita blanca, que está arriba (decisión de Milton). [revisar Lola] */
@media (min-width: 761px) {
  body.defense-page-redesign .defense-hammer-break::after {
    content: ""; display: block; position: absolute; inset: 0; z-index: 1; pointer-events: none;
    background: linear-gradient(180deg, rgba(35, 31, 32, 0.68), rgba(35, 31, 32, 0.08));
  }
  body.defense-page-redesign .defense-hammer-break blockquote { z-index: 2; }
}

/* FMT-025 · Home en inglés: «FORWARD.» pisaba la mano alzada del atleta a 1280 y 1440 px; con el mismo cuerpo de letra, la cita se
   estrecha y pasa a tres líneas (medido con W5/herramientas/forward-medir.mjs a 1280, 1440 y 1920 px). [revisar Lola] */
@media (min-width: 761px) {
  html[lang="en"] body.home-page .corridor-break blockquote { max-width: min(40vw, 560px); }
}

/* Pre-vuelo de producción (web-layout.browser.cjs, «badTitles»): tres titulares cuya palabra más larga era más ancha que su
   caja: ES «Cómo trabajamos.» a >= 1280 px (caja 285-357 px, texto 317-396), ES y CA «Experiencia, criterio y asesoramiento»
   de 981 a 1100 px (caja 287-390, texto 350-400) y EN «More connection, more control, better processes.» a >= 1024 px
   (max-width: 11ch; caja 351-519, texto 361-534). La caja crece hasta la palabra más larga (min-content): el texto se pinta
   en el mismo sitio y con el mismo cuerpo, y donde ya cabía no cambia nada. [revisar Lola] */
body.home-page .home-values-intro h2,
body .about-text-only .section-copy h2,
body.home-page .to-be-copy h2 { min-width: min-content; }

/* Revisión visual de Lola sobre la candidata de Milton, sin integrar ni publicar. */
@media (min-width: 1600px) {
  body.home-page .home-hero { align-items: center; }
  body.home-page .home-hero-content { padding-block: 120px 80px; }
}

@media (min-width: 821px) {
  body main > #objetivos { padding-inline: var(--layout-gutter); }
  body #objetivos .objectives-outline-list {
    width: 100%; max-width: none; margin-inline: 0;
  }
  body #objetivos .objective-outline-item { padding-inline: 0; }
}

body #equipo-unido.assembly-section {
  width: min(100%, calc(1440px + 2 * var(--layout-gutter)));
  margin-inline: auto;
  padding-inline: var(--layout-gutter);
  background: none;
}
body #equipo-unido .assembly-image { width: 100%; max-width: none; }

body.process-page #enfoque-visual .solution-visual-copy h2 {
  width: 100%; max-width: none;
  font-size: clamp(2rem, 2.8vw, 3rem);
  line-height: 1.12;
  text-wrap: balance;
}
@media (max-width: 760px) {
  body.process-page #enfoque-visual .solution-visual-copy h2 {
    font-size: clamp(1.6rem, 6.8vw, 2rem);
  }
}
/* Pre-vuelo con navegador en Torre A (web-layout.browser.cjs, «badTitles», 12-11-2026): a 320 px el título EN «When
   customs becomes a bottleneck.» desbordaba 7 px (columna de 168 px, «BOTTLENECK.» de 175 px a 25,6 px). La regla de
   <= 760 px de aquí arriba (28a3520) tapaba la de <= 340 px de styles-burdeos.css (e9b3944), que baja la letra con el
   ancho: se vuelve a aplicar después. Solo cambia entre 320 y 340 px (de 24 a 25,5 px en vez de 25,6), en los tres
   idiomas. [revisar Lola] */
@media (max-width: 340px) {
  body.process-page #enfoque-visual .solution-visual-copy h2 {
    font-size: clamp(1.45rem, 7.5vw, 1.7rem);
  }
}

body .solution-short-contact > div > p,
body .solution-short-contact .defense-mini-form .form-note {
  width: 100%; max-width: none;
}
body .solution-short-contact .defense-mini-form label > span {
  color: var(--gray);
  font-weight: 400;
}

/* EIR: comparativa neutra, números delineados y sin iconos. */
body.eir-page #eir-comparativa.eir-comparison {
  padding: clamp(44px, 5vw, 72px) var(--page-gutter);
  background: var(--soft);
}

body.eir-page #eir-comparativa::before {
  display: none;
}

body.eir-page .eir-comparison .eir-value-heading,
.eir-comparison-grid,
.eir-comparison-footer {
  width: min(100%, 1440px);
  margin-inline: auto;
}

body.eir-page .eir-comparison .eir-value-heading {
  display: block;
  margin-bottom: clamp(28px, 3vw, 42px);
}

body.eir-page .eir-comparison .eir-value-heading h2 {
  max-width: none;
  margin: 0 0 18px;
  font-size: clamp(2.1rem, 4.5vw, 4.5rem);
  line-height: 1.05;
  text-transform: uppercase;
  text-wrap: balance;
}

body.eir-page .eir-comparison .eir-value-heading p {
  max-width: none;
  font-size: clamp(1rem, 1.3vw, 1.2rem);
  color: var(--gray);
}

.eir-comparison-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: clamp(20px, 3vw, 44px);
}

.eir-comparison-column {
  min-width: 0;
  padding: clamp(20px, 2vw, 28px);
  border-top: 2px solid var(--gray);
}

.eir-comparison-column--benefits {
  border-top-color: var(--wine);
  background: var(--mist);
}

.eir-comparison-column > h3 {
  margin: 0 0 16px;
  color: var(--wine);
  font-size: clamp(1.4rem, 2vw, 1.85rem);
  font-weight: 800;
  line-height: 1.2;
  text-transform: uppercase;
}

.eir-comparison-column--requirements > h3 {
  color: var(--graphite);
}

.eir-comparison-items {
  list-style: none;
  margin: 0;
  padding: 0;
}

.eir-comparison-items > li {
  display: grid;
  grid-template-columns: clamp(64px, 7vw, 94px) minmax(0, 1fr);
  align-items: start;
  gap: clamp(16px, 2vw, 28px);
  min-height: 136px;
  padding: 20px 0;
  border-bottom: 1px solid var(--line);
}

.eir-comparison-items > li:last-child {
  border-bottom: 0;
}

.eir-comparison-number {
  color: transparent;
  -webkit-text-stroke: 1px var(--wine);
  font-size: clamp(3rem, 4.8vw, 4.2rem);
  font-weight: 800;
  line-height: 1;
  font-variant-numeric: lining-nums tabular-nums;
  letter-spacing: -0.05em;
}

.eir-comparison-items strong {
  color: var(--wine);
  font-size: clamp(1.05rem, 1.4vw, 1.25rem);
  font-weight: 800;
  line-height: 1.35;
}

.eir-comparison-items > li > div > strong {
  display: block;
}

.eir-comparison-items p,
.eir-comparison-items p strong {
  margin: 6px 0 0;
  font-size: clamp(0.95rem, 1.15vw, 1.05rem);
  line-height: 1.6;
  color: var(--gray);
}

.eir-comparison-items p strong {
  font-weight: 700;
}

.eir-comparison-column--requirements .eir-comparison-number {
  -webkit-text-stroke-color: var(--gray);
}

.eir-comparison-column--requirements .eir-comparison-items > li > div > strong {
  color: var(--graphite);
}

.eir-comparison-column--benefits .eir-comparison-items > li {
  border-bottom-color: var(--steel);
}

.eir-comparison-footer {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 28px;
  margin-top: 24px;
  padding-top: 24px;
  border-top: 1px solid var(--line);
}

body.eir-page .eir-comparison .eir-scope-note {
  width: auto;
  max-width: 75ch;
  margin: 0;
  padding: 0;
  border: 0;
  color: var(--gray);
}

.eir-comparison-cta {
  display: inline-flex;
  flex-shrink: 0;
  align-items: center;
  justify-content: center;
  gap: 20px;
  min-height: 52px;
  padding: 14px 24px;
  border: 1px solid var(--wine);
  color: var(--wine);
  font-size: 0.88rem;
  font-weight: 800;
  text-decoration: none;
  text-transform: uppercase;
}

.eir-comparison-cta:hover,
.eir-comparison-cta:focus-visible {
  color: var(--paper);
  background: var(--wine);
}

@media (max-width: 1000px) {
  .eir-comparison-items > li {
    min-height: 154px;
  }

  .eir-comparison-footer {
    align-items: start;
    flex-direction: column;
    gap: 20px;
  }
}

@media (max-width: 760px) {
  .eir-comparison-grid {
    grid-template-columns: minmax(0, 1fr);
    gap: 32px;
  }

  .eir-comparison-column {
    padding: 20px 16px;
  }

  .eir-comparison-items > li {
    grid-template-columns: 48px minmax(0, 1fr);
    gap: 12px;
    min-height: 0;
    padding: 18px 0;
  }

  .eir-comparison-number {
    font-size: 2.75rem;
  }

  .eir-comparison-cta {
    width: 100%;
    gap: 14px;
    padding-inline: 16px;
  }
}

/* =====================================================================
   Auditoría 11-11-2026 · bloque 2 (botones y móvil). Cambios visibles marcados [revisar Lola].
   ===================================================================== */

/* A1-26 · en el menú vertical (hasta 1023 px) el puente invisible del desplegable de escritorio caía sobre la fila
   siguiente: en el iPad en vertical, tocar «TARIC» abría Soluciones y el toque acababa en «Legal». Aquí el submenú solo
   se abre con su botón. */
@media (max-width: 1023px) {
  body .site-header .nav-dropdown::after { content: none; }
  body .site-header .site-nav .nav-dropdown:not(.is-open) .dropdown-menu { display: none; }
}

/* A4-12 · el foco burdeos no se ve sobre la foto oscura del cierre (2,03:1): ahí el contorno es blanco.
   `.button` dentro de :is() sube la especificidad por encima de `.taric-page .button:focus-visible` (0,3,0). */
body .footer-cta :is(.button, button, a, summary):focus-visible { outline-color: #fff; }

/* A1-23 · los botones de los formularios salían con la letra del sistema (Arial, MS Shell Dlg) en lugar de Raleway. */
body :is(button, input, select, textarea) { font-family: inherit; }

/* A1-09 · zonas táctiles de 44 px como mínimo en móvil, tableta y cualquier pantalla táctil (WCAG 2.5.5 y la guía de
   Apple). En las listas apiladas el hueco entre enlaces pasa a formar parte de cada zona; en los enlaces sueltos la zona
   crece sin mover el texto. [revisar Lola: el pie y el panel de Contacto ganan algo de aire entre líneas] */
@media (max-width: 1023px), (pointer: coarse) {
  body .site-footer .footer-block { row-gap: 0; }
  body .site-footer .footer-block > a { display: flex; align-items: center; min-height: 44px; }
  body .site-footer .footer-legal :is(a, button) { display: inline-flex; align-items: center; justify-content: center; min-width: 44px; min-height: 44px; padding-block: 0; }
  body .site-footer .footer-legal { row-gap: 0; }
  body .site-footer .social-link { min-height: 44px; }
  body .contact-panel-contact-links { row-gap: 0; }
  body .contact-panel-contact-links a { display: flex; align-items: center; min-height: 44px; }
  body .site-nav :is(a, .nav-dropdown-trigger),
  body .blog-filters button,
  body .team-cv-cta button,
  body .home-focus-contact,
  body .objective-outline-item h3,
  body .team-actions .team-link { min-height: 44px; }
  /* Fichas del equipo: el hueco entre LinkedIn y el correo pasa a la zona de cada enlace (gana a `.team-card.is-open`). */
  body .team-actions,
  body .team-card.is-open .team-actions { row-gap: 0; }
  body .blog-filters button { min-width: 44px; }
  body :is(.site-header .brand, .google-map-directions, .blog-back-link, .blog-article-byline a) { position: relative; }
  body :is(.site-header .brand, .google-map-directions, .blog-back-link, .blog-article-byline a)::after,
  body.home-page .home-values-list h3::before {
    content: "";
    position: absolute;
    left: 0;
    right: 0;
    top: 50%;
    height: 44px;
    transform: translateY(-50%);
  }
  body.home-page .home-values-list h3 { position: relative; }
}
.skip-link { min-height: 44px; }

/* A1-24 · los diagramas enlazados del blog no enseñaban el foco: el enlace en línea medía cero alrededor de la imagen y
   el contorno no se veía. Como bloque en línea, el contorno rodea la imagen. */
body .blog-article-content a:has(> img:only-child) { display: inline-block; max-width: 100%; }

/* A1-24 · en las etiquetas burdeos de Nosotros («Autorizaciones OEA») el contorno de foco del término del glosario era
   burdeos sobre burdeos. Toma el color del texto de la etiqueta, que siempre contrasta con su fondo. */
body :is(.value-row, .story-points) .glossary-term:focus-visible { outline-color: currentColor; }

/* A-07 (FMT-006, W33) · el acordeón móvil de «Cómo trabajamos» (Inicio) y de los objetivos (Nosotros) pone un botón real
   dentro del h3 (script.js, solo a <= 600 px). El botón se pinta exactamente como el texto del encabezado, que sigue
   siendo un h3. El foco visible es el de body :is(button, a, summary):focus-visible. [revisar Lola] */
.compact-accordion-button {
  appearance: none; margin: 0; padding: 0; border: 0; border-radius: 0; background: none;
  font: inherit; color: inherit; letter-spacing: inherit; word-spacing: inherit; line-height: inherit;
  text-align: inherit; text-transform: inherit; text-indent: inherit; text-shadow: inherit; cursor: pointer;
}
/* El anillo de foco de los objetivos de Nosotros conserva su separación de 5 px (antes estaba en el h3, styles-burdeos.css). */
.objective-outline-item .compact-accordion-button:focus-visible { outline: 2px solid var(--wine); outline-offset: 5px; }

/* A-07 (W33) · las tarjetas del equipo pasan de <article> a <div> (role="listitem" no se admite en <article>). Conservan
   el min-width: 0 que les daba la regla de article de arriba; las fases de EIR y los paneles de Mejora ya lo tienen. */
body .team-card { min-width: 0; }
