/* Packs: submenú de la cabecera y páginas de cada pack */

/* Cabecera: «Packs» despliega los cinco packs */
.nav-packs { position:relative; display:inline-flex; }
.nav-packs .submenu { position:absolute; top:100%; left:50%; translate:-50% 0; display:grid; min-width:300px; padding:10px; margin-top:12px; border-radius:12px;
  background:rgba(5,6,6,.97); box-shadow:var(--canto), 0 30px 60px -20px rgba(0,0,0,.9); opacity:0; visibility:hidden; transform:translateY(-6px); transition:opacity .25s, transform .25s, visibility .25s; }
.nav-packs .submenu::before { content:""; position:absolute; left:0; right:0; top:-14px; height:14px; }
.nav-packs:hover .submenu, .nav-packs:focus-within .submenu { opacity:1; visibility:visible; transform:none; }
header nav .nav-packs .submenu a { display:flex; gap:12px; align-items:baseline; padding:10px 12px; border-radius:8px; font-size:11px !important; letter-spacing:.08em !important; text-transform:uppercase; white-space:nowrap; }
.nav-packs .submenu a:hover { background:rgba(255,255,255,.05); }
.nav-packs .submenu b { color:#a87a2a; font-weight:800; }
#menu .menu-sub { padding-left:1.4em !important; font-size:.85em !important; opacity:.75; }

/* Páginas de cada pack */
.p-pack main { padding-top:110px; }
.p-index main section.pack-cab { display:block; width:var(--ancho); margin:0 auto 2.4vh; padding:0; text-align:left; }
.pack-volver { font:600 12px var(--sans); letter-spacing:.14em; text-transform:uppercase; color:rgba(239,232,216,.7); text-decoration:none; }
.pack-volver::before { content:"← "; color:#a87a2a; }
.pack-volver:hover { color:#fff; }
.p-index main section.pack-otros { display:block; width:var(--ancho); margin:10vh auto 12vh; padding:0; text-align:left; }
.pack-otros h2 { font:800 clamp(20px,1.8vw,30px) var(--sans) !important; text-transform:uppercase; letter-spacing:-.02em !important; margin:0 0 3vh; }
.pack-otros .menu-paq { display:grid; grid-template-columns:repeat(5,minmax(0,1fr)); gap:12px; width:100%; }
.pack-otros .menu-paq a { position:relative; display:block; aspect-ratio:16/9; overflow:hidden; border-radius:var(--radio-s); box-shadow:var(--canto); color:#fff; text-decoration:none; }
.pack-otros .menu-paq img { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; filter:brightness(.5); transition:filter .4s; }
.pack-otros .menu-paq a:hover img, .pack-otros .menu-paq a[aria-current] img { filter:brightness(.85); }
.pack-otros .menu-paq a[aria-current] { box-shadow:inset 0 0 0 1px #a87a2a; }
.pack-otros .menu-paq i { position:absolute; z-index:1; top:4px; left:10px; font:800 clamp(44px,4.6vw,80px)/1 var(--sans); font-style:normal; letter-spacing:-.06em; }
.pack-otros .menu-paq a[aria-current] i { color:#a87a2a; }
.pack-otros .menu-paq span { position:absolute; z-index:1; left:12px; right:12px; bottom:10px; font:800 12px/1.2 var(--sans); text-transform:uppercase; }
@media (max-width:760px) { .pack-otros .menu-paq { grid-template-columns:1fr 1fr; } }

/* Quiénes somos · Sinopsis: foto, tres ideas clave en grande y el cuadro «Un filmmaker / Nosotros» */
.sin-b2b { display:grid; grid-template-columns:minmax(0,.8fr) minmax(0,1.6fr); gap:3vh 4vw; align-items:center; width:min(100%, 1400px); margin:0 auto; }
.sin-foto { margin:0; aspect-ratio:4/5; border-radius:16px; overflow:hidden; box-shadow:inset 0 1px 0 rgba(255,255,255,.07), inset 0 0 0 1px rgba(255,255,255,.05); }
.sin-foto img { width:100%; height:100%; object-fit:cover; }
.sin-hueco { display:grid; place-items:center; width:100%; height:100%; background:rgba(255,255,255,.03); font:600 12px var(--sans, Montserrat); letter-spacing:.1em; color:#e0b25a; text-align:center; padding:20px; }
.sin-ideas { display:grid; gap:4vh; }
.sin-ideas .pf-tit { margin:0 !important; font-size:clamp(20px,1.9vw,32px) !important; line-height:1.3 !important; }
.sin-b2b .pf-vs-caja { grid-column:1 / -1; margin-top:3vh; }
@media (max-width:760px) { .sin-b2b { grid-template-columns:1fr; } .sin-foto { max-width:320px; } }

/* Sinopsis en una pantalla 16:9: foto a la izquierda, ideas en el centro y cuadro a la derecha */
.sin-b2b { grid-template-columns:minmax(0,.62fr) minmax(0,1fr) minmax(0,1.05fr); gap:0 3vw; align-items:center; width:min(100%, 1600px); }
.sin-foto { aspect-ratio:3/4; max-height:calc(100vh - 330px); width:100%; }
.sin-ideas { gap:3.2vh; }
.sin-ideas .pf-tit { font-size:clamp(16px,1.35vw,24px) !important; line-height:1.3 !important; }
.sin-b2b .pf-vs-caja { grid-column:auto; margin:0; }
.sin-b2b .pf-vs { margin:0 !important; }
.sin-b2b .pf-vs-cab, .sin-b2b .pf-vs-fila { display:grid !important; grid-template-columns:minmax(0,.8fr) minmax(0,1.4fr); }
.sin-b2b .pf-vs-fila span, .sin-b2b .pf-vs-cab span { white-space:normal !important; font-size:clamp(12px,.9vw,15px) !important; line-height:1.45; padding:1.6vh 1vw !important; }
@media (max-width:1100px) { .sin-b2b { grid-template-columns:minmax(0,.7fr) minmax(0,1fr); } .sin-b2b .pf-vs-caja { grid-column:1 / -1; margin-top:3vh; } }
@media (max-width:760px) { .sin-b2b { grid-template-columns:1fr; } .sin-foto { max-height:none; max-width:320px; } }
.sin-b2b .pf-vs { display:block !important; width:100%; } .sin-b2b .pf-vs-cab span:first-child, .sin-b2b .pf-vs-fila span:first-child { color:rgba(255,255,255,.5); }
.sin-b2b { width:100% !important; max-width:none !important; }
.panel.pf-perfil { padding-left:clamp(20px,3.6vw,72px) !important; padding-right:clamp(20px,3.6vw,72px) !important; }

/* Caras «en blanco»: se conservan en el código, pero se ven como un hueco con una interrogación */
.caras-rejilla .cara.incognita { pointer-events:none; }
.caras-rejilla .cara.incognita .cara-img { position:relative; background:rgba(255,255,255,.04); }
.caras-rejilla .cara.incognita .cara-img img { visibility:hidden; }
.caras-rejilla .cara.incognita .cara-img::after { content:"?"; position:absolute; inset:0; display:grid; place-items:center; font:800 clamp(18px,1.8vw,30px) var(--sans, Montserrat); color:rgba(239,232,216,.35); }
.caras-rejilla .cara.incognita figcaption { visibility:hidden; }
/* Fichas guardadas que no caben en el tablero: no se muestran (siguen en el código para recuperarlas) */
.caras-rejilla .cara.sobra { display:none !important; }
/* Caras sin foto todavía: iniciales sobre gris */
.caras-rejilla .cara .ini { display:grid; place-items:center; width:100%; height:100%; aspect-ratio:1; background:rgba(255,255,255,.06); font:800 clamp(14px,1.3vw,22px) var(--sans, Montserrat); letter-spacing:.04em; color:rgba(239,232,216,.7); }


/* Texto de cada pack: frase de entrada en grande y remate con la segunda parte en verde (como el lema de la portada) */
.paquete .paq-texto > p.paq-lema { font:800 clamp(18px,1.4vw,24px)/1.2 var(--sans) !important; letter-spacing:-.02em; color:#fff; }
.paquete .paq-texto > p.paq-remate { font-style:italic; color:#fff; }
.paquete .paq-texto > p.paq-remate span { color:rgb(24,166,134); }
/* Precio en la página de cada pack, justo encima de «Solicitar propuesta» (mismo estilo que en la carta) */
.paquete .paq-texto > p.paq-precio { font:500 13px var(--sans) !important; letter-spacing:.14em; text-transform:uppercase; color:rgba(255,255,255,.55); }
.paquete .paq-texto > p.paq-precio b { font:800 clamp(22px,1.8vw,30px) var(--sans); letter-spacing:-.01em; text-transform:none; color:#fff; margin-left:.3em; }

/* Página de cada pack: la ficha nunca recorta el texto. Si el texto necesita más alto que la franja, la ficha crece */
.p-pack main section.paquete { height:auto !important; min-height:var(--alto-pack); }
.p-pack .paquete .paq-cuerpo { height:auto !important; min-height:var(--alto-pack); padding-top:16px !important; padding-bottom:16px !important; }
.p-pack .paquete .paq-texto { max-height:none !important; }
/* Por debajo de 1200 px la columna de texto se queda estrecha: etiqueta, texto y vídeo apilados, como en el móvil */
/* (los packs 2 y 4, con la etiqueta a la derecha, tienen reglas propias por id: :is(#…) las iguala) */
@media (min-width:761px) and (max-width:1199px) {
  .p-pack main section:is(.paquete, #networking-podcast-b2b, #ficcion-de-marca) { grid-template-columns:1fr !important; min-height:0; }
  .p-pack :is(.paquete, #networking-podcast-b2b, #ficcion-de-marca) .paq-cab { order:0 !important; clip-path:none !important; flex-direction:row !important; justify-content:flex-start !important; align-items:center !important; gap:18px; text-align:left !important; padding:20px 24px !important; }
  .p-pack .paquete .paq-cab h2 { margin:0 !important; text-align:left !important; font-size:24px !important; max-width:none; }
  .p-pack :is(.paquete, #networking-podcast-b2b, #ficcion-de-marca) .paq-cuerpo { display:flex !important; flex-direction:column !important; align-items:stretch !important; min-height:0; padding:28px 32px 32px !important; gap:24px; }
  .p-pack .paquete .paq-texto { flex:none !important; }
  .p-pack :is(.paquete, #networking-podcast-b2b, #ficcion-de-marca) .paq-cuerpo > :not(.ejemplos) { max-width:70ch; }
  .p-pack .paquete .ejemplos { width:100%; height:auto !important; }
  .p-pack .paquete .ejemplos .vid { width:100% !important; height:auto !important; }
  .p-pack .paquete .ejemplos .vid img { width:100% !important; height:auto !important; aspect-ratio:16/9; }
  .p-pack .paquete .ejemplos .vid.reproduciendo { aspect-ratio:16/9; }
}

/* Carta de la portada: la promesa del pack en blanco y negrita; debajo, su texto en gris */
body .vp-info .vp-promesa:not(.lorem) { margin:0 0 1.6vh; font:800 clamp(17px,1.35vw,22px)/1.25 var(--sans); letter-spacing:-.01em; color:#fff; }
body .vp-info .vp-texto { margin:0 0 3vh; max-width:42ch; font:400 clamp(14px,1vw,16px)/1.55 var(--sans); color:rgba(255,255,255,.72); }

/* Titulares de los packs: cada frase es un bloque; si no caben en una línea, el salto cae en el punto */
.vp-promesa span, .paquete .paq-texto > p.paq-lema span { display:inline-block; text-wrap:balance; }
/* Texto de los packs justificado, sin partir palabras */
body .vp-info .vp-texto, .paquete .paq-texto > p:not(.paq-lema):not(.paq-precio) { text-align:justify; hyphens:none; -webkit-hyphens:none; }

/* Carta de la portada (ordenador): la pantalla ocupa todo el alto de la ficha aunque el texto sea largo.
   El vídeo se ve entero (lleva los controles de Vimeo, que no se pueden recortar): si la ficha es más alta que el 16:9, quedan bandas negras arriba y abajo */
@media (min-width:761px) {
  .visor-paq { container-type:inline-size; }
  /* alto mínimo = 16:9 de su columna (1,7 de 2,7 partes del visor); si la ficha es más alta, la pantalla crece con ella */
  .vp-pantalla { align-self:stretch; aspect-ratio:auto; min-height:calc(100cqw * 1.7 / 2.7 * 9 / 16); container-type:size; }
  .vp-pantalla .vp-video { background-size:contain; }
}
/* Entre 761 y 1199 px la columna de texto es estrecha y el vídeo quedaría muy recortado: vídeo arriba (16:9 entero) y ficha debajo */
@media (min-width:761px) and (max-width:1199px) {
  .visor-paq { grid-template-columns:1fr !important; }
  .vp-pantalla { align-self:auto; aspect-ratio:16/9; min-height:0; border-radius:var(--radio) var(--radio) 0 0; }
  .vp-info { border-left:0 !important; border-top:1px solid rgba(255,255,255,.06); }
  body .vp-info .vp-texto, body .vp-promesa { max-width:70ch; }
  .visor-paq > .car-flecha { top:calc(100cqw * 9 / 32); }
}

/* Aval bajo el texto del pack (formación del equipo): más pequeño y discreto */
.paquete .paq-texto > p.paq-aval { font-size:clamp(12px,.85vw,14px) !important; font-style:italic; color:rgba(239,232,216,.55); }

/* Portada: cierre en una línea, después de la carta (WhatsApp y teléfono) */
.p-index main section.cierre-linea { display:block; width:var(--ancho); margin:9vh auto 11vh; padding:0; text-align:center; }
.cierre-linea p { display:flex; flex-wrap:wrap; justify-content:center; align-items:center; gap:14px 24px; margin:0; font:700 clamp(17px,1.35vw,22px) var(--sans); letter-spacing:-.01em; color:#fff; }
.cierre-linea p > span { font-weight:400; font-size:.8em; letter-spacing:0; color:rgba(239,232,216,.6); }
.cierre-linea p > span a { color:#efe8d8; text-decoration:none; border-bottom:1px solid rgba(168,122,42,.6); cursor:pointer; }
.cierre-linea p > span a:hover { color:#fff; border-color:#efe8d8; }
.cierre-linea .paq-quiero { cursor:pointer; font-size:12px; }

/* Bobina de la portada: miniatura mientras carga Vimeo; el vídeo aparece encima con un fundido */
.bobina { background:#000 center / cover no-repeat; }
.bobina iframe { opacity:0; transition:opacity .8s ease; }
.bobina iframe.listo { opacity:1; }

/* ===== Móvil: versión propia de la portada ===== */
@media (max-width:760px) {
  /* Objetivos: dos columnas compactas (antes, una columna que ocupaba casi dos pantallas) */
  .mf-lista { grid-template-columns:repeat(2,minmax(0,1fr)) !important; grid-template-rows:repeat(3,auto); grid-auto-flow:column !important; gap:22px 18px !important; }
  .mf-lista li, .mf-lista li:nth-child(-n+3) { text-align:left !important; padding:0 !important; font-size:12.5px !important; line-height:1.35 !important; }
  .mf-lista li b { font-size:14px !important; line-height:1.2 !important; margin-bottom:.25em; }
  .mf-ayuda-bloque { margin-bottom:5vh !important; }
  body .manifiesto .mf-ayuda { font-size:20px !important; margin-bottom:3vh !important; }

  /* Carta: fila de tarjetas que se desliza con el dedo, con el nombre de cada pack a la vista */
  .p-index .carta-int .menu-paq { display:flex !important; gap:10px; overflow-x:auto; scroll-snap-type:x mandatory; scrollbar-width:none;
    width:auto !important; margin:0 calc(-1 * var(--margen)) !important; padding:6px var(--margen) 12px !important; scroll-padding-inline:var(--margen); }
  .p-index .carta-int .menu-paq::-webkit-scrollbar { display:none; }
  .p-index .carta-int .menu-paq button { flex:0 0 46vw; scroll-snap-align:center; }
  .p-index .carta-int .menu-paq button:hover { transform:none; }
  .p-index .carta-int .menu-paq button span { display:block !important; left:10px; right:10px; bottom:8px; font-size:11px !important; }
  .p-index .carta-int .menu-paq button i { font-size:42px !important; }
}

/* Página de cada pack: más vídeos, aparte, debajo de la ficha (rejilla que crece según se añadan) */
.p-index main section.pack-mas { display:block; width:var(--ancho); margin:5vh auto 0; padding:0; text-align:left; }
.rejilla-vid { display:grid; grid-template-columns:repeat(auto-fill, minmax(min(100%, 420px), 1fr)); gap:clamp(14px,1.6vw,24px); }
.rejilla-vid figure { margin:0; }
.rejilla-vid .vid { aspect-ratio:16/9; overflow:hidden; border-radius:var(--radio-s); box-shadow:var(--canto), 0 20px 50px -25px rgba(0,0,0,.9); }
.rejilla-vid .vid img { width:100%; height:100%; object-fit:cover; }
.rejilla-vid .vid::after { top:50% !important; }
.rejilla-vid .vid.reproduciendo { cursor:default; background-size:cover; }
.rejilla-vid .vid.reproduciendo::after { content:none; }
.rejilla-vid .vid.reproduciendo iframe { display:block; width:100%; height:100%; border:0; opacity:0; transition:opacity .6s ease; }
.rejilla-vid .vid.reproduciendo iframe.listo { opacity:1; }
.rejilla-vid figcaption { padding:12px 2px 0; font:600 11px/1.5 var(--sans); letter-spacing:.14em; text-transform:uppercase; color:rgba(239,232,216,.6); }

/* Reproductor de la carta: con los controles de Vimeo (pausa, sonido, pantalla completa) */
.vp-video iframe { pointer-events:auto; }

/* Miniaturas más luminosas (antes al 45-50 % de brillo): el degradado de abajo basta para leer el nombre */
.menu-paq button img { filter:brightness(.82) saturate(.95) !important; }
.menu-paq button:hover img { filter:brightness(.95) saturate(1) !important; }
.menu-paq button[aria-pressed="true"] img { filter:none !important; }
.menu-paq button::after { background:linear-gradient(transparent 45%, rgba(0,0,0,.78)) !important; }
.pack-otros .menu-paq img { filter:brightness(.82) !important; }
.pack-otros .menu-paq a:hover img, .pack-otros .menu-paq a[aria-current] img { filter:none !important; }
.paquete .ejemplos .vid img, .rejilla-vid .vid img { filter:brightness(.95) !important; }
.paquete .ejemplos .vid:hover img, .rejilla-vid .vid:hover img { filter:none !important; }


/* Carta: crédito del vídeo (qué es y de quién), pequeño, abajo a la izquierda; aparece al elegir el pack y se desvanece */
.vp-credito { position:absolute; z-index:2; left:clamp(12px,1.4vw,20px); right:clamp(12px,1.4vw,20px); bottom:clamp(10px,1.2vw,16px); margin:0;
  font:500 clamp(10px,.75vw,12px)/1.4 var(--sans); letter-spacing:.02em; color:rgba(255,255,255,.88); text-shadow:0 1px 6px rgba(0,0,0,.85), 0 0 2px rgba(0,0,0,.6);
  opacity:0; pointer-events:none; }
.vp-credito.ve { animation:credito 7s ease forwards; }
@keyframes credito { 0% { opacity:0; } 8% { opacity:1; } 80% { opacity:1; } 100% { opacity:0; } }
@media (prefers-reduced-motion:reduce) { .vp-credito.ve { animation:none; opacity:1; } }
/* En ordenador, por encima de la barra de controles de Vimeo */
@media (min-width:761px) { .vp-credito { bottom:52px; } }

/* Carta: el vídeo empieza parado (miniatura + botón grande de play) y arranca con sonido al pulsar */
.vp-play { display:none; position:absolute; z-index:3; left:50%; top:50%; translate:-50% -50%; flex-direction:column; align-items:center; gap:12px;
  padding:0; border:0; background:none; color:#fff; cursor:pointer; font:600 12px var(--sans); letter-spacing:.16em; text-transform:uppercase; text-shadow:0 1px 8px rgba(0,0,0,.8); }
.vp-pantalla.parado .vp-play { display:flex; }
.vp-pantalla.parado { cursor:pointer; }
.vp-play i { display:block; width:clamp(64px,6vw,92px); aspect-ratio:1; border-radius:50%; background:rgba(0,0,0,.45) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M9 6.5v11l9-5.5z' fill='%23fff'/%3E%3C/svg%3E") 56% 50% / 46% no-repeat;
  box-shadow:inset 0 0 0 1.5px rgba(255,255,255,.75), 0 10px 40px -10px rgba(0,0,0,.8); backdrop-filter:blur(6px); transition:transform .35s var(--ease, ease), background-color .35s; }
.vp-play:hover i, .vp-pantalla.parado:hover .vp-play i { transform:scale(1.08); background-color:rgba(24,166,134,.55); }
.vp-play:focus-visible { outline:2px solid #a87a2a; outline-offset:6px; border-radius:12px; }
.vp-pantalla.parado .vp-video { filter:brightness(.85); }
/* Móvil: el vídeo es pequeño y el crédito chocaría con «Ver con sonido»: va arriba */
@media (max-width:760px) { .vp-credito { bottom:auto; top:10px; } }

/* Quiénes somos · Sinopsis: ya sin el cuadro (está en Manifiesto), foto e ideas en dos columnas */
.sin-b2b { grid-template-columns:minmax(0,.55fr) minmax(0,1.45fr) !important; gap:0 4vw !important; }
.sin-b2b .sin-ideas .pf-tit { font-size:clamp(18px,1.7vw,30px) !important; }
@media (max-width:760px) { .sin-b2b { grid-template-columns:1fr !important; gap:4vh 0 !important; } }

/* Quiénes somos · Manifiesto: el cuadro «Un filmmaker / Nosotros», solo y centrado */
.panel.pf-manifiesto { padding-left:clamp(20px,3.6vw,72px) !important; padding-right:clamp(20px,3.6vw,72px) !important; }
.sin-manifiesto { width:min(100%, 1100px); margin:0 auto; }
.sin-manifiesto .pf-vs-caja { margin:0; }
.sin-manifiesto .pf-vs { display:block !important; width:100%; margin:0 !important; }
.sin-manifiesto .pf-vs-cab, .sin-manifiesto .pf-vs-fila { display:grid !important; grid-template-columns:minmax(0,.8fr) minmax(0,1.6fr); }
.sin-manifiesto .pf-vs-fila span, .sin-manifiesto .pf-vs-cab span { white-space:normal !important; font-size:clamp(14px,1.15vw,19px) !important; line-height:1.5; padding:2.2vh 1.6vw !important; }
.sin-manifiesto .pf-vs-cab span:first-child, .sin-manifiesto .pf-vs-fila span:first-child { color:rgba(255,255,255,.5); }
@media (max-width:760px) { .sin-manifiesto .pf-vs-fila span, .sin-manifiesto .pf-vs-cab span { font-size:14px !important; padding:14px 10px !important; } }
/* (an.css, copiado de andresnavarra.com, apaga allí una pestaña antigua con el mismo id: aquí sí se ve) */
.pf-tabs #t-manifiesto { display:flex !important; }
/* Audiovisual B2B: sin la cita de Yoda (viene de andresnavarra.com) en ninguna página */
.visor .cita { display:none !important; }
/* Quiénes somos · Sinopsis: entradilla (quién es Andy y cómo trabaja) antes de las tres ideas */
.sin-ideas .sin-lead { margin:0; max-width:62ch; font:400 clamp(16px,1.25vw,21px)/1.55 var(--sans, Montserrat); letter-spacing:0; text-transform:none; color:rgba(239,232,216,.82); }
.sin-ideas .sin-lead b { font-weight:700; color:#fff; }
.sin-ideas .sin-lead::after { content:""; display:block; width:40px; height:1px; margin-top:2.6vh; background:#a87a2a; }

/* Quiénes somos · El equipo: menos mazacote — entradilla en tres líneas cortas y las ideas sin mayúsculas, con aire */
.sin-ideas { gap:2.6vh !important; }
.sin-ideas .sin-lead { display:grid; gap:.6vh; max-width:none; }
.sin-ideas .sin-lead p { margin:0; font:400 clamp(15px,1.1vw,18px)/1.5 var(--sans, Montserrat); color:rgba(239,232,216,.75); text-transform:none; letter-spacing:0; }
.sin-ideas .sin-lead .sin-nombre { font:800 clamp(24px,2.2vw,38px)/1.1 var(--sans, Montserrat); letter-spacing:-.02em; color:#fff; }
.sin-ideas .sin-lead .sin-titulo { font-size:clamp(11px,.8vw,13px); font-weight:600; letter-spacing:.12em; text-transform:uppercase; color:#c8963e; }
.sin-ideas .sin-lead::after { margin-top:1.8vh; }
.sin-b2b .sin-ideas .pf-tit { position:relative; max-width:40ch; padding-left:22px; text-transform:none !important; letter-spacing:-.005em !important;
  font:600 clamp(16px,1.3vw,22px)/1.4 var(--sans, Montserrat) !important; color:rgba(255,255,255,.92); }
.sin-b2b .sin-ideas .pf-tit::before { content:""; position:absolute; left:0; top:.62em; width:10px; height:1px; background:#a87a2a; }
.sin-ideas .sin-lead .sin-nombre { font:800 clamp(24px,2.2vw,38px)/1.1 var(--sans, Montserrat) !important; letter-spacing:-.02em !important; color:#fff !important; }

/* Botón «Ver con sonido» de la carta: una píldora como los demás botones de la web (borde ocre, texto hueso; al pasar, se rellena) */
.vp-pantalla.parado .vp-play { flex-direction:row; gap:.85em; padding:1em 1.8em; border:1px solid rgba(200,150,62,.85); border-radius:999px;
  background:rgba(8,8,8,.55); backdrop-filter:blur(8px); -webkit-backdrop-filter:blur(8px); color:#efe8d8; text-shadow:none;
  font:600 12px/1 var(--sans); letter-spacing:.18em; box-shadow:0 18px 40px -18px rgba(0,0,0,.9); transition:background .35s, color .35s, border-color .35s, transform .35s; }
.vp-play i { width:11px; height:13px; aspect-ratio:auto; border-radius:0; box-shadow:none; backdrop-filter:none; background:currentColor; transform:none !important;
  -webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 11 13'%3E%3Cpath d='M0 0v13l11-6.5z'/%3E%3C/svg%3E") center / contain no-repeat;
          mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 11 13'%3E%3Cpath d='M0 0v13l11-6.5z'/%3E%3C/svg%3E") center / contain no-repeat; }
.vp-pantalla.parado:hover .vp-play, .vp-play:focus-visible { background:#efe8d8; border-color:#efe8d8; color:#0a0a0a; transform:translate(-50%,-50%) scale(1.03); translate:none; }
.vp-pantalla.parado .vp-play { translate:none; transform:translate(-50%,-50%); }
.vp-pantalla.parado:hover .vp-play i, .vp-play:hover i { background:currentColor; }
@media (max-width:760px) { .vp-pantalla.parado .vp-play { padding:.85em 1.4em; font-size:11px; } }
.vp-play span { white-space:nowrap; }


/* ===== Quiénes somos · Historia: composición editorial =====
   La foto, alta, a la izquierda; a la derecha, un titular que habla del cliente, dos párrafos cortos con jerarquía,
   tres cifras que prueban lo dicho y una salida. Mucho aire y pocas palabras */
.historia { display:grid; grid-template-columns:minmax(0,.78fr) minmax(0,1.5fr); gap:0 clamp(32px,5vw,96px); align-items:center; width:100%; }
.hi-foto { position:relative; margin:0; aspect-ratio:4/5; max-height:calc(100vh - 300px); width:100%; justify-self:end; overflow:hidden;
  border-radius:var(--radio, 16px); box-shadow:var(--canto), 0 40px 80px -40px rgba(0,0,0,.95); }
.hi-foto img { width:100%; height:100%; object-fit:cover; object-position:40% 50%; filter:saturate(.88) contrast(1.03); }
.hi-foto::after { content:""; position:absolute; inset:0; background:linear-gradient(180deg, transparent 60%, rgba(0,0,0,.35)); pointer-events:none; }
.hi-cuerpo { display:flex; flex-direction:column; align-items:flex-start; max-width:760px; }
body .hi-titular { margin:0 0 3.4vh !important; font:800 clamp(30px,3.3vw,58px)/1.04 var(--sans, Montserrat) !important; letter-spacing:-.035em !important;
  text-transform:none !important; color:#fff !important; text-wrap:balance; }
body .hi-titular em { display:block; font-style:italic; font-weight:700; color:rgb(24,166,134); }
body .hi-entrada { margin:0 0 1.8vh !important; max-width:58ch; font:400 clamp(16px,1.2vw,20px)/1.6 var(--sans, Montserrat) !important; letter-spacing:0 !important; text-transform:none !important; color:rgba(239,232,216,.9) !important; }
body .hi-texto { margin:0 0 4.2vh !important; max-width:58ch; font:400 clamp(14px,1vw,16px)/1.65 var(--sans, Montserrat) !important; letter-spacing:0 !important; text-transform:none !important; color:rgba(239,232,216,.58) !important; }
/* Cifras: el número grande y fino, la explicación debajo; una línea ocre las separa del texto */
.hi-cifras { display:flex; flex-wrap:wrap; gap:2.4vh clamp(28px,4vw,72px); width:100%; padding-top:3.2vh; border-top:1px solid rgba(200,150,62,.45); margin-bottom:3.6vh; }
.hi-cifras a { display:flex; flex-direction:column; gap:.6vh; color:inherit; text-decoration:none; }
.hi-cifras b { font:300 clamp(34px,3.2vw,56px)/1 var(--sans, Montserrat); letter-spacing:-.04em; color:#efe8d8; transition:color .3s; }
.hi-cifras span { max-width:16ch; font:600 clamp(10px,.72vw,12px)/1.35 var(--sans, Montserrat); letter-spacing:.16em; text-transform:uppercase; color:rgba(239,232,216,.55); }
.hi-cifras a:hover b { color:#c8963e; }
/* Salida: enlace con flecha, como el resto de la web */
.hi-enlace { display:inline-flex; align-items:center; gap:.7em; font:600 12px var(--sans, Montserrat); letter-spacing:.16em; text-transform:uppercase; color:#efe8d8; text-decoration:none;
  padding-bottom:4px; border-bottom:1px solid rgba(200,150,62,.8); transition:color .3s, border-color .3s; }
.hi-enlace::after { content:"→"; color:#c8963e; transition:transform .3s; }
.hi-enlace:hover { color:#fff; border-color:#efe8d8; }
.hi-enlace:hover::after { transform:translateX(4px); }
@media (max-width:900px) {
  .historia { grid-template-columns:1fr; gap:28px 0; }
  .hi-foto { justify-self:stretch; max-height:none; aspect-ratio:4/3; }
  body .hi-titular { font-size:30px !important; }
  .hi-cifras { gap:18px 26px; }
  .hi-cifras b { font-size:34px; }
}
/* ajustes: que quepa en una pantalla (también a 1280×720), cifras finas y la salida en la misma línea que las cifras */
body .hi-titular { font-size:clamp(28px,2.6vw,46px) !important; margin-bottom:2.8vh !important; }
body .hi-texto { margin-bottom:3.2vh !important; }
.hi-cifras { align-items:flex-end; padding-top:2.6vh; margin-bottom:0; }
body .hi-cifras b { font-weight:300 !important; font-size:clamp(30px,2.8vw,50px) !important; }
.hi-cifras span { max-width:22ch; }
.hi-cifras .hi-enlace { margin-left:auto; }
.hi-foto { max-height:calc(100vh - 320px); }
@media (max-width:900px) { .hi-cifras .hi-enlace { margin-left:0; flex-basis:100%; } }
.hi-cifras { align-items:flex-start; }
.hi-cifras span { max-width:26ch; }
.hi-cifras a.hi-enlace { flex-direction:row; align-self:flex-end; gap:.7em; }
/* Historia, versión sobria: sin cifras; dos enlaces sencillos */
.hi-cifras.hi-sobrio { gap:2vh clamp(28px,3vw,56px); padding-top:3vh; }
.hi-cifras.hi-sobrio a.hi-enlace { margin-left:0; align-self:auto; }

/* ===== Historia (versión dos columnas): a la izquierda la foto pequeña y, debajo, quién soy y cómo trabajo;
   a la derecha, la frase sobre dirigir a empresarios como a actores, cuatro caras de Por qué nosotros y el enlace ===== */
.historia.hi-dos { grid-template-columns:minmax(0,.8fr) minmax(0,1.7fr); align-items:start; gap:0 clamp(36px,5vw,100px); }
.hi-izq { display:flex; flex-direction:column; align-items:flex-start; }
.hi-dos .hi-foto { width:clamp(150px, 15vw, 230px); height:auto; max-height:none; aspect-ratio:4/5; justify-self:start; margin:0 0 2.6vh; border-radius:var(--radio-s, 10px); }
.hi-dos body .hi-entrada, body .hi-dos .hi-entrada { font-size:clamp(14px,1vw,17px) !important; margin-bottom:1.4vh !important; max-width:46ch; }
body .hi-dos .hi-texto { font-size:clamp(13px,.9vw,15px) !important; margin-bottom:2.6vh !important; max-width:46ch; }
.hi-der { display:flex; flex-direction:column; align-items:flex-start; }
body .hi-dos .hi-titular { font-size:clamp(26px,2.5vw,44px) !important; margin:0 0 3.6vh !important; max-width:22ch; }
.hi-caras { display:grid; grid-template-columns:repeat(4, minmax(0, 1fr)); gap:clamp(10px,1.2vw,20px); width:100%; max-width:calc((100vh - 470px) * .8 * 4 + 60px); margin-bottom:3.6vh; }
.hi-caras figure { margin:0; }
.hi-caras img { display:block; width:100%; aspect-ratio:4/5; object-fit:cover; border-radius:var(--radio-s, 10px); box-shadow:var(--canto); filter:grayscale(.15); }
.hi-caras figcaption { padding-top:10px; display:grid; gap:3px; }
.hi-caras figcaption b { font:700 clamp(12px,.85vw,14px)/1.2 var(--sans, Montserrat); color:#fff; }
.hi-caras figcaption span { font:500 clamp(10px,.7vw,12px)/1.3 var(--sans, Montserrat); letter-spacing:.08em; text-transform:uppercase; color:rgba(239,232,216,.5); }
@media (max-width:900px) {
  .historia.hi-dos { grid-template-columns:1fr; gap:40px 0; }
  .hi-dos .hi-foto { width:150px; }
  .hi-caras { grid-template-columns:repeat(2, minmax(0,1fr)); max-width:none; }
}
/* (que quepa en pantallas bajas: la foto se ajusta también al alto, y la frase en tres líneas) */
.hi-dos .hi-foto { width:clamp(110px, min(13vw, 19vh), 210px); }
body .hi-dos .hi-titular { max-width:26ch; }
/* Historia: todo centrado (nada colgando a la izquierda), las dos mitades enfrentadas y centradas en alto */
.historia.hi-dos { align-items:center !important; }
.hi-izq, .hi-der { align-items:center !important; text-align:center !important; }
.hi-dos .hi-foto { justify-self:center; margin-left:auto !important; margin-right:auto !important; }
body .hi-dos .hi-entrada, body .hi-dos .hi-texto { text-align:center !important; margin-left:auto !important; margin-right:auto !important; }
body .hi-dos .hi-titular { text-align:center !important; margin-left:auto !important; margin-right:auto !important; text-wrap:balance; }
.hi-caras { margin-left:auto; margin-right:auto; }
.hi-caras figcaption { text-align:center; justify-items:center; }

/* ===== Quiénes somos · Método: quién dirige (de pasada), los cinco pasos a todo el ancho y la prueba. Todo centrado ===== */
.metodo { display:grid; gap:5vh; width:100%; text-align:center; }
.me-quien { display:flex; align-items:center; justify-content:center; gap:20px; margin:0 auto; max-width:900px; }
.me-quien img { flex:none; width:64px; height:64px; border-radius:50%; object-fit:cover; object-position:42% 45%; box-shadow:0 0 0 1px rgba(200,150,62,.6); }
body .me-quien p { margin:0 !important; text-align:left; font:400 clamp(14px,1vw,16px)/1.55 var(--sans, Montserrat) !important; letter-spacing:0 !important; text-transform:none !important; color:rgba(239,232,216,.72) !important; }
.me-quien b { color:#fff; font-weight:700; }
.me-quien a { color:inherit; text-decoration:none; border-bottom:1px solid rgba(200,150,62,.8); }
.me-quien a:hover { color:#c8963e; }
/* Los cinco pasos: una línea ocre que los une, como una escaleta de producción */
.me-pasos { list-style:none; margin:0; padding:0; display:grid; grid-template-columns:repeat(5, minmax(0,1fr)); position:relative; }
.me-pasos::before { content:""; position:absolute; left:10%; right:10%; top:9px; height:1px; background:linear-gradient(90deg, transparent, rgba(200,150,62,.7) 12%, rgba(200,150,62,.7) 88%, transparent); }
.me-pasos li { position:relative; display:grid; justify-items:center; gap:10px; padding:34px 12px 0; }
.me-pasos li::before { content:""; position:absolute; top:4px; left:50%; width:11px; height:11px; translate:-50% 0; border-radius:50%; background:#000; box-shadow:0 0 0 1px #c8963e, 0 0 0 5px #000; }
.me-pasos b { font:800 clamp(18px,1.7vw,30px)/1.05 var(--sans, Montserrat); letter-spacing:-.02em; text-transform:uppercase; color:rgb(24,166,134); }
.me-pasos span { max-width:22ch; font:400 clamp(13px,.95vw,16px)/1.45 var(--sans, Montserrat); color:rgba(239,232,216,.68); }
/* La prueba: la frase y, en la misma fila, las caras y el enlace */
.me-prueba { display:grid; justify-items:center; gap:2.6vh; padding-top:4vh; border-top:1px solid rgba(239,232,216,.1); }
body .me-frase { margin:0 !important; font:700 clamp(18px,1.6vw,28px)/1.25 var(--sans, Montserrat) !important; letter-spacing:-.015em !important; text-transform:none !important; color:#fff !important; text-wrap:balance; }
.me-caras { display:flex; align-items:center; justify-content:center; gap:14px; flex-wrap:wrap; }
.me-caras img { width:clamp(52px,4.6vw,76px); aspect-ratio:1; border-radius:50%; object-fit:cover; box-shadow:0 0 0 1px rgba(239,232,216,.25); filter:grayscale(.2); }
.me-caras .hi-enlace { margin-left:14px; }
@media (max-width:900px) {
  .me-quien { flex-direction:column; text-align:center; }
  body .me-quien p { text-align:center; }
  .me-pasos { grid-template-columns:1fr; gap:22px; }
  .me-pasos::before { left:50%; right:auto; top:10px; bottom:10px; width:1px; height:auto; background:rgba(200,150,62,.5); }
  .me-pasos li { padding:0; background:#000; }
  .me-pasos li::before { display:none; }
  .me-caras .hi-enlace { flex-basis:100%; margin:8px 0 0; justify-content:center; }
}

/* Método · la prueba: la cita de Miguel Ortega y tres directivos; la presentación de Andy, discreta, al final */
.me-cita { margin:0 auto; max-width:900px; }
body .me-cita p { margin:0 0 2.2vh !important; font:400 clamp(17px,1.45vw,25px)/1.45 var(--sans, Montserrat) !important; font-style:italic !important; letter-spacing:-.01em !important; text-transform:none !important; color:#fff !important; text-wrap:balance; }
.me-cita footer { display:flex; align-items:center; justify-content:center; gap:12px; }
.me-cita footer img, .me-directivos img, .me-ini { width:clamp(44px,3.6vw,58px); aspect-ratio:1; border-radius:50%; object-fit:cover; box-shadow:0 0 0 1px rgba(200,150,62,.6); }
.me-cita footer span, .me-directivos figcaption { display:grid; gap:2px; text-align:left; font:500 clamp(10px,.75vw,12px)/1.3 var(--sans, Montserrat); letter-spacing:.1em; text-transform:uppercase; color:rgba(239,232,216,.55); }
.me-cita footer b, .me-directivos figcaption b { font:700 clamp(13px,.95vw,15px)/1.2 var(--sans, Montserrat); letter-spacing:0; text-transform:none; color:#fff; }
.me-directivos { display:flex; align-items:center; justify-content:center; flex-wrap:wrap; gap:18px clamp(24px,3vw,54px); }
.me-directivos figure { display:flex; align-items:center; gap:12px; margin:0; }
.me-ini { display:grid; place-items:center; background:rgba(255,255,255,.06); font:800 14px var(--sans, Montserrat); letter-spacing:.04em; color:rgba(239,232,216,.75); }
.metodo > .me-quien { opacity:.85; }
body .metodo > .me-quien p { font-size:clamp(12px,.85vw,14px) !important; }
.metodo > .me-quien img { width:44px; height:44px; }

/* Método · bajo el timeline: a la izquierda la autoridad (directivos y empresas), a la derecha el bloque de Miguel Ortega (vídeo, cita y cargo) */
.me-prueba { grid-template-columns:minmax(0,1.25fr) minmax(0,1fr); align-items:center; gap:0 clamp(32px,4vw,80px); justify-items:stretch !important; }
.me-autoridad { display:grid; justify-items:center; gap:3.2vh; text-align:center; }
.me-empresas { display:grid; gap:1.6vh; max-width:62ch; }
body .me-empresas p { margin:0 !important; font:500 clamp(11px,.82vw,13px)/1.9 var(--sans, Montserrat) !important; letter-spacing:.1em !important; text-transform:uppercase !important; color:rgba(239,232,216,.62) !important; text-align:center; }
.me-empresas b { display:block; margin-bottom:.3em; font-weight:700; letter-spacing:.2em; color:#c8963e; }
.me-cita { margin:0; max-width:none; padding:clamp(16px,1.6vw,26px); border-radius:var(--radio, 16px); background:rgba(255,255,255,.025); box-shadow:var(--canto); text-align:center; }
.me-video { position:relative; aspect-ratio:16/9; border-radius:var(--radio-s, 10px); overflow:hidden; margin-bottom:2.2vh; cursor:pointer; }
.me-video .ph { position:absolute; inset:0; background-size:cover; background-position:center; transition:transform .6s; }
.me-video:hover .ph { transform:scale(1.04); }
.me-video .playbtn { position:absolute; left:50%; top:50%; translate:-50% -50%; display:grid; place-items:center; width:58px; height:58px; border-radius:50%;
  background:rgba(8,8,8,.55); backdrop-filter:blur(6px); box-shadow:inset 0 0 0 1px rgba(200,150,62,.85); color:#efe8d8; font-size:16px; padding-left:3px; }
body .me-cita p { font-size:clamp(14px,1.05vw,18px) !important; margin-bottom:1.6vh !important; }
.me-cita footer span { text-align:center; }
@media (max-width:900px) { .me-prueba { grid-template-columns:1fr; gap:36px 0; } }
/* (más bajo: en el bloque de Miguel Ortega, el vídeo a la izquierda y la cita y el cargo a la derecha) */
.me-prueba { grid-template-columns:minmax(0,1fr) minmax(0,1.25fr); padding-top:3.6vh; }
.me-cita { display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr); grid-template-rows:1fr auto; column-gap:clamp(16px,1.6vw,28px); align-items:center; }
.me-cita .me-video { grid-row:1 / span 2; margin:0; }
body .me-cita p { align-self:end; margin-bottom:1.4vh !important; font-size:clamp(13px,.95vw,16px) !important; text-wrap:pretty; }
.me-cita footer { align-self:start; }
.me-autoridad { gap:2.6vh; }
@media (max-width:900px) { .me-cita { grid-template-columns:1fr; } .me-cita .me-video { grid-row:auto; margin-bottom:16px; } }
/* (los tres directivos en una sola fila: foto encima, nombre y cargo debajo) */
.me-autoridad .me-directivos { flex-wrap:nowrap; gap:clamp(18px,2.4vw,40px); }
.me-autoridad .me-directivos figure { flex-direction:column; gap:8px; }
.me-autoridad .me-directivos figcaption { text-align:center; justify-items:center; }
.metodo { gap:4vh; }
/* Método: la presentación arriba, normal; la frase de los empresarios en la columna izquierda; en el bloque de Miguel, el vídeo (más pequeño) y la cita debajo */
.metodo > .me-quien { opacity:1; }
.me-autoridad { grid-row:1; }
.me-autoridad .me-frase { order:-1; max-width:24ch; font-size:clamp(20px,1.9vw,32px) !important; }
.me-cita { display:grid; grid-template-columns:1fr; justify-items:center; max-width:460px; margin:0 auto; }
.me-cita .me-video { grid-row:auto; width:min(100%, 360px); margin:0 0 2vh; }
body .me-cita p { align-self:auto; }
.me-cita .me-video { width:min(100%, 300px); margin-bottom:1.4vh; }
.me-autoridad .me-frase { max-width:30ch; font-size:clamp(18px,1.6vw,26px) !important; }
.me-prueba { padding-top:3vh; }
.metodo { gap:3.4vh; }

/* ===== Método, composición en cuadrantes: arriba a la izquierda quién soy (foto más grande); arriba a la derecha las referencias
   (la frase, Miguel Ortega con vídeo y cita, y los directivos); el timeline, a todo el ancho en el tercio inferior ===== */
.metodo { grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr); grid-template-areas:"quien ref" "pasos pasos"; align-items:center; column-gap:clamp(32px,4vw,80px); row-gap:6vh; }
.metodo > .me-quien { grid-area:quien; flex-direction:column; gap:2.2vh; max-width:420px; margin:0 auto; text-align:center; }
.metodo > .me-quien img { width:clamp(110px,10vw,160px); height:auto; aspect-ratio:1; }
body .metodo > .me-quien p { text-align:center !important; font-size:clamp(14px,1.05vw,17px) !important; }
.metodo > .me-pasos { grid-area:pasos; padding-top:4.4vh; border-top:1px solid rgba(239,232,216,.1); }
.metodo > .me-pasos::before { top:calc(4.4vh + 9px); }
.metodo > .me-pasos li::before { top:calc(4.4vh + 4px); }
.metodo > .me-pasos li { padding-top:calc(4.4vh + 34px); margin-top:-4.4vh; }
.metodo > .me-prueba { grid-area:ref; display:grid; grid-template-columns:1fr; justify-items:center; gap:2.6vh; padding:0; border:0; text-align:center; }
.me-prueba .me-autoridad { display:contents; }
.me-prueba .me-frase { order:-2; max-width:30ch; }
.me-prueba .me-cita { order:-1; display:grid; grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr); grid-template-rows:1fr auto; column-gap:18px; max-width:620px; width:100%; text-align:left; align-items:center; }
.me-prueba .me-cita .me-video { grid-row:1 / span 2; width:100%; margin:0; }
.me-prueba .me-cita p { text-align:left !important; align-self:end; margin-bottom:1vh !important; }
.me-prueba .me-cita footer { justify-content:flex-start; align-self:start; }
.me-prueba .me-cita footer span { text-align:left; }
.me-prueba .me-directivos { order:0; }
.me-prueba > .hi-enlace, .me-prueba .hi-enlace { order:1; }
@media (max-width:900px) {
  .metodo { grid-template-columns:1fr; grid-template-areas:"quien" "ref" "pasos"; }
  .me-prueba .me-cita { grid-template-columns:1fr; text-align:center; }
  .me-prueba .me-cita .me-video { grid-row:auto; margin-bottom:14px; }
  .me-prueba .me-cita p, .me-prueba .me-cita footer span { text-align:center !important; }
  .me-prueba .me-cita footer { justify-content:center; }
  .metodo > .me-pasos li { margin-top:0; padding-top:0; }
}
.metodo { row-gap:4vh; }
.me-prueba { gap:2vh !important; }
.me-prueba .me-frase { max-width:40ch; font-size:clamp(17px,1.4vw,24px) !important; }
.me-prueba .me-cita { max-width:580px; padding:14px; }
.me-prueba .me-cita .me-video { max-width:240px; }
.me-prueba .me-directivos { order:0; display:flex; align-items:center; }
.me-prueba .me-directivos img, .me-prueba .me-ini { width:40px; }
.me-prueba > .hi-enlace, .me-prueba .hi-enlace { justify-self:center; width:auto; }
.metodo > .me-pasos { padding-top:3.2vh; }
.metodo > .me-pasos::before { top:calc(3.2vh + 9px); }
.metodo > .me-pasos li::before { top:calc(3.2vh + 4px); }
.metodo > .me-pasos li { padding-top:calc(3.2vh + 30px); margin-top:-3.2vh; }
.metodo { row-gap:3vh; }
.metodo > .me-quien { gap:1.6vh; }
.metodo > .me-quien img { width:clamp(90px,8vw,130px); }
.me-prueba { gap:1.6vh !important; }
.metodo > .me-pasos li { gap:6px; }

/* ===== Método, versión final: el timeline arriba y protagonista; debajo, un bloque pequeño sobre Andy (con teléfono, LinkedIn y correo)
   y, a su lado, la prueba social con el vídeo de Miguel Ortega grande ===== */
.metodo { grid-template-columns:minmax(0,.7fr) minmax(0,1.3fr); grid-template-areas:"pasos pasos" "quien ref"; row-gap:5vh; }
.metodo > .me-pasos { padding-top:0; border-top:0; padding-bottom:5vh; border-bottom:1px solid rgba(239,232,216,.1); }
.metodo > .me-pasos::before { top:9px; }
.metodo > .me-pasos li::before { top:4px; }
.metodo > .me-pasos li { padding-top:34px; margin-top:0; gap:10px; }
.metodo > .me-pasos b { font-size:clamp(22px,2.2vw,38px); }
.metodo > .me-pasos span { font-size:clamp(14px,1.05vw,17px); }
.metodo > .me-quien img { width:clamp(90px,7.5vw,120px); }
body .metodo > .me-quien p { font-size:clamp(13px,.95vw,15px) !important; }
.me-redes { display:flex; justify-content:center; gap:12px; }
.me-redes a { display:grid; place-items:center; width:38px; height:38px; border-radius:50%; box-shadow:inset 0 0 0 1px rgba(200,150,62,.65); color:#efe8d8; transition:background .3s, color .3s; }
.me-redes svg { width:17px; height:17px; fill:none; stroke:currentColor; stroke-width:1.5; stroke-linecap:round; stroke-linejoin:round; }
.me-redes a:hover { background:#efe8d8; color:#0a0a0a; }
.me-prueba .me-cita { max-width:820px; grid-template-columns:minmax(0,1.3fr) minmax(0,1fr); }
.me-prueba .me-cita .me-video { max-width:none; }
@media (max-width:900px) { .metodo { grid-template-areas:"pasos" "quien" "ref"; } .me-prueba .me-cita { grid-template-columns:1fr; } }
.me-prueba .me-cita { grid-template-columns:minmax(0,1.1fr) minmax(0,1fr); max-width:760px; }
.me-prueba .me-directivos { flex-wrap:wrap; gap:14px 26px; }
.me-prueba .me-directivos figure { flex-direction:row !important; gap:10px; }
.me-prueba .me-directivos figcaption { text-align:left !important; justify-items:start !important; }
.me-prueba { grid-template-columns:1fr; }
.metodo { row-gap:4vh; }
.metodo > .me-pasos { padding-bottom:4vh; }

/* ===== Quiénes somos · Método (según la maqueta): cabecera del bloque, timeline numerado y dos tarjetas (Andy · referencias) ===== */
.mt { display:grid; gap:3.4vh; width:100%; --verde:rgb(24,166,134); }
body .mt-ante { margin:0 0 .8vh !important; font:700 clamp(12px,.95vw,15px)/1.2 var(--sans, Montserrat) !important; letter-spacing:.08em !important; text-transform:uppercase !important; color:var(--verde) !important; }
body .mt-tit { margin:0 !important; font:800 clamp(24px,2.4vw,42px)/1.05 var(--sans, Montserrat) !important; letter-spacing:-.01em !important; text-transform:uppercase !important; color:#fff !important; }
.mt-pasos { list-style:none; margin:0; padding:0; display:grid; grid-template-columns:repeat(5,minmax(0,1fr)); position:relative; }
.mt-pasos::before { content:""; position:absolute; left:0; right:0; top:8px; height:2px; background:linear-gradient(90deg, transparent, #c8963e 4%, #c8963e 96%, transparent); }
.mt-pasos li { position:relative; display:grid; justify-items:center; gap:4px; padding-top:30px; text-align:center; }
.mt-pasos li::before { content:""; position:absolute; top:0; left:50%; width:14px; height:14px; translate:-50% 0; border-radius:50%; background:#000; box-shadow:inset 0 0 0 2px #c8963e, 0 0 0 4px #000; }
.mt-pasos i { font:500 clamp(14px,1.1vw,18px)/1 var(--sans, Montserrat); font-style:normal; color:rgba(239,232,216,.85); }
.mt-pasos b { font:800 clamp(17px,1.4vw,24px)/1.15 var(--sans, Montserrat); text-transform:uppercase; color:#fff; }
.mt-pasos span { max-width:20ch; font:400 clamp(13px,.95vw,16px)/1.4 var(--sans, Montserrat); color:rgba(239,232,216,.82); }
.mt-fila { display:grid; grid-template-columns:minmax(0,.88fr) minmax(0,1.12fr); gap:clamp(12px,1vw,18px); }
.mt-card { border-radius:var(--radio, 16px); background:rgba(255,255,255,.03); box-shadow:var(--canto); overflow:hidden; }
/* Tarjeta de Andy: la foto a la izquierda a todo el alto; el texto a la derecha */
.mt-yo { display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1.15fr); }
.mt-yo-foto { width:100%; height:100%; min-height:100%; object-fit:cover; object-position:40% 45%; }
.mt-yo-txt { padding:clamp(18px,2.2vw,40px); display:flex; flex-direction:column; justify-content:center; text-align:left; }
body .mt-yo-txt h3 { margin:0 0 .6vh !important; font:800 clamp(20px,1.8vw,32px)/1.1 var(--sans, Montserrat) !important; text-transform:uppercase !important; letter-spacing:0 !important; color:#fff !important; }
body .mt-yo-txt p { margin:0 0 1.2vh !important; font:400 clamp(13px,.95vw,16px)/1.5 var(--sans, Montserrat) !important; letter-spacing:0 !important; text-transform:none !important; color:rgba(239,232,216,.9) !important; text-align:left !important; }
body .mt-yo-txt .mt-rol { margin-bottom:1.8vh !important; font-weight:700 !important; letter-spacing:.06em !important; text-transform:uppercase !important; color:var(--verde) !important; }
body .mt-yo-txt .mt-gris { color:rgba(239,232,216,.6) !important; margin-bottom:2vh !important; }
.mt-yo-txt a:not(.me-redes a) { color:inherit; text-decoration:none; border-bottom:1px solid rgba(200,150,62,.7); }
.mt hr { width:100%; height:1px; border:0; margin:.6vh 0 1.8vh; background:rgba(24,166,134,.45); }
.mt-yo .me-redes { justify-content:flex-start; }
/* Tarjeta de referencias: vídeo grande y cita; debajo, los directivos y el enlace */
.mt-ref { padding:clamp(18px,1.8vw,30px); display:grid; gap:2.6vh; }
.mt-ref-top { display:grid; grid-template-columns:minmax(0,1.15fr) minmax(0,1fr); gap:clamp(18px,2vw,36px); align-items:center; }
.mt-ref .me-video { margin:0; width:100%; max-width:none; }
.mt-ref blockquote { margin:0; text-align:left; }
body .mt-ref blockquote p { margin:0 0 1.6vh !important; font:400 clamp(14px,1.15vw,20px)/1.45 var(--sans, Montserrat) !important; font-style:italic !important; letter-spacing:0 !important; text-transform:none !important; color:#fff !important; text-align:left !important; }
.mt-ref blockquote hr { width:60%; margin:0 0 1.6vh; }
.mt-ref blockquote footer, .mt-ref-pie figcaption { display:grid; gap:2px; font:500 clamp(10px,.75vw,12px)/1.3 var(--sans, Montserrat); letter-spacing:.08em; text-transform:uppercase; color:rgba(239,232,216,.6); text-align:left; }
.mt-ref blockquote footer b, .mt-ref-pie figcaption b { font:700 clamp(13px,1vw,16px)/1.2 var(--sans, Montserrat); letter-spacing:0; text-transform:none; color:#fff; }
.mt-ref-pie { display:flex; align-items:center; justify-content:space-between; flex-wrap:wrap; gap:14px 22px; }
.mt-ref-pie figure { display:flex; align-items:center; gap:10px; margin:0; }
.mt-ref-pie img, .mt-ref-pie .me-ini { width:clamp(40px,3.2vw,52px); aspect-ratio:1; border-radius:50%; object-fit:cover; }
@media (max-width:1000px) {
  .mt-fila { grid-template-columns:1fr; }
  .mt-pasos { grid-template-columns:1fr; gap:22px; }
  .mt-pasos::before { left:50%; right:auto; top:0; bottom:0; width:2px; height:auto; }
  .mt-pasos li { padding:0; background:#000; }
  .mt-pasos li::before { display:none; }
  .mt-ref-top { grid-template-columns:1fr; }
}
@media (max-width:600px) { .mt-yo { grid-template-columns:1fr; } .mt-yo-foto { aspect-ratio:4/3; } }
.mt { gap:2.6vh; }
.mt-ref blockquote footer { display:grid !important; text-align:left !important; justify-items:start; }
.mt-yo-txt { padding:clamp(16px,1.6vw,30px); }
body .mt-yo-txt p { margin-bottom:.8vh !important; }
.mt hr { margin:.4vh 0 1.2vh; }
.mt-ref { gap:1.8vh; padding:clamp(14px,1.4vw,24px); }
.mt-ref-top { grid-template-columns:minmax(0,1fr) minmax(0,1fr); }
body .mt-ref blockquote p { font-size:clamp(13px,1.02vw,18px) !important; margin-bottom:1.2vh !important; }
.mt-pasos li { padding-top:26px; }
body .mt-ante { margin:0 !important; font-size:clamp(14px,1.15vw,19px) !important; text-align:center; }

/* Método: la foto de Andy a la misma altura que el vídeo de Miguel (vídeo de ancho fijo, foto con ese alto); la cara de Miguel junto a su nombre; el enlace pegado a la cita */
.mt-fila { align-items:stretch; }
.mt-yo { grid-template-columns:auto minmax(0,1fr); align-items:center; gap:clamp(18px,2vw,36px); padding:clamp(16px,1.6vw,28px); }
.mt-yo-foto { width:auto; height:min(13.5vw, 228px); min-height:0; aspect-ratio:3/4; border-radius:var(--radio-s, 10px); }
.mt-yo-txt { padding:0; }
.mt-ref { align-content:center; padding:clamp(16px,1.6vw,28px); }
.mt-ref-top { grid-template-columns:auto minmax(0,1fr); }
.mt-ref .me-video { width:min(24vw, 405px); }
.mt-ref blockquote footer { display:flex !important; align-items:center; gap:12px; margin-bottom:1.6vh; }
.mt-ref blockquote footer img { width:46px; height:46px; border-radius:50%; object-fit:cover; box-shadow:0 0 0 1px rgba(200,150,62,.6); flex:none; }
.mt-ref blockquote footer span { display:grid; gap:2px; }
@media (max-width:1000px) { .mt-ref-top { grid-template-columns:1fr; } .mt-ref .me-video { width:100%; } .mt-yo-foto { height:200px; } }
@media (max-width:600px) { .mt-yo { grid-template-columns:1fr; justify-items:center; } }
/* Método: foto y vídeo con el mismo alto, el que tenía el vídeo antes (unos 215 px a 1440); el texto de cada tarjeta ocupa exactamente ese alto */
.mt { --alto-mt:min(15vw, 240px); }
.mt-yo-foto { height:var(--alto-mt); }
.mt-ref .me-video { width:calc(var(--alto-mt) * 16 / 9); }
.mt-yo, .mt-ref-top { align-items:stretch; }
.mt-yo-txt, .mt-ref blockquote { height:var(--alto-mt); display:flex; flex-direction:column; justify-content:space-between; overflow:hidden; }
.mt-yo-txt > *, .mt-ref blockquote > * { margin-top:0 !important; margin-bottom:0 !important; }
.mt-yo-txt hr, .mt-ref blockquote hr { margin:0 !important; }
.mt-ref { align-content:start; }
@media (max-width:1000px) { .mt-yo-txt, .mt-ref blockquote { height:auto; gap:12px; } .mt-ref .me-video { width:100%; } }
body .mt-yo-txt h3 { font-size:clamp(17px,1.45vw,26px) !important; }
body .mt-yo-txt p { font-size:clamp(12px,.86vw,15px) !important; line-height:1.4 !important; }
body .mt-yo-txt .mt-rol { font-size:clamp(11px,.78vw,13px) !important; }
.mt-yo .me-redes a { width:32px; height:32px; }
.mt-yo .me-redes svg { width:15px; height:15px; }
.mt-ref blockquote footer span { min-width:0; overflow-wrap:anywhere; }
body .mt-ref blockquote p { font-size:clamp(12px,.95vw,17px) !important; }
.mt-ref blockquote footer span, .mt-ref blockquote footer span * { white-space:normal !important; }
.mt { --alto-mt:max(200px, min(15vw, 240px)); }
.mt { --alto-mt:calc(max(200px, min(15vw, 240px)) * 1.35); }
.mt { --alto-mt:calc(max(200px, min(15vw, 240px)) * 1.35 * 1.15); }
/* Método · cita de Miguel: su cara y su nombre pegados a la cita (no repartidos a lo alto); el botón, grande y a la derecha */
.mt-ref blockquote { justify-content:center; gap:1.6vh; }
.mt-boton { align-self:flex-end; display:inline-flex; align-items:center; gap:.8em; margin-top:1vh !important; padding:1em 1.8em; border:1px solid rgba(200,150,62,.85); border-radius:999px;
  font:700 clamp(12px,.9vw,14px)/1 var(--sans, Montserrat); letter-spacing:.14em; text-transform:uppercase; color:#efe8d8; text-decoration:none; transition:background .3s, color .3s, border-color .3s; }
.mt-boton::after { content:"→"; color:#c8963e; transition:transform .3s, color .3s; }
.mt-boton:hover { background:#efe8d8; border-color:#efe8d8; color:#0a0a0a; }
.mt-boton:hover::after { color:#0a0a0a; transform:translateX(3px); }
.mt-firma { display:flex; align-items:center; justify-content:space-between; gap:16px; flex-wrap:wrap; }
.mt-firma footer { margin:0 !important; }
.mt-firma .mt-boton { align-self:center; margin:0 !important; }
.mt-firma { flex-wrap:wrap; width:100%; }
.mt-firma footer { flex:0 1 auto; width:auto !important; border:0 !important; padding:0 !important; }
.mt-firma .mt-boton { margin-left:auto !important; flex:none; }
.mt-fila { margin-top:100px; }
/* Método: el botón «Tú eres el protagonista» con el borde inferior a la misma altura que los iconos de contacto */
.mt-ref blockquote { justify-content:space-between !important; }
.mt-firma { align-items:flex-end; }
.mt-yo-txt { width:80%; }
/* Método: el fondo de cada tarjeta se ajusta a su contenido (las tarjetas siguen en los mismos bordes de antes);
   texto de Miguel un 20 % más estrecho; su firma pegada a la cita; el botón donde estaba; título «Nuestros clientes» */
.mt-fila { display:flex !important; justify-content:space-between; align-items:flex-start; }
.mt-card { flex:none; }
.mt-yo-txt { width:18vw; }
.mt-ref blockquote { width:12.5vw; justify-content:flex-start !important; }
.mt-ref blockquote > .mt-boton { margin-top:auto !important; align-self:flex-end; }
body .mt-ref blockquote p.mt-clientes { font:700 clamp(11px,.8vw,13px)/1.2 var(--sans, Montserrat) !important; font-style:normal !important; letter-spacing:.08em !important; text-transform:uppercase !important; color:rgb(24,166,134) !important; }
.mt-boton { white-space:nowrap; }
/* Método: botón un poco más pequeño; el timeline baja 30 px (las tarjetas se quedan donde estaban); las dos tarjetas centradas respecto al eje vertical */
.mt-boton { padding:.85em 1.5em; font-size:clamp(11px,.8vw,13px); }
.mt-pasos { margin-top:30px; }
.mt-fila { margin-top:70px; justify-content:center !important; gap:clamp(24px,2.4vw,48px) !important; }
/* Método: texto de las tarjetas justificado, sin palabras sueltas al final; la cabecera y el timeline bajan 20 px más (las tarjetas, en su sitio) */
body .mt-yo-txt p, body .mt-ref blockquote p:not(.mt-clientes) { text-align:justify !important; hyphens:none; text-wrap:pretty; }
.mt-cab { margin-top:20px; }
.mt-fila { margin-top:50px; }
/* Método · firma de Miguel: sin cara ni línea, a la derecha y pegada a la cita */
.mt-ref .mt-firma, .mt-ref blockquote footer { justify-content:flex-end !important; }
.mt-ref blockquote footer span { text-align:right; justify-items:end; }
.mt-ref blockquote > .mt-firma { margin-top:-20px !important; }
/* Las líneas de tiempo, doradas como la de Método */
.pf-tl { --v:200,150,62; }
/* Trayectoria · menú «Experiencia»: minimalista, solo texto (sin cajas ni círculos); el activo en blanco con una raya dorada */
#p-experiencia .pf-conmuta-exp.vert { border-left:0; }
#p-experiencia .pf-conmuta-exp.vert button { padding:.9vh 0 .9vh 14px; color:rgba(239,232,216,.45); background:none; box-shadow:none; border:0; transition:color .3s; }
#p-experiencia .pf-conmuta-exp.vert button::before, #p-experiencia .pf-conmuta-exp.vert button::after, #p-experiencia .pf-conmuta-exp.vert .pf-marca, #p-experiencia .pf-conmuta-exp .pf-estela { display:none; }
#p-experiencia .pf-conmuta-exp.vert button:hover { color:#fff; }
#p-experiencia .pf-conmuta-exp.vert button.on { color:#fff; box-shadow:inset 1px 0 0 #c8963e; }
#p-experiencia .pf-conmuta-exp.vert .pf-areas-etq { color:rgba(239,232,216,.4); }
/* Trayectoria · Publicidad: el acordeón, minimalista como el menú (sin cajas ni verde; el abierto en blanco con raya dorada) */
#p-experiencia .pf-pub-casa > summary::before, #p-experiencia .pf-pub-casa > summary::after { display:none; }
#p-experiencia .pf-pub-casa > summary { padding-left:14px; box-shadow:inset 0 -1px 0 rgba(239,232,216,.12); }
#p-experiencia .pf-pub-casa[open] > summary { box-shadow:inset 1px 0 0 #c8963e, inset 0 -1px 0 rgba(239,232,216,.12); }
#p-experiencia .pf-pub-casa:not([open]) h4 { color:rgba(239,232,216,.45); transition:color .3s; }
#p-experiencia .pf-pub-casa > summary:hover h4 { color:#fff; }
#p-experiencia .pf-pub-casa h4::before, #p-experiencia .pf-pub-casa h4::after { background:rgba(239,232,216,.5); }
#p-experiencia .pf-pub-meta, #p-experiencia .pf-pub-etq { color:rgba(239,232,216,.4); }
#p-experiencia .pf-pub-cuerpo { padding-left:14px; }
#p-experiencia .pf-pub-cuerpo li::before { background:rgba(239,232,216,.35); }
#p-experiencia .pf-pub-marcas span::before { color:rgba(239,232,216,.3); }
@media (max-width:760px) and (orientation:portrait), (max-height:500px) and (orientation:landscape) {
  html body #p-experiencia .pf-conmuta-exp > button.on { color:#fff !important; box-shadow:inset 0 -1px 0 #c8963e !important; }
}
/* Televisión: sin la foto de Radio Gaga, la línea de tiempo ocupa todo el ancho (12 etapas, cada una en 2 de 13 columnas) */
.pf-tl-eje.pf-tl-tv { grid-template-columns:repeat(13, minmax(0,1fr)) !important; }
.pf-tl-eje.pf-tl-tv::before { background:linear-gradient(90deg, rgba(var(--v),.25), rgba(var(--v),.9)) !important; }
/* Cine: cada titular de etapa, centrado sobre su tramo de la línea de tiempo (misma rejilla de 20 columnas que el eje) */
.tl-etapas-arriba { display:grid !important; grid-template-columns:repeat(20, minmax(0,1fr)); }
.tl-etapas-arriba > span:first-child { grid-column:1 / 10; text-align:center; }
.tl-etapas-arriba > span:last-child { grid-column:11 / 21; text-align:center; }
/* Publicidad: letra algo más pequeña (≈ −10 %), sin bajar de 13 px en el texto corrido */
@media (min-width:761px) {
  body #pf-x-pub .pf-vtxt p { font-size:clamp(13px,.8vw,15.5px) !important; line-height:1.65 !important; }
  body #pf-x-pub .pf-pub-casa h4 { font-size:clamp(15px,.95vw,18px) !important; }
  body #pf-x-pub .pf-pub-cuerpo li { font-size:clamp(13px,.77vw,14.8px) !important; line-height:1.6 !important; }
  body #pf-x-pub .pf-pub-marcas { font-size:clamp(11px,.6vw,11.5px) !important; }
}
/* Método · ficha de Andy: enlace a su web, a la derecha de los iconos y en su misma línea */
.mt-yo .me-redes { align-items:center; }
body .mt-yo .me-redes a.me-web { width:auto; height:auto; margin-left:auto; border-radius:0; box-shadow:none; background:none; color:rgba(239,232,216,.7); font:400 clamp(11px,.75vw,13px)/1 var(--sans, Montserrat); letter-spacing:.04em; border-bottom:1px solid rgba(200,150,62,.7); padding-bottom:2px; }
body .mt-yo .me-redes a.me-web:hover { background:none; color:#fff; }
.mt-yo .me-redes a:not(.me-web) { flex:none; } .mt-yo .me-redes { flex-wrap:wrap; row-gap:8px; }
/* Portada: los cinco empresarios en círculo y el enlace a «Por qué nosotros», antes del cierre */
.home-empresarios { display:grid; justify-items:center; gap:clamp(24px,3.4vh,40px); padding:clamp(48px,8vh,96px) 16px clamp(16px,3vh,32px); }
.home-empresarios .me-directivos { max-width:1400px; }
.home-empresarios > .mt-boton { justify-self:center !important; align-self:center !important; margin:0 !important; }
@media (max-width:760px) {
  .home-empresarios .me-directivos { gap:22px 10px; }
  .home-empresarios .me-directivos figure { flex-direction:column; width:calc((100% - 20px) / 3); text-align:center; gap:8px; }
  .home-empresarios .me-directivos figcaption { text-align:center; justify-items:center; }
}
body .home-empresarios .he-promesa { margin:0; max-width:32ch; text-align:center; text-wrap:balance; font:800 clamp(22px,2.2vw,40px)/1.15 var(--sans, Montserrat); letter-spacing:-.02em; text-transform:none; color:#fff; }
/* Portada · ¿Por qué trabajar con nosotros?: dos razones, una junto a otra, con su número en dorado */
.home-empresarios .he-razones { list-style:none; margin:0; padding:0; display:grid; grid-template-columns:repeat(2, minmax(0, 34ch)); justify-content:center; gap:clamp(20px,3vw,64px); }
.home-empresarios .he-razones li { display:grid; justify-items:center; gap:10px; text-align:center; text-wrap:balance; font:400 clamp(15px,1.1vw,19px)/1.5 var(--sans, Montserrat); color:rgba(239,232,216,.85); }
.home-empresarios .he-razones i { font:800 clamp(22px,1.8vw,32px)/1 var(--sans, Montserrat); font-style:normal; color:#c8963e; }
@media (max-width:760px) { .home-empresarios .he-razones { grid-template-columns:minmax(0, 34ch); } }
/* Portada · ¿Por qué trabajar con nosotros? (maqueta): título como los de la portada, las dos razones en tarjetas
   como las de Método, y debajo una franja con los tres empresarios separados por filetes, y el botón */
.home-empresarios { max-width:1240px; margin:0 auto; padding:clamp(64px,11vh,130px) 16px clamp(24px,4vh,48px); gap:0 !important; }
body .home-empresarios .he-promesa { max-width:none; margin:0 0 clamp(28px,5vh,56px); font:800 clamp(26px,2.4vw,44px)/1.05 var(--sans, Montserrat); letter-spacing:-.015em; text-transform:uppercase; }
.home-empresarios .he-razones { width:100%; grid-template-columns:repeat(2, minmax(0,1fr)); gap:clamp(16px,1.6vw,28px); }
.home-empresarios .he-razones li { justify-items:center; align-content:center; gap:clamp(14px,2vh,22px); padding:clamp(32px,5.5vh,64px) clamp(24px,3vw,56px); border-radius:var(--radio, 16px); background:rgba(255,255,255,.03); box-shadow:var(--canto, 0 0 0 1px rgba(255,255,255,.08));
  font:700 clamp(18px,1.45vw,26px)/1.3 var(--sans, Montserrat); letter-spacing:-.01em; color:#fff; }
.home-empresarios .he-razones i { font:300 clamp(30px,2.6vw,46px)/1 var(--sans, Montserrat); letter-spacing:.04em; color:#c8963e; }
.home-empresarios .me-directivos { width:100%; max-width:none; margin:clamp(16px,1.6vw,28px) 0 clamp(32px,5vh,56px); padding:clamp(18px,2.6vh,28px) 0; gap:0 !important; flex-wrap:nowrap; border-radius:var(--radio, 16px); background:rgba(255,255,255,.03); box-shadow:var(--canto, 0 0 0 1px rgba(255,255,255,.08)); }
.home-empresarios .me-directivos figure { flex:1 1 0; justify-content:center; padding:0 clamp(12px,2vw,32px); }
.home-empresarios .me-directivos figure + figure { box-shadow:-1px 0 0 rgba(239,232,216,.1); }
@media (max-width:760px) {
  .home-empresarios .he-razones { grid-template-columns:1fr; }
  .home-empresarios .me-directivos { flex-wrap:nowrap; padding:20px 0; }
  .home-empresarios .me-directivos figure { width:auto; padding:0 8px; }
}
@media (max-width:760px) {
  .home-empresarios .he-razones li { padding:26px 20px; gap:10px; font-size:17px; }
  .home-empresarios .he-razones i { font-size:28px; }
}
/* Portada · el caso de José Antonio Sevilla: vídeo a la izquierda y el texto a la derecha, en tarjeta, encima de los empresarios */
.home-empresarios .he-caso { width:100%; margin-top:clamp(16px,1.6vw,28px); display:grid; grid-template-columns:minmax(0,1.55fr) minmax(0,1fr); align-items:center; gap:clamp(24px,3vw,56px); padding:clamp(16px,1.4vw,24px); padding-right:clamp(24px,3vw,56px); border-radius:var(--radio, 16px); background:rgba(255,255,255,.03); box-shadow:var(--canto, 0 0 0 1px rgba(255,255,255,.08)); }
.home-empresarios .he-video { display:block; }
.home-empresarios .he-video .vid { display:block; width:100%; }
body .home-empresarios .he-caso p { margin:0; text-align:justify; hyphens:none; text-wrap:pretty; font:500 clamp(16px,1.25vw,22px)/1.5 var(--sans, Montserrat); color:rgba(239,232,216,.9); }
@media (max-width:760px) {
  .home-empresarios .he-caso { grid-template-columns:1fr; padding:12px 12px 22px; gap:18px; }
  body .home-empresarios .he-caso p { font-size:16px; padding:0 8px; }
}
.home-empresarios .he-caso { grid-template-columns:minmax(0,1.2fr) minmax(0,1fr); } body .home-empresarios .he-caso p { font-size:clamp(16px,1.2vw,21px); }
@media (max-width:760px) { .home-empresarios .he-caso { grid-template-columns:1fr; } body .home-empresarios .he-caso p { font-size:16px; } }
/* La cara con vídeo se puede pulsar; la del vídeo que suena, con el aro dorado */
.home-empresarios .me-directivos figure.con-video { cursor:pointer; }
.home-empresarios .me-directivos figure.con-video img { transition:box-shadow .3s; }
.home-empresarios .me-directivos figure.con-video:hover img, .home-empresarios .me-directivos figure.on img { box-shadow:0 0 0 2px #c8963e; }
.home-empresarios .he-caso { margin-top:0; }
body .home-empresarios .he-promesa b { font-weight:inherit; color:rgb(24,166,134); }
body .home-empresarios .he-promesa::before { content:""; display:block; width:64px; height:1px; margin:0 auto 3vh; background:var(--oro-grad); }
/* Por qué nosotros · reproductor: nombre y cargo en un faldón abajo a la izquierda (en lugar del rótulo grande) */
body .caras-rejilla .cred-video > span.faldon { left:0; bottom:clamp(14px,2.2vh,24px); display:grid; gap:4px; padding:10px 18px 10px 16px; white-space:normal; max-width:80%;
  background:linear-gradient(90deg, rgba(0,0,0,.82), rgba(0,0,0,.55)); box-shadow:inset 2px 0 0 #c8963e; text-shadow:none; letter-spacing:0; text-transform:none; line-height:1.2; }
body .caras-rejilla .cred-video > span.faldon b { font:700 clamp(15px,1.15vw,20px)/1.15 var(--sans, Montserrat); color:#fff; letter-spacing:-.005em; }
body .caras-rejilla .cred-video > span.faldon i { font:500 clamp(10px,.7vw,12px)/1.3 var(--sans, Montserrat); font-style:normal; letter-spacing:.12em; text-transform:uppercase; color:rgba(239,232,216,.7); }
.caras-rejilla .cred-video { background-clip:padding-box !important; }   /* la imagen no asoma bajo el borde de 1 px, que el oscurecido no cubre */