/* v6 / cqh-expediente: articulo con el formato de reporte de Oatly. Numeros medidos en vivo (2026-11-04, 1440 px):
   - hoja: seamless-paper.png en mosaico al 50 % sobre #fff (la misma del manifiesto; assets/v6/manifiesto/);
   - tokens de Oatly: rem 16 px (14 en <= 767), gutter clamp(1rem .. 3.15rem); Margo s 17.47/20.97, Margo m 19.47/23.37, encabezado
     Margo m 22.42/1 en mayusculas, Margo xl 29.9/1.2 (citas y entrada roja), Toni xl 124/.778, Toni xxl 158.7/.74 (.88 con acentos);
   - indice (vol. 2): etiqueta Margo 18/18 roja en mayusculas, renglones de 43.8 px con linea de 1 px;
   - capitulo (vol. 2): etiqueta roja centrada, titulo centrado a todo lo ancho; columnas 360 / 720 / 360 con padding 20.67 (gutter/2),
     fila con border-top 1 px y columnas 2 y 3 con border-left 1 px; cuerpo 646 px dentro de la columna central; "Key statistics"
     como h5 Margo 22.42 en mayusculas + lista sin viñeta nativa, items con padding-left 17.47; grafica de 318 px con titulo Margo 24/28.8
     centrado, barras en negro y rojo (#ef1738 en Oatly), textos de 12 px en mayusculas, leyenda con muestras de 24 px;
   - rojos: #ed1c24 solo en texto grande (3.9:1), #d4181f en texto chico y chips (4.75:1). Rutas url() relativas a home/secciones/cqh-expediente/. */
@font-face{font-family:"ex-Toni";src:url("../../assets/v6/fonts/ToniNoveauPro-Regular.otf") format("opentype");font-weight:400;font-style:normal;font-display:block}
@font-face{font-family:"ex-Margo";src:url("../../assets/v6/fonts/MargoPro-Regular.woff") format("woff"),url("../../assets/v6/fonts/MargoPro-Regular.woff2") format("woff2");font-weight:400;font-style:normal;font-display:swap}

#sec-cqh-expediente{
  --ot-rem:16px;
  --gutter:clamp(calc(1 * var(--ot-rem)), calc(1 * var(--ot-rem) + (100vw - 48 * var(--ot-rem)) * (3.15 - 1) / 57), calc(3.15 * var(--ot-rem)));
  --margo-s:clamp(calc(1 * var(--ot-rem)), calc(1 * var(--ot-rem) + (100vw - 48 * var(--ot-rem)) * (1.125 - 1) / 57), calc(1.125 * var(--ot-rem)));
  --margo-m:clamp(calc(1.125 * var(--ot-rem)), calc(1.125 * var(--ot-rem) + (100vw - 48 * var(--ot-rem)) * (1.25 - 1.125) / 57), calc(1.25 * var(--ot-rem)));
  --margo-h:clamp(calc(1.125 * var(--ot-rem)), calc(1.125 * var(--ot-rem) + (100vw - 48 * var(--ot-rem)) * (1.5 - 1.125) / 57), calc(1.5 * var(--ot-rem)));
  --margo-xl:clamp(calc(1.5 * var(--ot-rem)), calc(1.5 * var(--ot-rem) + (100vw - 48 * var(--ot-rem)) * (2 - 1.5) / 57), calc(2 * var(--ot-rem)));
  --toni-xl:clamp(calc(4.25 * var(--ot-rem)), calc(4.25 * var(--ot-rem) + (100vw - 48 * var(--ot-rem)) * (9 - 4.25) / 57), calc(9 * var(--ot-rem)));
  --toni-xxl:clamp(calc(5.5 * var(--ot-rem)), calc(5.5 * var(--ot-rem) + (100vw - 48 * var(--ot-rem)) * (11.5 - 5.5) / 57), calc(11.5 * var(--ot-rem)));
  --toni-cap:clamp(calc(3.4 * var(--ot-rem)), 7vw, calc(6.6 * var(--ot-rem)));
  --rojo-g:#ed1c24;--rojo:#d4181f;--tinta:#000;--gris:#757575;--linea:#000;
  display:flow-root;position:relative;color:var(--tinta);
  background-color:#fff;background-image:url("../../assets/v6/manifiesto/seamless-paper.png");background-position:center center;background-size:50%;background-repeat:repeat;
  font-family:"ex-Margo",Arial,sans-serif;font-size:var(--margo-s);line-height:1.2;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}
@media (max-width:767px){#sec-cqh-expediente{--ot-rem:14px}}
#sec-cqh-expediente *{box-sizing:border-box}
#sec-cqh-expediente ::selection{background:var(--rojo-g);color:#fff}
#sec-cqh-expediente a{color:inherit}
#sec-cqh-expediente .ex-tapa{max-width:calc(12 * 7.1428571429vw);margin:0 auto}   /* widthXl de Oatly: 12 columnas de 7.14vw = 1028 px a 1440 */
#sec-cqh-expediente .ex-ancho{width:75vw;margin:0 auto;border-left:1px solid var(--linea);border-right:1px solid var(--linea)}   /* la columna con bordes del reporte (1080 px a 1440) */
@media (max-width:767px){#sec-cqh-expediente .ex-ancho{width:90vw}}

/* ---------- portada (hero del reporte) ---------- */
#sec-cqh-expediente .ex-portada{border-bottom:1px solid var(--linea);padding:calc(var(--gutter) / 2 + 2px + var(--gutter) * 1) calc(var(--gutter) / 2) calc(var(--gutter) * 1);text-align:center;position:relative}
#sec-cqh-expediente .ex-portada .ex-etiqueta{font-size:var(--margo-h);line-height:1;text-transform:uppercase;margin:0 0 calc(.9 * var(--ot-rem))}
#sec-cqh-expediente .ex-portada h1{font-family:"ex-Toni","ex-Margo",sans-serif;font-weight:400;font-size:var(--toni-xxl);line-height:.88;text-transform:uppercase;color:var(--rojo-g);margin:calc(.9 * var(--ot-rem)) auto;max-width:12ch;text-wrap:balance}
#sec-cqh-expediente .ex-portada--larga h1{font-size:var(--toni-xl);line-height:.9;max-width:18ch}   /* titulos de mas de 32 caracteres: Toni xl (124 px a 1440), cuatro renglones */
#sec-cqh-expediente .ex-portada .ex-bajante{font-size:var(--margo-h);line-height:1;text-transform:uppercase;margin:calc(.9 * var(--ot-rem)) 0 0}
#sec-cqh-expediente .ex-portada .ex-meta{margin:calc(var(--gutter) * .9) 0 0;font-size:12px;line-height:1.3;letter-spacing:.04em;text-transform:uppercase;color:var(--tinta)}
#sec-cqh-expediente .ex-portada .ex-meta a{text-decoration:none;border-bottom:1px solid var(--tinta)}
#sec-cqh-expediente .ex-portada .ex-meta span{margin:0 .5em}
#sec-cqh-expediente .ex-sello{display:block;width:88px;height:88px}
#sec-cqh-expediente .ex-portada .ex-sello{position:absolute;right:calc(var(--gutter) * 1.2);bottom:calc(var(--gutter) * .9)}
@media (max-width:767px){#sec-cqh-expediente .ex-portada .ex-sello{position:static;width:56px;height:56px;margin:calc(var(--gutter) * 1.2) auto 0}}
@media (min-width:768px){#sec-cqh-expediente .ex-portada{padding-top:calc(var(--gutter) / 2 + 2px + var(--gutter) * 2);padding-bottom:calc(var(--gutter) * 2)}}

/* ---------- indice (vol. 2) ---------- */
#sec-cqh-expediente .ex-indice{border-bottom:1px solid var(--linea);padding:calc(var(--gutter) * 1.5) calc(var(--gutter) / 2 + 20px)}
#sec-cqh-expediente .ex-indice-cab{display:flex;align-items:flex-start;justify-content:space-between;gap:24px;margin:0 0 calc(var(--gutter) * .8)}
#sec-cqh-expediente .ex-indice h2{font-family:"ex-Toni","ex-Margo",sans-serif;font-weight:400;font-size:var(--toni-xl);line-height:.9;text-transform:uppercase;color:var(--rojo-g);margin:0}
#sec-cqh-expediente .ex-indice ol{list-style:none;margin:0;padding:0}
#sec-cqh-expediente .ex-indice li{border-top:1px solid var(--linea);padding:14px 0 12px}
#sec-cqh-expediente .ex-indice li:last-child{border-bottom:1px solid var(--linea)}
#sec-cqh-expediente .ex-indice li a{display:block;text-decoration:none}
#sec-cqh-expediente .ex-indice .ex-chip-i{display:block;font-size:18px;line-height:18px;text-transform:uppercase;color:var(--rojo);margin:0 0 6px}
#sec-cqh-expediente .ex-indice .ex-titulo-i{display:block;font-family:"ex-Toni","ex-Margo",sans-serif;font-size:clamp(28px,3.04vw,43.8px);line-height:1;text-transform:uppercase}
#sec-cqh-expediente .ex-indice li a:hover .ex-titulo-i{color:var(--rojo)}

/* ---------- apertura de capitulo (vol. 2) ---------- */
#sec-cqh-expediente .ex-cap{padding:calc(var(--gutter) * 1.6) calc(var(--gutter) / 2) calc(var(--gutter) * 1.1);text-align:center}
#sec-cqh-expediente .ex-chip{display:inline-block;background:var(--rojo);color:#fff;font-size:18px;line-height:18px;text-transform:uppercase;padding:5px 9px 3px;border-radius:2px;margin:0 0 calc(var(--gutter) * .7)}
#sec-cqh-expediente .ex-cap h2{font-family:"ex-Toni","ex-Margo",sans-serif;font-weight:400;font-size:var(--toni-cap);line-height:.9;text-transform:uppercase;margin:0 auto;max-width:1399px;text-wrap:balance}

/* ---------- columnas del capitulo (vol. 2) ---------- */
#sec-cqh-expediente .ex-cols{display:grid;grid-template-columns:1fr 2fr 1fr;border-top:1px solid var(--linea);border-bottom:1px solid var(--linea)}
#sec-cqh-expediente .ex-col{padding:calc(var(--gutter) * 1.1) calc(var(--gutter) / 2);min-width:0}
#sec-cqh-expediente .ex-col + .ex-col{border-left:1px solid var(--linea)}
#sec-cqh-expediente .ex-pegajoso{position:sticky;top:24px}
#sec-cqh-expediente .ex-centro{padding-left:calc(var(--gutter) / 2 + 16px);padding-right:calc(var(--gutter) / 2 + 16px)}
#sec-cqh-expediente .ex-lead{font-size:var(--margo-xl);line-height:1.2;color:var(--rojo-g);text-align:center;margin:0 0 calc(1.5 * var(--ot-rem))}
#sec-cqh-expediente .ex-cuerpo p{font-size:var(--margo-s);line-height:1.2;margin:calc(1.5 * var(--ot-rem)) 0}
#sec-cqh-expediente .ex-cuerpo p:first-child{margin-top:0}
#sec-cqh-expediente .ex-cuerpo p:last-child{margin-bottom:0}
#sec-cqh-expediente .ex-cuerpo ul.ex-lista{list-style:none;margin:calc(1.5 * var(--ot-rem)) 0;padding:0 0 0 4px;border-left:3px solid var(--rojo);}
#sec-cqh-expediente .ex-cuerpo ul.ex-lista li{position:relative;padding-left:22px;margin:0 0 10px;font-size:var(--margo-m);line-height:1.25}
#sec-cqh-expediente .ex-cuerpo ul.ex-lista li:last-child{margin-bottom:0}
#sec-cqh-expediente .ex-cuerpo ul.ex-lista li::before{content:"";position:absolute;left:8px;top:.55em;width:7px;height:7px;background:var(--rojo)}
#sec-cqh-expediente .ex-cuerpo a{text-decoration:underline;text-underline-offset:2px;text-decoration-thickness:1px}
#sec-cqh-expediente .ex-cuerpo a:hover{color:var(--rojo)}
#sec-cqh-expediente .ex-cita{margin:calc(2 * var(--ot-rem)) 0;padding:0 24px;text-align:center}
#sec-cqh-expediente .ex-cita p{font-size:var(--margo-xl);line-height:1.2;color:var(--rojo-g);margin:0}
#sec-cqh-expediente .ex-cita .ex-cita-de{font-size:var(--margo-s);line-height:1.2;color:var(--tinta);text-transform:uppercase;margin:calc(1.5 * var(--ot-rem)) 0 0}
#sec-cqh-expediente .ex-cita .ex-cita-de:empty{display:none}
/* publicacion de Instagram incrustada (su pagina /embed/ en un iframe): 400 px de ancho maximo, centrada, etiqueta arriba, pie con la
   liga; la altura la pone section.js (formula medida + mensaje MEASURE de Instagram). Instagram pide 326 px de ancho minimo. */
#sec-cqh-expediente .ex-embed{margin:calc(2 * var(--ot-rem)) auto;max-width:400px}
#sec-cqh-expediente .ex-embed h5{font-size:var(--margo-h);line-height:1;font-weight:400;text-transform:uppercase;margin:0 0 14.4px}
#sec-cqh-expediente .ex-embed-marco{border:1px solid var(--linea);background:#fff;line-height:0}
#sec-cqh-expediente .ex-embed iframe.ex-ig{display:block;width:100%;min-width:0;height:553px;border:0;background:#fff}
#sec-cqh-expediente .ex-embed .ex-embed-pie{font-size:12px;line-height:1.4;text-transform:uppercase;letter-spacing:.04em;color:var(--gris);margin:10px 0 0}
#sec-cqh-expediente .ex-embed .ex-embed-pie a{color:var(--tinta);text-decoration:underline;text-underline-offset:2px}
/* video propio dentro del cuerpo (el anuncio de Mosseri): caja con borde, vertical a 320 px de ancho (9:16), pie chico con la liga */
#sec-cqh-expediente .ex-video{margin:calc(2 * var(--ot-rem)) auto;max-width:none}   /* horizontal: todo el ancho de la columna del texto (646 px a 1440) */
#sec-cqh-expediente .ex-video h5{font-size:var(--margo-h);line-height:1;font-weight:400;text-transform:uppercase;margin:0 0 14.4px}
#sec-cqh-expediente .ex-video-caja{border:1px solid var(--linea);background:#000;padding:0}
#sec-cqh-expediente .ex-video video{display:block;width:100%;height:auto;aspect-ratio:16/9;background:#000}
#sec-cqh-expediente .ex-video--vertical{max-width:320px}
#sec-cqh-expediente .ex-video--vertical video{aspect-ratio:9/16;object-fit:cover}
#sec-cqh-expediente .ex-video .ex-embed-pie{font-size:12px;line-height:1.4;text-transform:uppercase;letter-spacing:.04em;color:var(--gris);margin:10px 0 0}
#sec-cqh-expediente .ex-video .ex-embed-pie a{color:var(--tinta);text-decoration:underline;text-underline-offset:2px}
#sec-cqh-expediente .ex-palabra--frase{font-size:clamp(2.2rem, 4.3vw, 4rem) !important;line-height:.9;text-wrap:balance;max-width:none;margin-left:auto;margin-right:auto}   /* frases largas: 62 px a 1440, tres o cuatro renglones; la palabra sola sigue en Toni xxl */
#sec-cqh-expediente .ex-palabra{font-family:"ex-Toni","ex-Margo",sans-serif;font-size:var(--toni-xxl);line-height:.88;text-transform:uppercase;color:var(--rojo-g);text-align:center;margin:calc(var(--gutter) * .6) 0 calc(var(--gutter) * .8)}

/* cuadros de las columnas laterales */
#sec-cqh-expediente .ex-cuadro{margin:0 0 calc(var(--gutter) * 1.2)}
#sec-cqh-expediente .ex-cuadro:last-child{margin-bottom:0}
#sec-cqh-expediente .ex-cuadro h5,#sec-cqh-expediente .ex-cuadro h3,#sec-cqh-expediente .ex-cuadro .ex-h{font-size:var(--margo-h);line-height:1;font-weight:400;text-transform:uppercase;margin:0 0 14.4px}
#sec-cqh-expediente .ex-cuadro ul{list-style:none;margin:0;padding:0}
#sec-cqh-expediente .ex-cuadro li{position:relative;padding-left:17.47px;font-size:var(--margo-s);line-height:1.2;margin:0 0 10px}
#sec-cqh-expediente .ex-cuadro li::before{content:"";position:absolute;left:0;top:.5em;width:7px;height:7px;background:var(--rojo)}
#sec-cqh-expediente .ex-fuentes li{padding-left:0}
#sec-cqh-expediente .ex-fuentes li::before{display:none}
#sec-cqh-expediente .ex-fuentes a{display:block;text-decoration:none;border-bottom:1px solid rgba(0,0,0,.25);padding:0 0 8px;margin:0 0 10px}
#sec-cqh-expediente .ex-fuentes a:hover{border-bottom-color:var(--rojo)}
#sec-cqh-expediente .ex-fuentes .ex-f-texto{display:block}
#sec-cqh-expediente .ex-fuentes .ex-f-dominio{display:block;font-size:12px;line-height:1.35;color:var(--gris);margin-top:3px}   /* lo que dice la liga en el texto */
#sec-cqh-expediente .ex-cuadro .ex-cita{margin:0;padding:0;text-align:left}
#sec-cqh-expediente .ex-cuadro .ex-cita p{font-size:var(--margo-xl);color:var(--rojo-g);text-align:left}
#sec-cqh-expediente .ex-grafica{text-align:center}
#sec-cqh-expediente .ex-grafica h3{font-size:24px;line-height:1.2;text-transform:none;margin:0 0 4px}
#sec-cqh-expediente .ex-grafica .ex-sub{font-size:12px;line-height:1.4;color:var(--gris);margin:0 0 16px}
#sec-cqh-expediente .ex-cuadro a{color:var(--tinta);text-decoration:underline;text-underline-offset:2px;text-decoration-thickness:1px}
#sec-cqh-expediente .ex-cuadro a:hover{color:var(--rojo)}
#sec-cqh-expediente .ex-pegajoso.ex-suelto{position:static}
#sec-cqh-expediente .ex-grafica svg{display:block;width:100%;max-width:318px;height:auto;margin:0 auto;font-family:"ex-Margo",Arial,sans-serif}
/* cuadros metidos en la columna central (vol. 2: la ficha ancha entre parrafos) */
#sec-cqh-expediente .ex-centro-cuadros{display:grid;grid-template-columns:1fr;gap:0 calc(var(--gutter) * 1.2);margin:calc(2 * var(--ot-rem)) 0;padding:calc(1.5 * var(--ot-rem)) 0 0;border-top:1px solid var(--linea);border-bottom:1px solid var(--linea)}
#sec-cqh-expediente .ex-centro-cuadros--2{grid-template-columns:1fr 1fr}
#sec-cqh-expediente .ex-centro-cuadros .ex-cuadro{margin:0 0 calc(1.5 * var(--ot-rem))}
#sec-cqh-expediente .ex-centro-cuadros--1 .ex-esquela dl{columns:2;column-gap:calc(var(--gutter) * 1.2)}
#sec-cqh-expediente .ex-esquela .ex-hito{break-inside:avoid;page-break-inside:avoid}
#sec-cqh-expediente .ex-centro-cuadros--1 .ex-esquela-nombre{font-size:56px}
#sec-cqh-expediente .ex-leyenda{list-style:none;margin:16px 0 0;padding:0;display:flex;flex-wrap:wrap;justify-content:center;gap:10px 18px}
#sec-cqh-expediente .ex-leyenda li{display:flex;align-items:center;gap:8px;font-size:16px;padding:0;margin:0}
#sec-cqh-expediente .ex-leyenda li::before{display:none}
#sec-cqh-expediente .ex-leyenda i{display:inline-block;width:24px;height:24px;flex:none}
#sec-cqh-expediente .ex-contador{text-align:left}
#sec-cqh-expediente .ex-contador-num{font-family:"ex-Toni","ex-Margo",sans-serif;font-size:clamp(44px,4vw,64px);line-height:1;color:var(--rojo-g);margin:0 0 6px;font-variant-numeric:tabular-nums}
#sec-cqh-expediente .ex-contador-de{font-size:12px;line-height:1.3;text-transform:uppercase;letter-spacing:.04em;color:var(--gris);margin:0 0 10px}
#sec-cqh-expediente .ex-contador-sub{font-size:var(--margo-s);line-height:1.2;margin:0}
#sec-cqh-expediente .ex-esquela-caja{border:1px solid var(--linea);padding:18px 18px 14px}
#sec-cqh-expediente .ex-esquela-nombre{font-family:"ex-Toni","ex-Margo",sans-serif;font-size:43.8px;line-height:1;text-transform:uppercase;margin:0 0 6px}
#sec-cqh-expediente .ex-esquela-fechas{font-size:12px;line-height:1.3;text-transform:uppercase;letter-spacing:.04em;color:var(--gris);margin:0 0 16px;padding-bottom:12px;border-bottom:1px solid var(--linea)}
#sec-cqh-expediente .ex-esquela dl{margin:0}
#sec-cqh-expediente .ex-esquela dt{font-size:12px;line-height:1.3;text-transform:uppercase;letter-spacing:.04em;color:var(--rojo);margin:0 0 2px}
#sec-cqh-expediente .ex-esquela dd{margin:0 0 12px;font-size:var(--margo-s);line-height:1.2}
#sec-cqh-expediente .ex-esquela dd:last-child{margin-bottom:0}

/* ---------- cierre ---------- */
#sec-cqh-expediente .ex-cierre{padding:calc(var(--gutter) * 1.5) calc(var(--gutter) / 2 + 20px);display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:24px}
#sec-cqh-expediente .ex-cierre .ex-firma{margin:0;font-size:var(--margo-m);line-height:1.2;max-width:520px}
#sec-cqh-expediente .ex-cierre .ex-firma:empty{display:none}
#sec-cqh-expediente .ex-cierre-der{display:flex;align-items:center;gap:24px}
#sec-cqh-expediente .ex-boton{display:inline-flex;align-items:center;gap:10px;border:1px solid var(--tinta);padding:12px 18px;font-size:var(--margo-s);line-height:1;text-transform:uppercase;text-decoration:none;white-space:nowrap}
#sec-cqh-expediente .ex-boton:hover{background:var(--tinta);color:#fff}
#sec-cqh-expediente .ex-boton svg{width:16px;height:16px}

/* ---------- celular y tableta: una columna ---------- */
@media (max-width:1025px){
  #sec-cqh-expediente .ex-cols{grid-template-columns:1fr}
  #sec-cqh-expediente .ex-col + .ex-col{border-left:0;border-top:1px solid var(--linea)}
  #sec-cqh-expediente .ex-col{padding:calc(var(--gutter) * 1.1) calc(var(--gutter) / 2 + 8px)}
  #sec-cqh-expediente .ex-centro{order:1;padding-left:calc(var(--gutter) / 2 + 8px);padding-right:calc(var(--gutter) / 2 + 8px)}
  #sec-cqh-expediente .ex-derecha{order:2}
  #sec-cqh-expediente .ex-izquierda{order:3}
  #sec-cqh-expediente .ex-pegajoso{position:static}
  #sec-cqh-expediente .ex-centro-cuadros--2{grid-template-columns:1fr}
  #sec-cqh-expediente .ex-centro-cuadros--1 .ex-esquela dl{columns:1}
  #sec-cqh-expediente .ex-centro-cuadros--1 .ex-esquela-nombre{font-size:43.8px}
  #sec-cqh-expediente .ex-lado:empty,#sec-cqh-expediente .ex-lado.ex-vacia{display:none}
  #sec-cqh-expediente .ex-cita{padding:0 8px}
  #sec-cqh-expediente .ex-indice{padding-left:calc(var(--gutter) / 2 + 4px);padding-right:calc(var(--gutter) / 2 + 4px)}
  #sec-cqh-expediente .ex-cierre{padding-left:calc(var(--gutter) / 2 + 4px);padding-right:calc(var(--gutter) / 2 + 4px);flex-direction:column;align-items:flex-start}
}
@media (max-width:767px){
  #sec-cqh-expediente .ex-cuerpo p{line-height:1.3}
  #sec-cqh-expediente .ex-cita p,#sec-cqh-expediente .ex-lead{color:var(--rojo)}   /* la cita baja de 24 px: va el rojo que pasa 4.5:1 */
  #sec-cqh-expediente .ex-cuadro .ex-cita p{color:var(--rojo)}
}
@media (prefers-reduced-motion:reduce){#sec-cqh-expediente .ex-boton{transition:none}}