@import url("https://use.typekit.net/zfd2srr.css");
/* esto es un comentario */
/*Fonts Added:

Miller Banner Extra Compressed Bold
font-family: "miller-banner-ex-compressed", sans-serif;
font-weight: 700;
font-style: normal;
Miller Banner Extra Condensed Regular
font-family: "miller-banner-ex-condensed", sans-serif;
font-weight: 400;
font-style: normal;

font-family: "figtree", sans-serif;
font-weight: 600;
font-style: normal;

Noto Sans Regular
font-family: "noto-sans", sans-serif;
font-weight: 400;
font-style: normal;
Noto Sans Medium
font-family: "noto-sans", sans-serif;
font-weight: 500;
font-style: normal;
Noto Sans Bold
font-family: "noto-sans", sans-serif;
font-weight: 700;
font-style: normal;

Noto Sans Display SemiBold
font-family: "noto-sans-display", sans-serif;
font-weight: 600;
font-style: normal;
*/

/* Reset básico ampliado */
html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, embed, figure, figcaption, footer, header, hgroup, main, menu, nav, output, ruby, section, summary, time, mark, audio, video {margin: 0; padding: 0; border: 0; font-size: 100%; font: inherit; vertical-align: baseline; box-sizing: border-box;}
html {box-sizing: border-box;}
*, *::before, *::after {box-sizing: inherit;}
body {margin: 0; padding: 0; line-height: 1; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale;}
ol, ul {list-style: none;}
table {border-collapse: collapse; border-spacing: 0;}

/* reset wordpress */
body .vc_column_container>.vc_column-inner{margin: 0; padding-left: 0; padding-right: 0;}
body .vc_row{margin: 0; padding: 0;}
body [class*='col-'] {padding-right: 0;margin: 0;}
body .v-h {margin-bottom: 0;}
body .wpb_button, .wpb_content_element, ul.wpb_thumbnails-fluid>li {margin-bottom: 0;}

/* 2025 */

/* =========================================
   INTRO LOADER + CINTILLO
   ========================================= */
:root {
    --as-cintillo-h: 60px;
    --as-cintillo-bg: #ffffff;
    --asc-white       : #ffffff;
    --asc-off-white   : #f4f1eb;
    --asc-overlay-tint: rgba(112, 119, 90, 0.39);

    /* Font sizes scaled to viewport width */
    --asc-fs-headline : clamp(28px, 4.3vw, 90px);
    --asc-fs-desc     : clamp(13px, 1.25vw,   24px);
    --asc-fs-author   : clamp(11px, 1vw,      16px);
    --asc-fs-label    : clamp(9px,  0.875vw,  14px);
    --asc-fs-small    : clamp(8px,  0.75vw,   12px);
    
    /* PORTADA */
    
     /* --- Fuentes editoriales (titulares) ---
       En el diseño original se usa "Scotch Display" / "Scotch Display Condensed" (de pago).
       Cuando esté disponible, sustituir el valor de estas variables. */
    --tm-font-display: "scotch-display-condensed", "Scotch Display", "Scotch Display Condensed", serif;
    --tm-font-display-strong: "scotch-display-compressed","miller-banner-ex-compressed", "Scotch Display", serif;

    /* --- Fuentes utilitarias --- */
    --tm-font-sans: "noto-sans", sans-serif;
    --tm-font-sans-display: "noto-sans-display", sans-serif;
    --tm-font-figtree: "figtree", sans-serif;

    /* --- Paleta --- */
    --tm-color-bg: #fff;
    --tm-color-text: #202020;
    --tm-color-text-muted: #797979;
    --tm-color-text-soft: #4f4f4f;
    --tm-color-text-light: #a49e9e;
    --tm-color-white: #fff;
    --tm-color-black: #000;

    /* Verdes / militares de marca */
    --tm-color-brand: #70775a;          /* verde principal (CTA activo, hover, tag) */
    --tm-color-brand-dark: #5d6349;      /* verde hover */
    --tm-color-brand-darker: #4f553f;    /* verde logo footer */
    --tm-color-brand-darkest: #494d3f;   /* verde encuesta seleccionado */
    --tm-color-brand-overlay: #666b55;   /* multiply del hero */
    --tm-color-brand-overlay-rgba: rgba(77, 78, 72, 0.55);

    /* Beige / arena */
    --tm-color-cream: #f5ecc8;
    --tm-color-cream-light: #fff7d6;
    --tm-color-cream-soft: #f4f1eb;

    /* Acento extra */
    --tm-color-accent: #007298;
    --tm-color-cta-idle: #b6b6b0;

    /* Bordes / hairlines */
    --tm-color-border: #d8d8d8;
    --tm-color-border-soft: #e5e5e5;
    --tm-color-placeholder: #ddd;

    /* --- Tamaños de fuente recurrentes (clamps responsive) --- */
    --tm-fs-meta: clamp(11px, 1vw, 12px);          /* meta, caption, author chico */
    --tm-fs-author: clamp(14px, 1.4vw, 16px);
    --tm-fs-small: clamp(12px, 1vw, 13px);
    --tm-fs-body: clamp(13px, 1.2vw, 16px);        /* subtítulos, side-text */
    --tm-fs-body-lg: clamp(15px, 1.3vw, 18px);     /* párrafo footer */
    --tm-fs-h-strip: clamp(15px, 1.4vw, 25px);     /* títulos strip hero */
    --tm-fs-h-side: clamp(22px, 1.8vw, 22px);
    --tm-fs-h-card: clamp(24px, 2.4vw, 28px);
    --tm-fs-h-grid: clamp(26px, 1.9vw, 40px);
    --tm-fs-h-hero: clamp(40px, 4.5vw, 90px);
    --tm-fs-h-poll: clamp(28px, 4vw, 51px);
    --tm-fs-h-logo: clamp(20px, 2.4vw, 28px);
    --tm-fs-h-logo-footer: clamp(28px, 3.4vw, 44px);

    /* --- Layout --- */
    --tm-max-width: 1840px;
    --tm-max-width-narrow: 1280px;
    --tm-max-width-narrow-step-5: 750px;
    --tm-section-pad-y: clamp(40px, 6vw, 80px);

    /* --- Radios --- */
    --tm-radius-sm: 5px;
    --tm-radius-md: 10px;
    --tm-radius-lg: 16px;
    --tm-radius-xl: 18px;
    --tm-radius-pill: 999px;

    /* --- Transiciones --- */
    --tm-transition: 0.25s ease;
}
@media screen and (min-width: 600px) {
    :root { --as-cintillo-h: 80px; }
}

/* Cintillo: arranca como overlay full-viewport (loader) y se contrae a la
   altura final cuando termina la carga. Es el MISMO elemento, sin saltos.
   El bloqueo de scroll lo gestiona el JS (overflow:hidden en ). */
.as-cintillo {position: relative; top: 0; left: 0; right: 0;height: calc(100vh - 50px);background: var(--as-cintillo-bg);z-index: 1000;overflow: hidden;box-sizing: border-box;}
/* Imagen de fondo: tamaño fijo del viewport, así se mantiene encuadre continuo
   tanto cuando el contenedor mide 100vh como cuando se contrae a 80px. */
.as-cintillo__bg {position: absolute; top: 0; left: 0;width: 100vw; height: 100vh;object-fit: cover;object-position: center;pointer-events: none;z-index: 0;}
/* Capa azul translúcida (solo durante la carga). JS la fade-outea. */
.as-cintillo__overlay {position: absolute; inset: 0;background: none;z-index: 1;pointer-events: none;}
/* Porcentaje de carga - bottom-right */
.as-cintillo__percent {position: absolute;right: 16px;bottom: 16px;color: #70775A;font-family: "scotch-display-compressed", serif;font-weight: 400;font-size: clamp(64px, 8vw, 140px);line-height: 1;letter-spacing: -0.01em;z-index: 3;display: flex;align-items: baseline;gap: 2px;}
.as-cintillo__sym { font-size: 0.7em; }

/* Logos: posicionados absolute. JS los anima desde la posición de loader
   (as bottom-left grande) hacia su posición final en el cintillo. */
.as-cintillo__logo-as {position: absolute;left: 16px;bottom:16px;height: 14px;width: auto;z-index: 3;display: block;}
.as-cintillo__cliente {position: absolute;right: 16px;top: 50%;transform: translateY(-50%);display: flex;flex-direction: row;align-items: center;gap: 6px;z-index: 3;opacity: 0;}
.as-cintillo__cliente p {font-family: "noto-sans", sans-serif;font-weight: 400;font-size: 6px;line-height: 1;color: #70775A;text-transform: uppercase;letter-spacing: 0.5px;margin: 0;white-space: nowrap;}
.as-cintillo__logo-cliente {height: 14px;width: auto;display: block;}

@media screen and (min-width: 601px) {
    .as-cintillo {height: calc(100vh - 60px);}
    .as-cintillo__percent { right: 28px; bottom: 24px; }
    .as-cintillo__logo-as { left: 28px; bottom: 24px; height: 28px; }
    .as-cintillo__cliente { right: 28px; gap: 10px; }
    .as-cintillo__cliente p { font-size: 10px; letter-spacing: 1px; }
    .as-cintillo__logo-cliente { height: 28px; }
}

body #cintillo{position: sticky; top: 48px;z-index: 100;}
@media screen and (min-width: 700px) {
   body #cintillo{top: 55px}
}

/* =========================================
   /INTRO LOADER + CINTILLO
   ========================================= */

.spacer-test {height: 200vh; background-color: #bfbdbd;}

/*proyecto */
.terrenomental {width: 100vw;}
.bg-azul {background-color: #0B0F2E; width: 100%; display: flex; flex-direction: column; justify-content: center; align-items: center;}
.bg-blanco {background-color: #fff; width: 100%; display: flex; flex-direction: column; justify-content: center; align-items: center;}
/* spacers */
.spacer-xs {height: 18px;}
.spacer-s {height: 32px;}
.spacer-m {height: 64px;}
.spacer-l {height: 140px;}
.spacer-xl {height: 200px;}
.spacer-xxl {height: 280px;}

@media screen and (min-width: 1024px) {
    .spacer-xs {height: 24px;}
    .spacer-s {height: 48px;}
    .spacer-m {height: 100px;}
    .spacer-l {height: 240px;}
    .spacer-xl {height: 320px;}
    .spacer-xxl {height: 400px;}
}

/* TEXTOS GENERALES */
/* normalmente habra un hero-title , un titulo, uno o dos subtitulos, parrafo entradilla, un parrafo para el articulo, pies de foto y un blockquote. (Si hay algun parrafo especial irá dentro de la seccion correspondiente.) */
/* siempre van dentro del padre texto-container que le mete el flex-column y el justify-center y align-center y el padding de mobile. los textos iran con un max-width cada uno y un width del 100% */

/* Textos nuevos */
.texto-container {width: 100%; box-sizing: border-box; padding: 0 12px; display: flex; flex-direction: column; justify-content: center; align-items: center;}
body .noticia .as-title {font-family:  "scotch-display-compressed", serif;font-weight: 700;font-style: normal;color: #4D533A;text-transform: none;font-size: clamp(39px, 5vw, 81px);line-height: 1;width: 100%;max-width: 847px;margin-bottom: 24px;}
body .noticia .as-title-video {font-family:  "scotch-display-compressed", serif;font-weight: 700;font-style: normal;color: #4D533A;text-transform: none;font-size: clamp(39px, 5vw, 81px);line-height: 1;width: 100%;max-width: 847px;margin-bottom: 24px;text-align: center;}
body .noticia .as-antetitle {font-family: "noto-sans", sans-serif;font-weight: 400;font-style: normal;color: #70775A;text-transform: uppercase;letter-spacing: 2px;font-size: clamp(12px, 1.2vw, 14px);margin-bottom: 16px; width: 100%; max-width: 847px;}
body .noticia .as-antetitle-video {font-family: "noto-sans", sans-serif;font-weight: 400;font-style: normal;color: #70775A;text-transform: uppercase;letter-spacing: 2px;font-size: clamp(12px, 1.2vw, 14px);margin-bottom: 16px; width: 100%; max-width: 847px;text-align: center;}
body .noticia .as-entradilla {font-family: "noto-sans", sans-serif; font-weight: 400;font-style: normal;color: #202020;font-size: clamp(18px, 1.8vw, 25px);line-height: 1.34;letter-spacing: normal;width: 100%;max-width: 847px;margin: 0 auto;text-align: left; margin-bottom: 42px;}
body .noticia .as-proyecto-con {font-size: clamp(12px, 2vw, 16px); font-weight: 400; color: #70775A; text-align: center; text-transform: uppercase; letter-spacing: 2px; font-family: "Forum", serif; margin-bottom: 12px;}
body .noticia .as-piefoto {font-family: "noto-sans", sans-serif;font-weight: 400;color: #797979;font-size: clamp(12px, 1vw, 14px);text-align: right;margin-top: 8px;margin-bottom: 0;width: 100%;}
body .noticia .parrafocount {font-family: "noto-sans", sans-serif; font-weight: 400; font-style: normal; color: #000; font-size: clamp(18px, 2vw, 21px); line-height: 1.4; width: 100%; max-width: 620px; box-sizing: border-box; padding: 0 12px; margin: 0 auto 24px;}
body .noticia .parrafocount.first-letter::first-letter {    font-family: "scotch-display-compressed", serif;font-weight: 400;font-style: normal;font-size: clamp(64px, 25vw, 240px);line-height: 0;float: left;padding-right: 8px;padding-top: 4px;color: #000;padding-bottom: clamp(32px, 10vw, 100px);}
body .noticia .parrafocount.reference{color:#797979; font-style:italic;}
/* =========================================
   TEXTOS GENERALES (base original - consistencia con resto del proyecto)
   ========================================= */
body .noticia .gc-title {font-family: "miller-banner-ex-compressed", sans-serif; font-weight: 700; font-style: normal; color: #000; text-transform: none; text-align: center; font-size: clamp(39px, 5vw, 81px); line-height: 1.1; width: 100%; max-width: 847px; margin-bottom: 34px;}
body .noticia .gc-antetitle {font-family: "noto-sans", sans-serif; font-weight: 400; font-style: normal; color: #007298; text-transform: uppercase; letter-spacing: 2px; font-size: clamp(12px, 1.2vw, 14px); text-align: center; margin-bottom: 16px;}
body .noticia .gc-entradilla {font-family: "figtree", sans-serif; font-weight: 600; font-style: normal; color: #000; font-size: clamp(18px, 1.8vw, 26px); line-height: 1.3; letter-spacing: normal; width: 100%; max-width: 715px; margin: 0 auto; text-align: left;}
body .noticia .gc-parrafo {font-size: clamp(16px, 2vw, 21px); font-weight: 100; font-family: "noto-sans", sans-serif; margin-bottom: 12px; line-height: 1.2; max-width: 658px;}
body .noticia .gc-parrafo.blanco {color: #fff;}
body .noticia .gc-parrafo.negro {color: #000;}
/* body .noticia .gc-piefoto {font-family: "noto-sans", sans-serif; font-weight: 400; color: #797979; font-size: clamp(12px, 1vw, 14px); text-align: right; margin-top: 8px; margin-bottom: 0; width: 100%;} */
body .noticia .gc-subtitle {font-size: clamp(32px, 2vw, 48px); font-weight: 100; font-family: "noto-sans", sans-serif; margin-bottom: 12px; line-height: 1.2; width: 100%; color: #000;}
body .noticia .gc-subtitle-2 {font-size: clamp(28px, 2vw, 44px); font-weight: 100; font-family: "noto-sans", sans-serif; margin-bottom: 12px; line-height: 1.2; width: 100%; color: #000;}
/* text editor */
.wpb_text_column .wpb_wrapper p{font-family: "noto-sans", sans-serif; font-weight: 400; font-style: normal; color: #000; font-size: clamp(18px, 2vw, 21px); line-height: 1.4; width: 100%; max-width: 620px; box-sizing: border-box; padding: 0 12px; margin: 0 auto 24px;}
.wpb_text_column.first-letter .wpb_wrapper p:first-child::first-letter {   font-family: "scotch-display-compressed", serif;font-weight: 400;font-style: normal;font-size: clamp(64px, 25vw, 240px);line-height: 0;float: left;padding-right: 8px;padding-top: 4px;color: #000;padding-bottom: clamp(32px, 10vw, 100px);}
.wpb_text_column .wpb_wrapper h2{font-family: "scotch-display-compressed", serif;font-weight: 400;font-style: normal;color: #000;font-size: clamp(34px, 3.8vw, 42px);line-height: 1.15;text-align: left;width: 100%;max-width: 620px;margin: 24px auto 12px;padding: 0 12px;}
.wpb_text_column .wpb_wrapper h3{font-family: "scotch-display-compressed", serif;font-weight: 400;font-style: normal;color: #000;font-size: clamp(34px, 3.8vw, 42px);line-height: 1.2;text-align: left;width: 100%;max-width: 620px;margin: 24px auto 12px;padding: 0 12px;}


/* fin textos nuevos */

/*imagen individual*/
body .imgarticle {max-width: 920px;margin: auto;border-radius: 30px;margin: 48px auto; padding: 0 12px;}
body .imgarticle img {width: 100%;height: auto;border-radius: 30px;display: block;object-fit: cover;}
body .noticia .imgarticle figcaption { width: 100%; margin-top: 10px;}
body .noticia .imgarticle figcaption .parrafocount {font-family: "noto-sans", sans-serif; font-weight: 400; color: #797979; width: 100%; max-width: none; padding: 0 24px; text-align: inherit; text-align: end; font-size: clamp(12px, 1vw, 14px);}
@media screen and (min-width: 1024px) {
    body .imgarticle {margin: 84px auto;}
}
/* step-text */
.step-text {width: 100%; display: flex; flex-direction: column; align-items: center; justify-content: center;}

/* =========================================
   as-header-1
   ========================================= */
   .as-header-1 {width: 100%;padding: 0 12px;margin-bottom: 54px;margin-top: 84px; display: flex;flex-direction: column;align-items: center;justify-content: center;box-sizing: border-box;}
   .as-header-1__figure {width: 100%;max-width: 1121px;margin: 0 auto 16px;display: flex;flex-direction: column;}
   .as-header-1__figure img {width: 100%;height: auto;border-radius: 20px;display: block;object-fit: cover;}
   .as-header-1__meta {width: 100%;max-width: 1050px;display: flex;flex-direction: row;justify-content: space-between;align-items: center;gap: 30px;margin: 24px 0 32px;flex-wrap: wrap;}
   .as-header-1__firma {display: flex;flex-direction: row;align-items: center;gap: 24px;}
   .as-header-1__autor {width: 54px;height: 54px;border-radius: 50%;object-fit: cover;flex-shrink: 0;}
   .as-header-1__datos {display: flex;flex-direction: column;justify-content: center;gap: 12px;}
   .as-header-1__nombre {font-family: "noto-sans", sans-serif;font-weight: 700;font-size: 14px;color: #000;line-height: 1.2;}
   .as-header-1__fecha {font-family: "noto-sans-display", sans-serif;font-weight: 400;font-size: 12px;color: #797979;line-height: 1.2;}
   .as-header-1__compartir {display: flex;flex-direction: row;align-items: center;gap: 12px;}
   .as-header-1__compartir p {font-family: "noto-sans", sans-serif;font-weight: 400;font-size: 13px;color: #000;margin: 0;}
   .as-header-1__compartir a {display: inline-flex;align-items: center;justify-content: center;transition: opacity 0.2s ease;}
   .as-header-1__compartir a:hover {opacity: 0.7;}
   .as-header-1__compartir img {width: 14px;height: 14px;display: block;}
   .divider {width: 1px;height: stretch;background: #E7EBF1;}
   
   @media screen and (min-width: 601px) {
       .as-header-1 {margin-bottom: 120px;}
       .as-header-1__figure img {border-radius: 30px;}
       .as-header-1__meta {flex-direction: row;align-items: center;}
   }
   
   @media screen and (min-width: 1024px) {
       .as-header-1 {margin-bottom: 190px;}
       .as-header-1__autor {width: 88px;height: 88px;}
       .as-header-1__nombre {font-size: 15px;}
   }


/* gc-header-1 variante con video (iframe Brightcove) */
/* Sin overflow:hidden para que el iframe pueda escapar con position:fixed.
   El border-radius lo aplicamos directamente al iframe (lo respeta). */
.as-header-1__figure--video {max-width: 1121px;}
.as-header-1__video {width: 100%;aspect-ratio: 16 / 9;border-radius: 20px;display: block;background: #000;position: relative;}
.as-header-1__video iframe {width: 100%;height: 100%;border: 0;display: block;border-radius: inherit;}
@media screen and (min-width: 601px) {
    .as-header-1__video {border-radius: 30px;}
}

/* =========================================
   video-cont (widget flotante donde aterriza el iframe del header)
   + video-overlay (modal legacy)
   ========================================= */
.video-cont {position: fixed;display: flex;left: 15px;bottom: 15px;width: 60px;height: 60px;justify-content: center;align-items: center;z-index: 4;background-color: #E7EBF1;border-radius: 20px;padding: 8px;gap: 15px;box-sizing: content-box;cursor: pointer;}
.video-cont .imgvideo {max-width: 120px;display: none;border-radius: 20px;aspect-ratio: 16 / 9;}
.video-cont .right {display: flex;flex-direction: column;justify-content: center;align-items: center;height: 100%;padding-right: 0;}
.video-cont .right img {width: 56px;height: 56px;align-self: center;cursor: pointer;box-sizing: content-box;}
.video-cont .right p {font: 400 15px/19px "noto-sans", sans-serif;color: #070505;display: none;text-transform: uppercase;}

@media screen and (min-width: 415px) {
    .video-cont {flex-direction: row;width: 370px;height: 150px;justify-content: space-between;align-items: center;}
    .video-cont .imgvideo {max-width: 245px;border-radius: 16px;display: inline;height: 100%;object-fit: cover;aspect-ratio: 16 / 9;}
    .video-cont .right {flex-direction: column;justify-content: space-around;padding-right: 15px;}
    .video-cont .right img {display: inline;align-self: flex-end;}
    .video-cont .right p {display: inline;}
}

/* Backdrop: solo el fondo oscuro con blur. Por debajo del iframe. */
.video-overlay-backdrop {position: fixed;inset: 0;display: none;z-index: 99998;background: rgba(0, 0, 0, 0.7);backdrop-filter: blur(6px);pointer-events: auto;}

/* Container del modal: transparente, solo aloja el close-btn. Por encima del iframe. */
.video-overlay {position: fixed;inset: 0;display: none;z-index: 1000000;justify-content: center;align-items: center;pointer-events: none;}
.video-overlay .wrapper-ces {width: 98%;height: 60%;position: relative;pointer-events: none;}
.video-overlay .wrapper-ces .close-btn-ces {position: absolute;cursor: pointer;top: 10px;left: 0;right: 0;background-color: rgb(42, 41, 40);max-width: 80px;margin: 0 auto;border-radius: 20px;color: #fff;padding: 5px 10px;border: 0;text-align: center;width: auto;pointer-events: auto;}

@media screen and (min-width: 720px) {
    .video-overlay .wrapper-ces {height: 95%;}
}

/* =========================================
   quote-highlight
   ========================================= */
.quote-highlight {width: 100%;padding: 12px;display: flex;flex-direction: column;align-items: center;justify-content: center;box-sizing: border-box;margin: 48px auto 32px;}
.quote-highlight .highlight {font-family:  "scotch-display-compressed", serif;font-weight: 700;font-style: normal;color: #D2D2D2;font-size: clamp(40px, 4.5vw, 54px);line-height: 1.15;text-align: left;width: 100%;max-width: 960px;margin: 0 auto;}
.quote-highlight .quote-name {font-family:  "scotch-display-compressed", serif;font-weight: 700;font-style: normal;color: #000;font-size: clamp(16px, 2vw, 26px);line-height: 1.2;text-align: left;width: 100%;max-width: 960px;margin: 24px auto 0;}



/* ── FOOTER Section ───────────────────────────────────── */
.tf-footer {
  position: relative;
  width: 100%;
  min-height: 80vh;
  border-radius: 30px 30px 0 0;
  overflow: hidden;
  margin-top: 120px;
  display: flex;
  align-items: center;
}

/* ── Background photo + gradient overlay ──────── */
.tf-footer__bg {
  position: absolute;
  inset: 0;
  z-index: 0;
}

.tf-footer__bg-img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center top;
  display: block;
}

.tf-footer__bg-gradient {
  position: absolute;
  inset: 0;
}

/* ── Inner layout ──────────────────────────────── */
.tf-footer__inner {
  position: relative;
  z-index: 1;
  display: flex;
  align-items: flex-start;
  gap: 14%;
  padding: 80px 6% 80px 6%;
  max-width: 1600px;
  margin: 0 auto;
  align-items: center;
}

/* ── Left column ───────────────────────────────── */
/*ajustes para el footer sin rels */
.no-rel{display: none;}
/*ajustes para el footer sin rels */
.tf-footer__left {
  flex: 0 0 42%;
}

.tf-footer__related-label {
  font-family: "noto-sans", sans-serif;
  font-size: 21px;
  font-weight: 400;
  letter-spacing: 0.08em;
  color: #70775A;
  text-transform: uppercase;
  margin-bottom: 14px;
}

.tf-footer__divider {
  width: 100%;
  height: 1px;
  background: #70775A;
  margin-bottom: 28px;
  transform-origin: left center;
}

.tf-footer__cards {
  display: flex;
  flex-direction: column;
  gap: 14px;
}

/* ── Card ──────────────────────────────────────── */
.tf-footer__card {
  display: flex;
  align-items: stretch;
  background: #70775A9C;
  backdrop-filter: blur(5.5px);
  -webkit-backdrop-filter: blur(5.5px);
  border-radius: 30px;
  overflow: hidden;
  text-decoration: none;
  transition: background 0.3s ease;
}

.tf-footer__card:hover {
  background: #70775A6B;
}

.tf-footer__card-thumb {
  flex: 0 0 147px;
  width: 147px;
  min-height: 157px;
  overflow: hidden;
}

.tf-footer__card-thumb img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
  display: block;
  border-radius: 30px;
}

.tf-footer__card-body {
  flex: 1;
  padding: 18px 12px 18px 20px;
  display: flex;
  flex-direction: column;
  justify-content: center;
  gap: 8px;
}

.tf-footer__card-label {
  font-family: "noto-sans", sans-serif;
  font-size: 13px;
  font-weight: 500;
  color: rgba(255, 255, 255, 0.62);
  text-transform: uppercase;
  letter-spacing: 0.05em;
  display: block;
}

.tf-footer__card-title {
  font-family: "noto-sans", sans-serif;
  font-size: 19px;
  font-weight: 500;
  color: white;
  line-height: 1.42;
}

.tf-footer__card-arrow {
  flex: 0 0 auto;
  display: flex;
  align-items: flex-end;
  padding: 18px 20px 22px 8px;
  opacity: 0.7;
}

/* ── Right column ──────────────────────────────── */
.tf-footer__right {
  display: flex;
  align-items: flex-start;
  flex-direction: column;
  flex: 1;
  padding-top: 4px;
}

.tf-footer__logo {
  width: 220px;
  margin-bottom: 28px;
}

.tf-footer__logo img {
  width: 100%;
  height: auto;
  display: block;
}

.tf-footer__text {
  font-family: "noto-sans", sans-serif;
  font-size: 21px;
  font-weight: 400;
  color: #70775A;
  line-height: 1.67;
  margin-bottom: 40px;
  text-align: left;
  max-width: 650px;
}

/* ── CTA button ────────────────────────────────── */
.tf-footer__cta {
  display: inline-flex;
  align-items: center;
  gap: 14px;
  background: rgba(85, 81, 69, 0.28);
  backdrop-filter: blur(5.5px);
  -webkit-backdrop-filter: blur(5.5px);
  border: 1px solid rgba(177, 177, 177, 0.6);
  border-radius: 50px;
  padding: 14px 18px 14px 28px;
  text-decoration: none;
  transition: background 0.3s ease, border-color 0.3s ease;
}

.tf-footer__cta:hover {
  background: rgba(85, 81, 69, 0.5);
  border-color: rgba(255, 255, 255, 0.8);
}

.tf-footer__cta span {
  font-family: "noto-sans", sans-serif;
  font-size: 21px;
  font-weight: 700;
  color: white;
  letter-spacing: 0.02em;
  text-transform: uppercase;
}

.tf-footer__cta-icon {
  width: 34px;
  height: 34px;
  border-radius: 50%;
  background: rgba(255, 255, 255, 0.2);
  display: flex;
  align-items: center;
  justify-content: center;
}

/* ── Responsive ────────────────────────────────── */
@media (max-width: 900px) {
  .tf-footer {
    margin-top: 54px;
  }
  .tf-footer__inner {
    flex-direction: column;
    gap: 48px;
    padding: 60px 6%;
  }

  .tf-footer__left {
    flex: none;
    width: 100%;
  }

  .tf-footer__card-title {
    font-size: 16px;
  }

  .tf-footer__text {
    font-size: 17px;
  }
}

@media (max-width: 560px) {
  .tf-footer__card-thumb {
    flex: 0 0 110px;
    width: 110px;
    min-height: 130px;
  }

  .tf-footer__cta span {
    font-size: 17px;
  }
}

.tf-footer__cta-icon svg{
	display:none;
}
.tf-footer__cta-icon::after {
    content: url(/contentfactory/post/wp-content/uploads/2026/06/caixaarrow.svg);
}

/* ── END FOOTER ────────────────────────────────── */

/* HERO CESAR */ 


/* ---- Reset ---- */
.hero-abc-page *,
.hero-abc-page *::before,
.hero-abc-page *::after {
  box-sizing: border-box;
  margin: 0;
  padding: 0;
}


.hero-abc-page {
  font-family: "noto-sans", sans-serif;
  background: #ffffff;
  width: 100vw;
  height: 100vh;
  overflow: hidden;
  display: flex;
  flex-direction: column;
}

/* =============================================
   HERO — Full viewport section
   ============================================= */
.hero-abc__hero {
  flex: 1;
  width: 100%;
  overflow: hidden;
  display: flex;
  border-radius: 0 0 28px 28px;
}

.hero-abc__card {
  display: flex;
  width: 100%;
  height: 100%;
  /* sin overflow hidden para que el panel derecho pueda asomarse bajo la curva */
  overflow: visible;
}

/* =============================================
   LEFT — Image panel
   ============================================= */
.hero-abc__image-panel {
  position: relative;
  flex: 0 0 46%;
  overflow: hidden;
  /* redondeado solo en la esquina inferior-derecha: curva hacia el panel derecho */
  border-radius: 0 0 36px 0;
  z-index: 2;
}

.hero-abc__photo {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
  transform-origin: center center;
}

.hero-abc__caption {
  position: absolute;
  bottom: 20px;
  left: 20px;
  right: 20px;
  color: rgba(255, 255, 255, 0.85);
  font-size: 12px;
  font-weight: 400;
  text-shadow: 0 1px 6px rgba(0, 0, 0, 0.6);
  pointer-events: none;
  text-align: right;
}

/* =============================================
   RIGHT — Content panel
   ============================================= */
.hero-abc__content-panel {
  flex: 1;
  position: relative;
  background: linear-gradient(
    170deg,
    rgba(20, 195, 220, 0.6) 0%,
    rgba(8, 110, 110, 0.85) 30%,
    rgba(4, 72, 68, 0.97) 60%,
    #022b26 100%
  ),
  url('./assets/mask-img.png') center / cover no-repeat;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  /* se mete 36px bajo el borde redondeado del panel izquierdo */
  margin-left: -36px;
  padding: 52px 44px 44px calc(44px + 36px);
  z-index: 1;
  /* redondeado solo en la esquina inferior-derecha: esquina exterior del hero */
  border-radius: 0 0 28px 0;
}

/* Sponsor — top right */
.hero-abc__sponsor {
  position: absolute;
  top: 18px;
  right: 20px;
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  gap: 5px;
}

.hero-abc__sponsor-label {
  font-size: 10px;
  font-weight: 700;
  color: rgba(255, 255, 255, 0.75);
  text-transform: uppercase;
  letter-spacing: 0.1em;
}

.hero-abc__sponsor-logo {
  height: 32px;
  width: auto;
  object-fit: contain;
  opacity: 0.88;
}

/* Content inner */
.hero-abc__content-inner {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 22px;
  width: 100%;
  max-width: 480px;
}

.hero-abc__category {
  font-size: 14px;
  font-weight: 700;
  color: rgba(255, 255, 255, 0.9);
  text-transform: uppercase;
  letter-spacing: 0.12em;
  margin-bottom: 12px;
  font-family: "noto-sans", sans-serif;
}

.hero-abc__title {
  font-family: 'Playfair Display', Georgia, serif;
  font-size: clamp(26px, 3.2vw, 50px);
  font-weight: 900;
  font-style: italic;
  line-height: 1.08;
  color: #ffffff;
  text-align: center;
}

/* GSAP split text lines need overflow hidden */
.hero-abc__title .line {
  overflow: hidden;
}

/* Share bar */
.hero-abc__share {
  display: flex;
  align-items: center;
  gap: 10px;
}

.hero-abc__share-label {
  font-size: 12px;
  color: rgba(255, 255, 255, 0.8);
  font-weight: 400;
}

.hero-abc__share-divider {
  width: 1px;
  height: 16px;
  background: rgba(255, 255, 255, 0.35);
  display: block;
  flex-shrink: 0;
}

.hero-abc__share-icon {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 22px;
  height: 22px;
}

.hero-abc__share-icon img {
  width: 100%;
  height: 100%;
  object-fit: contain;
}

/* Subtitle */
.hero-abc__subtitle {
  font-size: 14px;
  line-height: 1.65;
  color: rgba(255, 255, 255, 0.85);
  text-align: center;
  font-weight: 400;
}

/* Author */
.hero-abc__author {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 10px;
  margin-top: 4px;
}

.hero-abc__author-avatar {
  width: 64px;
  height: 64px;
  border-radius: 50%;
  object-fit: cover;
  border: 2.5px solid rgba(255, 255, 255, 0.3);
}

.hero-abc__author-name {
  font-size: 14px;
  font-weight: 700;
  color: #ffffff;
  letter-spacing: 0.01em;
}

/* =============================================
   RESPONSIVE — mobile stack
   ============================================= */
@media (max-width: 900px) {
  .hero-abc-page {
    height: auto;
    min-height: 100vh;
    overflow: auto;
  }

  .hero-abc__hero {
    flex: unset;
    height: calc(100svh - 61px);
  }

  .hero-abc__card {
    flex-direction: column;
    border-radius: 0;
  }

  .hero-abc__image-panel {
    flex: 0 0 45%;
    border-radius: 0;
  }

  .hero-abc__content-panel {
    padding: 36px 24px;
  }

  .hero-abc__title {
    font-size: clamp(24px, 5vw, 36px);
  }
}

@media (max-width: 500px) {
  .hero-abc__nav {
    padding: 0 14px;
  }

  .hero-abc__logo-text {
    font-size: 28px;
  }

  .hero-abc__btn--outline {
    min-width: auto;
  }

  .hero-abc__content-panel {
    padding: 28px 18px;
  }

  .hero-abc__title {
    font-size: 24px;
  }
}

/* END HERO CESAR */

/* SLIDER CESAR */

   /* ═════════════════════════════════════════════════════
		STEP 7 — JORNADA 29
		═════════════════════════════════════════════════════ */
      .step-7 {
        position: relative;
        /* padding: clamp(40px, 6vw, 100px) var(--side-pad) clamp(30px, 5vw, 80px); */
        background: #fff;
        overflow: hidden;
        padding: 100px 60px 100px 60px;
      }

      .jornada-bg-texture {
        position: absolute;
        display: none;
        inset: 0;
        background-image: url("https://abc.es/contentfactory/post/wp-content/uploads/2026/03/colorbrushes-scaled.webp");
        background-size: contain;
        background-position: center;
        background-repeat: no-repeat;
        /* mix-blend-mode: overlay; */
        opacity: 1;
        pointer-events: none;
      }

      html .noticia .jornada-content {
        position: relative;
        z-index: 2;
        max-width: 1570px;
        margin: 0 auto;
      }

      html .noticia .jornada-header {
        display: flex;
        justify-content: space-between;
        align-items: flex-start;
        margin-bottom: 10px;
        flex-wrap: wrap;
        gap: 20px;
      }

      html .noticia .jornada-title {
        font-family: "LALIGA Headline", "Bebas Neue", sans-serif;
        font-size: clamp(80px, 14vw, 210px);
        text-transform: uppercase;
        color: var(--black);
        line-height: 0.9;
        margin-bottom: 0px !important;
      }

      .jornada-badge {
        display: flex;
        flex-direction: column;
        align-items: flex-end;
        gap: 10px;
      }

      .jornada-vs {
        font-family: "Bebas Neue", sans-serif;
        font-size: 24px;
        color: var(--black);
        background: var(--white);
        padding: 4px 12px;
        border-radius: 4px;
        letter-spacing: 2px;
      }

      .jornada-laliga {
        display: flex;
        align-items: center;
        gap: 8px;
      }

      .jornada-laliga img {
        flex-shrink: 0;
      }

      .laliga-logo {
        height: 30px;
        max-width: 80px;
        width: auto;
        object-fit: contain;
      }

      .laliga-text {
        height: 20px;
        max-width: 100px;
        width: auto;
        object-fit: contain;
      }

      .jornada-description {
        font-size: clamp(16px, 1.8vw, 21px);
        line-height: 1.4;
        color: var(--black);
        max-width: min(450px, 100%);
        margin-bottom: clamp(20px, 3vw, 40px);
      }

      /* Swiper jornada carousel */
      .jornada-gallery-wrap {
        position: relative;
        margin-bottom: 20px;
      }

      .jornada-gallery.swiper {
        width: 100%;
        overflow: visible;
      }

      html .jornada-gallery.swiper,
      html .jornada-gallery.swiper-material {
        height: clamp(250px, 40vw, 500px);
      }

      .jornada-gallery .swiper-wrapper,
      .jornada-gallery .swiper-slide,
      .jornada-gallery .swiper-material-wrapper,
      .jornada-gallery .swiper-material-content {
        height: 100%;
      }

      .jornada-gallery .swiper-material-content {
        position: relative;
        overflow: hidden;
        border-radius: 30px;
      }

      .jornada-slide-img {
        position: absolute;
        left: 0;
        top: 0;
        width: 100%;
        height: 100%;
        object-fit: cover;
        object-position: center;
        display: block;
        border-radius: var(--swiper-material-slide-border-radius);
      }

      .jornada-event {
        margin-top: -40px;
        margin-left: auto;
        margin-bottom: 40px;
        width: 20%;
        max-width: 290px;
      }

      .jornada-event-img {
        width: 100%;
        height: 100%;
        object-fit: cover;
        object-position: center;
      }

      /* Navigation arrows */
      .jornada-arrow {
        position: absolute;
        top: 50%;
        transform: translateY(-50%);
        z-index: 10;
        background: none;
        border: none;
        padding: 0;
        cursor: pointer;
        display: flex;
        align-items: center;
        justify-content: center;
        transition:
          transform 0.2s ease,
          opacity 0.2s ease;
      }

      .jornada-arrow--prev {
        left: -60px;
      }

      .jornada-arrow--next {
        right: -45px;
      }

      .jornada-arrow svg {
        width: 44px;
        height: 44px;
        display: block;
      }

      .jornada-arrow:hover {
        transform: translateY(-50%) scale(1.12);
      }

      .jornada-arrow:active {
        transform: translateY(-50%) scale(0.92);
      }

      .jornada-arrow.swiper-button-disabled {
        opacity: 0.35;
        cursor: default;
        pointer-events: none;
      }

      @media (max-width: 768px) {
        .step-7{
          padding-left: 10px;
          padding-right: 10px;
        }
        .jornada-arrow {
          display: none;
        }
        .step-5 {
          min-height: 100vh;
        }
        html .noticia .credits-section {
          flex: unset;
        }
        .step-10__inner {
          display: flex;
          justify-content: center;
        }
      }

      /* Custom progress-dot pagination */
      .jornada-dots {
        display: flex;
        justify-content: center;
        gap: 10px;
        margin-top: 50px;
      }

      .jornada-dot {
        height: 10px;
        border-radius: 20px;
        background: #d9d9d9;
        cursor: pointer;
        transition:
          width 0.45s cubic-bezier(0.4, 0, 0.2, 1),
          background 0.35s;
      }

      .jornada-dot-active {
        background: #4D533A;
      }

      /* ═════════════════════════════════════════════════════
   RESPONSIVE
   ═════════════════════════════════════════════════════ */

      /* ── Large Desktop (> 1200px) ──────────────────────── */
      /* muro layout handled by absolute positioning */

      /* ── Tablet landscape / small desktop (≤ 1024px) ──── */
      @media (max-width: 1024px) {
        .bands-image {
          width: 65%;
        }
      }

      /* ── Tablet portrait (≤ 768px) ─────────────────────── */
      @media (max-width: 768px) {
        .html .noticia .credits-section {
          margin-top: 40px;
        }
        .jornada-event {
          margin-top: 0px;
        }
        .bands-center-img {
          width: 100%;
        }
        .step-1__author {
          flex-direction: column;
          align-items: center;
          padding-top: 150px;
        }
        html .noticia .statement-title {
          font-size: clamp(28px, 17vw, 133px);
        }

        .author-separator {
          display: none;
        }

        .author-share {
          margin-left: 0;
          width: 100%;
          justify-content: center;
        }

        /* side images handled by step-3 absolute positioning */

        /* Step-3: make taller on mobile so images aren't tiny */
        .step-3 {
          aspect-ratio: auto;
          min-height: 120vh;
        }

        /* Muro player: reposition for mobile */
        .muro-player {
          left: 4%;
          bottom: 4%;
          width: 92%;
          gap: 12px;
        }

        .player-title {
          font-size: clamp(20px, 5vw, 32px);
        }

        .player-desc {
          font-size: 14px;
          line-height: 1.3;
        }

        /* Hero badge */
        .hero-badge-img {
          max-width: 140px;
        }

        .jornada-gallery.swiper,
        .jornada-gallery.swiper-material {
          height: clamp(200px, 50vw, 400px);
        }

        .jornada-gallery .swiper-material-content {
          border-radius: 20px;
        }

        .jornada-event {
          width: 35%;
        }

        .bands-image {
          width: 75%;
        }

        .step-8__images {
          flex-direction: column;
        }

        .step-10__inner {
          flex-direction: column;
          gap: 40px;
          padding: clamp(30px, 5vw, 60px) var(--side-pad);
          justify-content: flex-start;
        }

        .related-section {
          width: 100%;
        }

        /* Ball float reduced on tablet */
        .bands-mask-small {
          animation-name: ballFloatMobile;
          width: 30%;
          left: 15%;
        }

        @keyframes ballFloatMobile {
          0% {
            transform: translateX(0) translateY(0);
          }
          100% {
            transform: translateX(25px) translateY(0);
          }
        }

        .step-9 .center img {
          max-width: 230px;
        }
      }

      /* ── Mobile large (≤ 600px) ────────────────────────── */
      @media (max-width: 600px) {
        .jornada-header {
          flex-direction: column;
          align-items: flex-start;
        }

        .jornada-badge {
          align-items: flex-start;
          flex-direction: row;
          gap: 16px;
        }

        .jornada-card-large {
          flex: 0 0 80%;
        }
        .jornada-card-medium {
          flex: 0 0 75%;
        }
        .jornada-card-small {
          flex: 0 0 70%;
        }

        .related-card-info {
          padding: 10px 12px;
        }

        .related-card-title {
          font-size: 14px;
        }
      }

      /* ── Mobile small (≤ 480px) ────────────────────────── */
      @media (max-width: 480px) {
        .hero-content {
          padding-bottom: 20px;
          top: clamp(60px, 7vw, 60px);
        }
        .hero-badge {
          top: clamp(140px, 22vw, 500px);
        }

        .hero-badge-img {
          max-width: 100px;
        }

        .jornada-card-large,
        .jornada-card-medium,
        .jornada-card-small {
          flex: 0 0 85%;
        }

        .jornada-event {
          width: 50%;
        }

        .related-card {
          flex-direction: column;
        }

        .related-card-img {
          width: 100%;
          height: 120px;
        }

        .hero-carousel .img-carousel__list {
          width: 160vw;
          height: 60vw;
        }

        .hero-carousel .img-carousel__panel {
          width: 55vw;
        }

        .player-desc {
          font-size: 13px;
        }

        /* Step-3: muro images bigger on small phones */
        .step-3 .side-img-left {
          width: 30%;
          height: 22%;
        }
        .step-3 .side-img-right {
          width: 30%;
          height: 22%;
          left: 65%;
        }
        .step-3 .side-img-right-blur {
          width: 22%;
          height: 18%;
        }
        .step-3 .muro-img-1 {
          width: 22%;
          height: 16%;
        }
        .step-3 .muro-img-2 {
          width: 35%;
          height: 28%;
        }
        .step-3 .muro-img-3 {
          width: 30%;
          height: 20%;
          left: 68%;
        }

        .muro-slash {
          letter-spacing: -4px;
        }

        /* Reduce bands ball float more */
        .bands-mask-small {
          animation-name: ballFloatSmall;
        }

        @keyframes ballFloatSmall {
          0% {
            transform: translateX(0) translateY(0);
          }
          100% {
            transform: translateX(15px) translateY(0);
          }
        }
      }

      /* ── Very small phones (≤ 360px) ───────────────────── */
      @media (max-width: 360px) {
        .hero-badge-img {
          width: 80px;
        }

        .jornada-card-large,
        .jornada-card-medium,
        .jornada-card-small {
          flex: 0 0 90%;
        }

        .statement-title {
          font-size: 24px;
        }
      }
      html *[class^="swiper-slide"] img {
        opacity: unset;
        -webkit-transition: unset;
        -moz-transition: unset;
        transition: unset;
      }
      .swiper-slide img {
        min-height: 100%;
      }

/* END SLIDER CESAR */


/* =========================================================
   Hero outer shell — 100vw × 100vh, off-white bg
   ========================================================= */
.asc_hero {
  position  : relative;
  width     : 100vw;
  height    : calc(100vh - 58px); /* full viewport minus nav height */
  overflow  : hidden;
  background: #fff;
  display   : flex;
  top: -20px;
  padding   : 0 clamp(14px, 2vw, 30px);
  margin-bottom: clamp(50px, 20vw, 150px);
}

/* =========================================================
   Inner rounded container — flex child of .asc_hero
   Spacing comes from .asc_hero padding (equal on all sides)
   ========================================================= */
.asc_hero__bg-wrap {
  position     : relative;
  flex         : 1;
  border-radius: clamp(16px, 1.9vw, 30px);
  overflow     : hidden;
  z-index      : 0;
}

.asc_hero__bg {
  position        : absolute;
  inset           : 0;
  width           : 100%;
  height          : 100%;
  object-fit      : cover;
  object-position : center 30%;
  display         : block;
  will-change     : transform;
  transform-origin: center center;
}

/* green-tinted darkening overlay (mix-blend: multiply) */
.asc_hero__overlay {
  position      : absolute;
  inset         : 0;
  background    : var(--asc-overlay-tint);
  mix-blend-mode: multiply;
  z-index       : 1;
}

/* dark vignette toward the bottom for text legibility */
.asc_hero__vignette {
  position  : absolute;
  inset     : 0;
  background: linear-gradient(
    to bottom,
    transparent 25%,
    rgba(0, 0, 0, 0.10) 50%,
    rgba(0, 0, 0, 0.55) 100%
  );
  z-index   : 2;
}

/* =========================================================
   Navigation header
   Figma: 61px tall, white bg, blue top border line
   ========================================================= */
.asc_hero__nav {
  position  : absolute;
  z-index   : 10;
  top       : 0;
  left      : 0;
  right     : 0;
  height    : 5.86%;
  background: var(--asc-white);
  border-top: 0.19% solid #0e3a6f;
  display   : flex;
  align-items    : center;
  justify-content: space-between;
  padding   : 0 1.5%;
}

.asc_hero__nav-left,
.asc_hero__nav-right {
  display    : flex;
  align-items: center;
  gap        : 0.5%;
  flex       : 1;
}

.asc_hero__nav-right {
  justify-content: flex-end;
  gap: 0.5%;
}

/* Hamburger */
.asc_hero__hamburger {
  display        : flex;
  align-items    : center;
  justify-content: center;
  background     : var(--asc-white);
  border         : none;
  cursor         : pointer;
  padding        : 4px;
  border-radius  : 2px;
}
.asc_hero__hamburger img {
  width  : clamp(10px, 1vw, 16px);
  height : clamp(10px, 1vw, 16px);
  display: block;
}

/* ABC logo */
.asc_hero__abc-logo {
  display    : flex;
  align-items: center;
  gap        : 1px;
  text-decoration: none;
}
.asc_hero__abc-logo img {
  height: clamp(10px, 0.9vw, 14px);
  width : auto;
  display: block;
}

/* Nav buttons */
.asc_hero__btn {
  display        : inline-flex;
  align-items    : center;
  gap            : 4px;
  font-family    : 'Inter', sans-serif;
  font-size      : var(--asc-fs-small);
  font-weight    : 600;
  cursor         : pointer;
  border-radius  : 2px;
  height         : clamp(18px, 1.5vw, 24px);
  padding        : 0 clamp(8px, 1vw, 16px);
  white-space    : nowrap;
  line-height    : 1;
  transition     : opacity .2s;
}
.asc_hero__btn:hover { opacity: .8; }

.asc_hero__btn--filled {
  background: #0e3a6f;
  color     : var(--asc-white);
  border    : none;
}
.asc_hero__btn--outlined {
  background: var(--asc-white);
  color     : #0e3a6f;
  border    : 1px solid #0e3a6f;
}
.asc_hero__btn--outlined img {
  width : clamp(8px, 0.75vw, 12px);
  height: clamp(8px, 0.75vw, 12px);
}

/* =========================================================
   Top row — brand logos + partner (inside bg-wrap)
   ========================================================= */
.asc_hero__top-row {
  position       : absolute;
  z-index        : 5;
  top            : clamp(16px, 3vh,  36px);
  left           : clamp(20px, 4vw,  64px);
  right          : clamp(20px, 4vw,  64px);
  display        : flex;
  justify-content: space-between;
  align-items    : flex-start;
}

/* Brand: SOSTENIBILIDAD label + AGROSUMMIT logo */
.asc_hero__brand {
  display       : flex;
  flex-direction: column;
  gap           : clamp(3px, 0.4vw, 6px);
}

.asc_hero__category {
  display        : block;
  font-family    : 'Inter', sans-serif;
  font-size      : var(--asc-fs-label);
  font-weight    : 700;
  letter-spacing : 0.08em;
  color          : var(--asc-white);
  text-transform : uppercase;
  line-height    : 1;
}

.asc_hero__agrosummit {
  display    : flex;
  align-items: center;
  gap        : clamp(1px, 0.2vw, 14px);
}
.asc_hero__agro,
.asc_hero__summit {
  height     : clamp(22px, 3vw, 30px);
  width      : auto;
  max-width  : none;
  object-fit : contain;
  flex-shrink: 0;
}

/* Partner: "UN PROYECTO CON" + Planasa */
.asc_hero__partner {
  display       : flex;
  flex-direction: row;
  align-items   : center;
  gap           : clamp(2px, 1.5vw, 20px);
}
.asc_hero__partner-label {
  font-family    : 'noto-sans', sans-serif;
  font-size      : var(--asc-fs-small);
  font-weight    : 700;
  letter-spacing : 0.07em;
  color          : #f4f1eb;
  text-transform : uppercase;
  line-height    : 1;
}
.asc_hero__partner img {
  height        : clamp(24px, 3.32vw, 40px);
  width         : auto;
  max-width     : none;
  object-fit    : contain;
  mix-blend-mode: screen;
}

/* =========================================================
   Bottom content block — headline + meta (inside bg-wrap)
   ========================================================= */
.asc_hero__content {
  position   : absolute;
  z-index    : 5;
  bottom     : clamp(28px, 14vh, 150px);
  left       : clamp(20px, 4vw, 64px);
  right      : clamp(20px, 4vw, 64px);
  display    : flex;
  align-items: flex-end;
  gap        : clamp(16px, 3vw, 50px);
}

/* Left column: headline */
.asc_hero__headline-col {
  flex    : 0 0 50%;
  overflow: hidden;
}

.asc_hero__headline-clip {
  overflow: hidden;
}

.asc_hero__headline {
  font-family   : "scotch-display-compressed",'Playfair Display', Georgia, 'Times New Roman', serif;
  font-weight   : 900;
  font-size     : var(--asc-fs-headline);
  line-height   : 1.05;
  letter-spacing: -0.015em;
  color         : var(--asc-white);
  hyphens       : none;
  overflow-wrap : break-word;
}

/* Right column: description + author */
.asc_hero__meta-col {
  flex          : 1;
  display       : flex;
  flex-direction: column;
  gap           : clamp(10px, 1.4vw, 22px);
  padding-bottom: clamp(2px, 0.3vw, 4px);
  max-width     :  clamp(400px, 30vw, 800px);
  margin: 0 auto;
}

.asc_hero__description {
  font-size     : var(--asc-fs-desc);
  font-weight   : 400;
  line-height   : 1.5;
  color         : var(--asc-white);
  letter-spacing: -0.005em;
  font-family: 'noto-sans', 'Helvetica Neue', Helvetica, Arial, sans-serif;
}

/* Author bar */
.asc_hero__author-bar {
  display        : flex;
  align-items    : center;
  justify-content: space-between;
  gap            : 12px;
}

.asc_hero__author {
  display    : flex;
  align-items: center;
  gap        : clamp(6px, 0.75vw, 12px);
}

.asc_hero__author-photo {
  width        : clamp(32px, 4.15vw, 66px);
  height       : clamp(32px, 4.15vw, 66px);
  max-width    : none;
  border-radius: 50%;
  object-fit   : cover;
  flex-shrink  : 0;
  border       : 1.5px solid rgba(255, 255, 255, 0.35);
}

.asc_hero__author-text {
  display       : flex;
  flex-direction: column;
  gap           : 2px;
}

.asc_hero__author-name {
  font-size  : var(--asc-fs-author);
  font-weight: 600;
  color      : var(--asc-white);
  font-family: "noto-sans-display", 'Helvetica Neue', Helvetica, Arial, sans-serif;
  line-height: 1.5;
  white-space: nowrap;
}

.asc_hero__date-row {
  display    : flex;
  align-items: center;
  gap        : clamp(4px, 0.5vw, 8px);
  font-size  : var(--asc-fs-small);
  font-weight: 400;
  color      : rgba(255, 255, 255, 0.85);
  white-space: nowrap;
}
.asc_hero__date-row span:nth-of-type(1){
  font-family: "noto-sans", 'Helvetica Neue', Helvetica, Arial, sans-serif;
}
.asc_hero__date-row span:nth-of-type(2){
  font-family: "noto-sans-display", 'Helvetica Neue', Helvetica, Arial, sans-serif;
  font-weight: 600;
}
/* Share bar */
.asc_hero__share {
  display    : flex;
  align-items: center;
  gap        : clamp(4px, 0.5vw, 8px);
  font-size  : var(--asc-fs-small);
  font-weight: 400;
  font-family: "noto-sans", 'Helvetica Neue', Helvetica, Arial, sans-serif;
  color      : var(--asc-white);
  white-space: nowrap;
  flex-shrink: 0;
}
.asc_hero__share img {
  width      : clamp(16px, 1.5vw, 24px);
  height     : clamp(16px, 1.5vw, 24px);
  max-width  : none;
  object-fit : contain;
  cursor     : pointer;
  transition : opacity .2s;
}
.asc_hero__share img:hover { opacity: .7; }

/* Separator line */
.asc_hero__sep {
  display    : block;
  width      : 1px;
  height     : clamp(10px, 1vw, 16px);
  background : rgba(231, 235, 241, 0.6);
  flex-shrink: 0;
}

/* =========================================================
   RESPONSIVE — tablet & mobile
   ========================================================= */

/* ── Tablet: < 900px ── */
@media (max-width: 900px) {
  .asc_hero {
    padding: clamp(10px, 1.5vw, 20px);
  }

  .asc_hero__content {
    bottom : clamp(24px, 8vh, 70px);
    left   : 4.5vw;
    right  : 4.5vw;
    gap    : 4vw;
  }

  .asc_hero__headline-col {
    flex: 0 0 48%;
  }

  .asc_hero__top-row {
    top  : clamp(16px, 3.2vh, 36px);
    left : 4.5vw;
    right: 4.5vw;
  }

  .asc_hero__agro,
  .asc_hero__summit {
    height: clamp(18px, 2.8vw, 36px);
  }

  .asc_hero__partner img {
    height: clamp(20px, 4vw, 40px);
  }
}

/* ── Mobile: < 600px — stack vertically ── */
@media (max-width: 600px) {
  .asc_hero {
    padding: clamp(8px, 2.5vw, 14px);
  }

  .asc_hero__bg-wrap {
    border-radius: clamp(14px, 4vw, 22px);
  }

  .asc_hero__top-row {
    top  : clamp(14px, 2.5vh, 24px);
    left : clamp(14px, 5vw, 24px);
    right: clamp(14px, 5vw, 24px);
  }

  .asc_hero__agro,
  .asc_hero__summit {
    height: clamp(16px, 5.5vw, 28px);
  }

  .asc_hero__agrosummit {
    gap: clamp(1px, 0.2vw, 14px);
  }

  .asc_hero__partner-label {
    display: none;
  }

  .asc_hero__partner img {
    height: clamp(16px, 5.5vw, 26px);
  }

  /* Stack content vertically */
  .asc_hero__content {
    bottom        : clamp(28px, 13vh, 170px);
    left          : clamp(14px, 5vw, 24px);
    right         : clamp(14px, 5vw, 24px);
    flex-direction: column;
    align-items   : flex-start;
    gap           : clamp(14px, 2.8vh, 24px);
  }

  .asc_hero__headline-col {
    flex : 0 0 auto;
    width: 100%;
  }

  .asc_hero__headline {
    font-size  : clamp(26px, 10vw, 44px);
    line-height: 1.08;
  }

  .asc_hero__meta-col {
    width         : 100%;
    gap           : clamp(10px, 2vh, 18px);
    padding-bottom: 0;
  }

  .asc_hero__description {
    font-size  : clamp(13px, 3.5vw, 16px);
    line-height: 1.5;
  }

  .asc_hero__author-bar {
    flex-wrap      : wrap;
    gap            : 10px;
    padding        : 10px 12px;
    border-radius  : 10px;
  }

  .asc_hero__author-photo {
    width : 34px;
    height: 34px;
  }

  .asc_hero__author-name {
    font-size: 13px;
  }

  .asc_hero__date-row {
    font-size: 11px;
  }

  .asc_hero__share {
    font-size  : 11px;
    gap        : 8px;
    margin-left: auto;
  }

  .asc_hero__share img {
    width : 20px;
    height: 20px;
  }
}
@media (max-width: 410px) {
    .asc_hero__share {
        margin-left: unset;
    }
}




/* PORTADA */ 


/* ===== OVERRIDES (no se tocan los originales, se ajustan aquí debajo) ===== */
/* en este proyecto el antetitle del hero es blanco sobre fondo oscuro */
body .noticia .tm-step-0 .gc-antetitle {color: var(--tm-color-white); letter-spacing: 4px; margin-bottom: clamp(18px, 2vw, 26px);}
/* gc-title sobre fondo oscuro */
body .noticia .tm-step-0 .gc-title {color: var(--tm-color-white); margin-bottom: 0; font-size: var(--tm-fs-h-hero); max-width: 920px; font-family: var(--tm-font-display-strong);}
/* piefoto a la izquierda en columnas de imagen interior */
body .noticia .tm-step-2 .gc-piefoto, body .noticia .tm-step-4 .gc-piefoto {text-align: right;}
.tm-card-link {display: block; color: inherit; text-decoration: none;}
/* =========================================
   tm-step-0 :: HERO CARRUSEL
   ========================================= */
.tm-step-0 {position: relative; width: 100%; min-height: 100vh; overflow: hidden; isolation: isolate; display: block;}

/* Slides apilados, transición por opacidad */
.tm-step-0__slides {position: absolute; inset: 0; z-index: 0;}
.tm-step-0__slide {position: absolute; inset: 0; opacity: 0; visibility: hidden; display: flex; flex-direction: column; align-items: center; justify-content: center; padding: clamp(90px, 12vw, 140px) 16px clamp(220px, 26vw, 340px); transition: opacity 0.6s ease;}
.tm-step-0__slide.is-active {opacity: 1; visibility: visible;}

.tm-step-0__bg {position: absolute; inset: 0; z-index: 0;}
.tm-step-0__bg img {width: 100%; height: 100%; object-fit: cover; object-position: center;}
.tm-step-0__bg::after {content: ""; position: absolute; inset: 0; background: var(--tm-color-brand-overlay); mix-blend-mode: multiply; z-index: 1;}
.tm-step-0__bg::before {content: ""; position: absolute; inset: 0; background: linear-gradient(180deg, rgba(0,0,0,0.2) 0%, rgba(0,0,0,0) 35%, rgba(0,0,0,0) 55%, rgba(0,0,0,0.55) 100%); z-index: 2;}

/* Topbar fijo encima de todos los slides */
.tm-step-0__topbar {position: absolute; top: clamp(24px, 3vw, 40px); left: 0; right: 0; z-index: 5; width: 100%; max-width: var(--tm-max-width); margin: 0 auto; padding: 0 clamp(20px, 4vw, 60px); display: flex; align-items: center; gap: 6px;}
.tm-step-0__logo {font-family: var(--tm-font-display-strong); color: var(--tm-color-white); font-weight: 700; font-size: var(--tm-fs-h-logo); letter-spacing: 6px; line-height: 1; text-transform: uppercase; display: flex; gap: 10px;}

.tm-step-0__content {position: relative; z-index: 3; width: 100%; max-width: 960px; display: flex; flex-direction: column; align-items: center; text-align: center;}

.tm-step-0__author {position: relative; z-index: 3; margin-top: clamp(36px, 5vw, 60px); display: flex; flex-direction: column; align-items: center; gap: 14px;}
.tm-step-0__author-photo {width: clamp(56px, 6vw, 72px); height: clamp(56px, 6vw, 72px); border-radius: 50%; object-fit: cover; border: 2px solid rgba(255,255,255,0.18);}
.tm-step-0__author-name {font-family: var(--tm-font-sans-display); font-weight: 600; color: var(--tm-color-white); font-size: var(--tm-fs-author); line-height: 1.4;}

/* Flechas del carrusel (centradas verticalmente) */
.tm-step-0__arrows {position: absolute; z-index: 6; top: 50%; transform: translateY(-50%); width: 100%; padding: 0 clamp(12px, 2vw, 24px); left: 0; display: flex; justify-content: space-between; pointer-events: none;}
.tm-step-0__arrow {pointer-events: auto; width: clamp(40px, 4vw, 54px); height: clamp(40px, 4vw, 54px); border-radius: 50%; background: rgba(255,255,255,0.18); border: 1px solid rgba(255,255,255,0.35); color: var(--tm-color-white); display: flex; align-items: center; justify-content: center; cursor: pointer; backdrop-filter: blur(4px); transition: background var(--tm-transition), transform var(--tm-transition);}
.tm-step-0__arrow:hover {background: rgba(255,255,255,0.3); transform: scale(1.06);}
.tm-step-0__arrow svg {width: 40%; height: 40%;}

/* Strip de 4 noticias anclado al fondo del hero */
.tm-step-0__strip {position: absolute; left: 0; right: 0; bottom: 0; z-index: 4; width: 100%; padding: clamp(28px, 4vw, 50px) clamp(16px, 4vw, 60px) clamp(28px, 4vw,90px); background: linear-gradient(180deg, rgba(0,0,0,0) 0%, rgba(0,0,0,0.35) 100%);}
.tm-step-0__strip .tm-step-1__inner {width: 100%; max-width: var(--tm-max-width); margin: 0 auto; display: grid; grid-template-columns: 1fr; gap: clamp(20px, 2.4vw, 36px);}

@media screen and (max-width: 1024px) {
  .tm-step-0__strip{display: none;}
}


/* =========================================
   tm-step-1 :: clases reutilizadas dentro del strip del hero
   ========================================= */
.tm-step-1__item {display: flex; flex-direction: column; gap: 10px; position: relative; padding-top: 16px; border-top: 1px solid rgba(255,255,255,0.35); height: 100%;}
body .noticia .tm-step-1__title {font-family: var(--tm-font-display); font-weight: 400; color: var(--tm-color-white); font-size: var(--tm-fs-h-strip); line-height: 1.2; margin: 0; min-height: 75%;}
body .noticia .tm-step-1__author {font-family: var(--tm-font-sans); font-weight: 400; color: var(--tm-color-white); opacity: 0.85; font-size: var(--tm-fs-meta); line-height: 1.2;}

/* Strip clicable (cada item navega a su slide) + indicador de progreso */
.tm-step-0__strip .tm-step-1__item {cursor: pointer; -webkit-tap-highlight-color: transparent;}
.tm-step-0__strip .tm-step-1__title {transition: color var(--tm-transition);}
body .noticia .tm-step-0__strip .tm-step-1__item:not(.is-active) .tm-step-1__title {color: rgba(255, 255, 255, 0.62);}
.tm-step-0__strip .tm-step-1__item:hover .tm-step-1__title {color: var(--tm-color-white);}
.tm-step-0__strip .tm-step-1__item:focus-visible {outline: 2px solid rgba(255, 255, 255, 0.6); outline-offset: 6px; border-radius: var(--tm-radius-sm);}

.tm-step-0__progress {display: block; margin-top: 2px; height: 3px; width: 100%; border-radius: var(--tm-radius-pill); background: rgba(255, 255, 255, 0.28); overflow: hidden;}
.tm-step-0__progress-fill {display: block; height: 100%; width: 100%; border-radius: inherit; background: var(--tm-color-white); transform: scaleX(0); transform-origin: left center; will-change: transform;}

@media screen and (min-width: 700px) {
    .tm-step-0__strip .tm-step-1__inner {grid-template-columns: repeat(2, 1fr);}
}
@media screen and (min-width: 1024px) {
    .tm-step-0__strip .tm-step-1__inner {grid-template-columns: repeat(4, 1fr); gap: clamp(24px, 5.4vw, 140px);}
    .tm-step-1__item{ border-top: 0px;}
}

@media screen and (min-width: 1400px) and (max-height: 1200px) {
   .tm-step-0 {min-height: 100vh;}
   .tm-step-0__slide {
      justify-content: center;
      padding: 104px 24px 180px;
   }
   .tm-step-0__content {
      max-width: 840px;
      margin-top: clamp(28px, 4vh, 56px);
   }
   body .noticia .tm-step-0 .gc-antetitle {
      margin-bottom: 14px;
   }
   body .noticia .tm-step-0 .gc-title {
      font-size: clamp(48px, 3.5vw, 68px);
      line-height: 1.03;
      max-width: 820px;
   }
   .tm-step-0__author {
      margin-top: 24px;
      gap: 10px;
   }
   .tm-step-0__author-photo {
      width: 60px;
      height: 60px;
   }
   .tm-step-0__strip {
      padding: 22px clamp(24px, 4vw, 60px) 34px;
   }
}

/* =========================================
   tm-step-2 :: GRID DE FEATURED (columna principal + sidebar)
   ========================================= */
.tm-step-2 {width: 100%; background: var(--tm-color-bg); padding: var(--tm-section-pad-y) 16px;}
.tm-step-2__inner {width: 100%; max-width: var(--tm-max-width-narrow); margin: 0 auto; display: grid; grid-template-columns: 1fr; gap: clamp(32px, 4vw, 56px);}

.tm-step-2__col {display: flex; flex-direction: column;}

.tm-step-2__card {display: grid; grid-template-columns: 1fr; gap: 16px; padding: 28px 0;}
.tm-step-2__card + .tm-step-2__card {border-top: 1px solid var(--tm-color-border-soft);}
.tm-step-2__card:first-child {padding-top: 0;}
.tm-step-2__card-text {display: flex; flex-direction: column; gap: 14px;}
body .noticia .tm-step-2__h {font-family: var(--tm-font-display); font-weight: 700; color: var(--tm-color-text); font-size: var(--tm-fs-h-card); line-height: 1.1; margin: 0;}
.tm-step-2__meta {font-family: var(--tm-font-sans); color: var(--tm-color-text); font-size: var(--tm-fs-meta); letter-spacing: 0.6px;}
.tm-step-2__img {width: 100%; aspect-ratio: 16 / 9; border-radius: var(--tm-radius-lg); object-fit: cover; display: block; background: var(--tm-color-placeholder);}
.tm-step-2__caption {font-family: var(--tm-font-sans); font-weight: 400; font-style: normal; color: var(--tm-color-text-muted); font-size: var(--tm-fs-meta); line-height: 1.15; text-align: right; margin-top: 8px; letter-spacing: 0;}

.tm-step-2__side {display: flex; flex-direction: column;}
.tm-step-2__side-item {padding: 22px 0; display: flex; flex-direction: column; gap: 10px;}
.tm-step-2__side-item + .tm-step-2__side-item {border-top: 1px solid var(--tm-color-border-soft);}
.tm-step-2__side-item:first-child {padding-top: 0;}
body .noticia .tm-step-2__side-h {font-family: var(--tm-font-display); font-weight: 600; color: var(--tm-color-text); font-size: var(--tm-fs-h-side); line-height: 1.1; margin: 0;}
.tm-step-2__side-text {font-family: var(--tm-font-sans); font-weight: 300; color: var(--tm-color-text-muted); font-size: var(--tm-fs-body); line-height: 1.4;}
.tm-step-2__side-img {width: 100%; aspect-ratio: 16 / 11; border-radius: var(--tm-radius-md); object-fit: cover; background: var(--tm-color-placeholder);}
.tm-step-2__side-author {font-family: var(--tm-font-sans); color: var(--tm-color-text); font-size: var(--tm-fs-meta); letter-spacing: 0.6px;}

@media screen and (min-width: 700px) {
    .tm-step-2__card {grid-template-columns: 1fr 1.6fr; gap: 28px; align-items: start;}
}
@media screen and (min-width: 1024px) {
    .tm-step-2__inner {grid-template-columns: 1fr 240px; gap: 56px;}
    .tm-step-2__col {border-right: 1px solid var(--tm-color-border-soft); padding-right: 56px;}
}
body > div.main-container.noticia > article > div > div > div > div > section:nth-child(2) > div > aside > a:nth-child(2) > article { border-top: 1px solid #d2d2d2; border-bottom: 1px solid #d2d2d2; padding: 20px 0;}
body > div.main-container.noticia > article > div > div > div > div > section:nth-child(2) > div > aside > a:nth-child(3) > article { padding-top: 20px; }
/* =========================================
   tm-step-3 :: ENCUESTA / POLL
   ========================================= */
.tm-step-3 {position: relative; width: 100%; padding: clamp(60px, 8vw, 100px) 16px; isolation: isolate; overflow: hidden;}
.tm-step-3__bg {position: absolute; inset: 0; z-index: 0;}
.tm-step-3__bg img {width: 100%; height: 100%; object-fit: cover;}
.tm-step-3__bg::after {content: ""; position: absolute; inset: 0; background: var(--tm-color-brand-overlay-rgba); mix-blend-mode: multiply;}

.tm-step-3__card {position: relative; z-index: 1; width: 100%; max-width: 1120px; margin: 0 auto; background: var(--tm-color-brand); border-radius: var(--tm-radius-lg); padding: clamp(40px, 6vw, 70px) clamp(24px, 4vw, 60px); display: flex; flex-direction: column; align-items: center; text-align: center; gap: clamp(28px, 4vw, 42px);}
body .noticia .tm-step-3__title {font-family: var(--tm-font-display); font-weight: 400; color: var(--tm-color-cream-soft); font-size: var(--tm-fs-h-poll); line-height: 1.05; max-width: 780px; text-align: center; margin: 0;}

.tm-step-3__options {display: flex; flex-wrap: wrap; justify-content: center; gap: clamp(10px, 1.4vw, 16px);}
.tm-step-3__opt {background: var(--tm-color-cream); color: var(--tm-color-brand-darkest); border: none; border-radius: var(--tm-radius-sm); padding: 12px clamp(20px, 2.4vw, 28px); font-family: var(--tm-font-sans); font-weight: 700; font-size: clamp(15px, 1.6vw, 19px); cursor: pointer; transition: transform 0.2s ease, background 0.2s ease;}
.tm-step-3__opt:hover {transform: translateY(-2px); background: var(--tm-color-cream-light);}
.tm-step-3__opt.is-selected {background: var(--tm-color-brand-darkest); color: var(--tm-color-cream);}

/* =========================================
   tm-step-4 :: GRID DE 4 NOTICIAS (cards verticales con divisores)
   ========================================= */
.tm-step-4 {width: 100%; padding: clamp(30px, 4vw, 60px) 0 clamp(40px, 6vw, 90px); padding-top: 0; background: var(--tm-color-bg); pointer-events:none;}
.tm-step-4__grid {width: 100%; margin: 0 auto; display: grid; grid-template-columns: 1fr; gap: 0; border-bottom: 1px solid var(--tm-color-border);}
.tm-step-4__item {display: flex; flex-direction: column; position: relative;}
.tm-step-4__media {width: 100%; aspect-ratio: 3 / 4; overflow: hidden;}
.tm-step-4__media img {width: 100%; height: 100%; object-fit: cover; display: block;}
.tm-step-4__body {padding: clamp(18px, 2vw, 26px) clamp(14px, 1.4vw, 22px) clamp(20px, 2.4vw, 32px);}
body .noticia .tm-step-4__h {font-family: var(--tm-font-display); font-weight: 600; color: var(--tm-color-text); font-size: var(--tm-fs-h-grid); line-height: 1.15; margin: 0 0 12px;}
.tm-step-4__text {font-family: var(--tm-font-sans); font-weight: 300; color: var(--tm-color-text-muted); font-size: clamp(12px, 1vw, 16px); line-height: 1.45; margin: 0 0 18px;}
.tm-step-4__author {font-family: var(--tm-font-sans); font-weight: 400; color: var(--tm-color-text); font-size: clamp(10px, 0.85vw, 12px); margin: 0;}

/* Divisores verticales solo entre textos */
@media screen and (min-width: 700px) {
    .tm-step-4__grid {grid-template-columns: repeat(2, 1fr);}
    .tm-step-4__item:nth-child(2n) .tm-step-4__body {border-left: 1px solid var(--tm-color-border);}
}
@media screen and (min-width: 1024px) {
    .tm-step-4__grid {grid-template-columns: repeat(4, 1fr); height: 100vh; border-bottom: none;}

    /* Telón a pantalla completa: las tarjetas ocupan 100vh exacto */
    .tm-step-3 {height: 100vh; display: flex; flex-direction: column; align-items: center; justify-content: center;}
    .tm-step-4 {padding: 0; height: 100vh; background: transparent;}
    /* box-shadow lateral del color de la tarjeta: rellena la costura sub-píxel
       entre tarjetas contiguas (si no, asoma el poll de detrás como una línea). */
    .tm-step-4__item {height: 100vh; background: var(--tm-color-bg); will-change: transform;}
    .tm-step-4__media {flex: 1 1 auto; aspect-ratio: auto; min-height: 0;}
    .tm-step-4__body {flex: 0 0 auto; border-bottom: 1px solid var(--tm-color-border); min-height: 28%; border-left: 1px solid var(--tm-color-border);}

    /* Imágenes pegaditas (sin bordes laterales). El borde solo en el texto:
       un lateral (divisor entre columnas) + la línea inferior. */
    .tm-step-4__item + .tm-step-4__item .tm-step-4__body {border-left: 1px solid var(--tm-color-border);}

    /* Stage del telón: escenario pineado que NO se mueve */
    .tm-curtain-stage {position: relative; width: 100%; height: 100vh;}
    .tm-curtain-stage .tm-step-3,
    .tm-curtain-stage .tm-step-4 {position: absolute; inset: 0; height: 100vh; margin: 0;}
    .tm-curtain-stage .tm-step-3 {z-index: 1;}
    .tm-curtain-stage .tm-step-4 {z-index: 10;}
}


/* =========================================
   tm-step-4-5 :: BANNER "UN PROYECTO DE TODOS" + LOGOS PARTNERS
   ========================================= */
.tm-step-4-5 {width: 100%; background: #fff; padding: clamp(28px, 4vw, 56px) 0 clamp(28px, 4vw, 56px); border-bottom: 1px solid #AFAEAE;}
.tm-step-4-5__inner {width: 100%; margin: 0 auto; display: flex; flex-direction: column; justify-content: center; align-items: center;}
.tm-step-4-5__kicker {font-family: var(--tm-font-sans); font-weight: 700; font-size: clamp(12px, 1vw, 14px); letter-spacing: 0.02em; color: var(--tm-color-brand); margin: 0 0 clamp(10px, 1.2vw, 16px); text-transform: uppercase;}
.tm-step-4-5__band {background: #fff;  padding: clamp(18px, 2.2vw, 28px) clamp(14px, 1.6vw, 24px); max-width: 1470px; width: 100%;}
.tm-step-4-5__logos {list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(7, 1fr); align-items: center; justify-items: center; gap: 60px;}
.tm-step-4-5__logo {display: flex; align-items: center; justify-content: center; width: 100%; height: clamp(40px, 4vw, 64px);}
.tm-step-4-5__logo img {max-width: 100%; max-height: 100%; width: auto; height: auto; object-fit: contain; display: block;  transition: opacity 0.25s ease, transform 0.25s ease;}
.tm-step-4-5__logo:hover img {opacity: 1; transform: scale(1.04);}

/* Tamaños relativos por logo (afinan proporciones del diseño) */
.tm-step-4-5__logo--asaja img {max-height: 80%;}
.tm-step-4-5__logo--coag img {max-height: 95%;}
.tm-step-4-5__logo--upa img {max-height: 75%;}
.tm-step-4-5__logo--uniones img {max-height: 85%;}
.tm-step-4-5__logo--cooperativas img {max-height: 100%;}
.tm-step-4-5__logo--fiab img {max-height: 100%;}
.tm-step-4-5__logo--aecoc img {max-height: 85%;}

@media screen and (max-width: 1023px) {
    .tm-step-4-5__logos {grid-template-columns: repeat(4, 1fr); gap: clamp(16px, 3vw, 24px) clamp(20px, 4vw, 32px);}
}
@media screen and (max-width: 599px) {
    .tm-step-4-5 {padding: 32px 0 36px;}
    .tm-step-4-5__inner {align-items: center;}
    .tm-step-4-5__band {padding: 0 24px;}
    .tm-step-4-5__kicker {align-self: center; text-align: center; margin: 0 0 22px; font-size: 13px;}
    .tm-step-4-5__logos {grid-template-columns: 1fr; gap: 28px;}
    .tm-step-4-5__logo {height: 64px; width: 100%; justify-content: center;}
    .tm-step-4-5__logo img {max-height: 100%; max-width: 100%; max-width: 150px;}

    /* Ajustes individuales para igualar pesos visuales */
    .tm-step-4-5__logo--asaja img {max-height: 78%;}
    .tm-step-4-5__logo--coag img {max-height: 100%;}
    .tm-step-4-5__logo--upa img {max-height: 72%;}
    .tm-step-4-5__logo--uniones img {max-height: 85%;}
    .tm-step-4-5__logo--cooperativas img {max-height: 95%;}
    .tm-step-4-5__logo--fiab img {max-height: 100%;}
    .tm-step-4-5__logo--aecoc img {max-height: 90%;}
}

/* =========================================
   TM COLLAB — marquee logos
   ========================================= */
.tm-collab {width: 100%;background-color: #fff;padding: clamp(28px, 4vw, 56px); padding-top: 0px; margin: 46px 0;box-sizing: border-box; border-bottom: 1px solid #AFAEAE;}
.tm-collab__inner {width: 100%;margin: 0 auto;padding: 20px 0 28px;box-sizing: border-box;}
body .noticia .tm-collab__label {font-family: var(--tm-font-sans); font-weight: 700; font-size: clamp(12px, 1vw, 14px); letter-spacing: 0.02em; color: var(--tm-color-brand); margin: 0 0 clamp(10px, 1.2vw, 16px); text-transform: uppercase; padding-bottom: 30px;}
.tm-collab__marquee {position: relative;width: 100%;overflow: hidden;}
.tm-collab__marquee::before,
.tm-collab__marquee::after {content: "";position: absolute;top: 0;bottom: 0;width: clamp(48px, 10vw, 140px);z-index: 2;pointer-events: none;}
.tm-collab__marquee::before {left: 0;background: linear-gradient(to right, #fff 0%, rgba(255, 255, 255, 0) 100%);}
.tm-collab__marquee::after {right: 0;background: linear-gradient(to left, #fff 0%, rgba(255, 255, 255, 0) 100%);}
.tm-collab__track {display: flex;flex-direction: row;align-items: center;gap: clamp(32px, 6vw, 90px);width: max-content;will-change: transform;}
.tm-collab__logo {flex: 0 0 auto;height: clamp(32px, 5vw, 52px);width: auto;max-width: clamp(72px, 14vw, 140px);object-fit: contain;display: block;opacity: 0.55;}
@media (prefers-reduced-motion: reduce) {
    .tm-collab__track {will-change: auto;}
}


/* =========================================
   tm-step-5 :: PAGINACIÓN
   ========================================= */
/* =========================================
   tm-step-5 :: reutiliza el layout de tm-step-2 (sin sidebar) + paginación
   ========================================= */
.tm-step-5 {width: 100%;}
.tm-step-5 .tm-step-2__inner {grid-template-columns: 1fr; max-width: 1024px;}
.tm-step-5 .tm-step-2__subtitle {font-family: var(--tm-font-sans); font-weight: 300; color: var(--tm-color-text-muted); font-size: var(--tm-fs-body); line-height: 1.4; margin: 0;}

@media screen and (min-width: 1024px) {
    .tm-step-5 .tm-step-2__inner {grid-template-columns: 1fr;}
    .tm-step-5 .tm-step-2__col {border-right: none; padding-right: 0;}
}
.tm-step-5__pager {width: 100%; max-width: var(--tm-max-width-narrow-step-5); margin: 0 auto; padding: clamp(20px, 3vw, 40px) 16px clamp(40px, 6vw, 80px); display: flex; justify-content: center; align-items: center; gap: clamp(6px, 1vw, 12px);}
.tm-step-5__btn {width: clamp(34px, 3.4vw, 40px); height: clamp(34px, 3.4vw, 40px); border-radius: 50%; background: var(--tm-color-bg); border: 1px solid var(--tm-color-border); color: var(--tm-color-text); display: flex; align-items: center; justify-content: center; cursor: pointer; transition: background var(--tm-transition), transform var(--tm-transition);}
.tm-step-5__btn:hover {transform: scale(1.05); background: var(--tm-color-brand-dark); color: var(--tm-color-white);}
/* .tm-step-5__btn:last-child {background: var(--tm-color-brand); border-color: var(--tm-color-brand); color: var(--tm-color-white);} */
.tm-step-5__btn svg {width: 40%; height: 40%;}
.tm-step-5__num {position: relative; font-family: var(--tm-font-sans); font-weight: 600; color: #D9D9D9; font-size: clamp(13px, 1vw, 15px); padding: 6px 10px; min-width: 28px; text-align: center; cursor: pointer; transition: color var(--tm-transition); background: none; border: none;}
.tm-step-5__num.is-active::after {
  content: "";
  position: absolute;
  bottom: -8px;
  left: 50%;
  transform: translateX(-50%);
  width: 12px;
  height: 3px;
  background: #70775A;
  border-radius: 999px;
}
.tm-step-5__num.is-active {color: #70775A;}
.tm-step-5__num:hover {color: var(--tm-color-brand);}

/* =========================================
   tm-step-6 :: FOOTER (logo + video + texto + CTA)
   ========================================= */
.tm-step-6 {position: relative; width: 100%; padding: clamp(50px, 7vw, 110px) clamp(20px, 4vw, 80px) clamp(60px, 8vw, 120px); background: linear-gradient(135deg, #f6f1e6 0%, #eef0e0 35%, #e9e4dc 65%, #f1dcd5 100%); overflow: hidden;}
.tm-step-6__inner {width: 100%; max-width: var(--tm-max-width); margin: 0 auto; display: flex; flex-direction: column; gap: clamp(28px, 4vw, 56px);}

.tm-step-6__logo {font-family: var(--tm-font-display-strong); color: var(--tm-color-brand-darker); font-size: var(--tm-fs-h-logo-footer); line-height: 1; text-transform: uppercase; display: inline-flex; gap: 2px;}
.tm-step-6__logo img { width: unset; }
@media screen and (max-width:599px) {
  .tm-step-6__logo img { max-width: 300px; }
}
.tm-step-6__logo-bold {font-weight: 700;}
.tm-step-6__logo-regular {font-family: var(--tm-font-display); font-weight: 400; letter-spacing: 1px;}

.tm-step-6__grid {display: grid; grid-template-columns: 1fr; gap: clamp(28px, 4vw, 56px); align-items: start;}

.tm-step-6__media {width: 100%;}
.tm-step-6__video {width: 100%; aspect-ratio: 16 / 9; object-fit: cover; border-radius: var(--tm-radius-xl); display: block; background: var(--tm-color-black); }

.tm-step-6__content {display: flex; flex-direction: column; gap: clamp(28px, 4vw, 48px);}
.tm-step-6__text {display: flex; flex-direction: column; gap: clamp(14px, 1.6vw, 22px);}
.tm-step-6__text p {font-family: var(--tm-font-sans); font-weight: 400; color: var(--tm-color-text-soft); font-size: var(--tm-fs-body-lg); line-height: 1.55; margin: 0;}

.tm-step-6__cta {align-self: flex-start; display: none; align-items: center; gap: 14px; background: var(--tm-color-cta-idle); color: var(--tm-color-white); border: none; border-radius: var(--tm-radius-pill); padding: clamp(12px, 1.4vw, 16px) clamp(22px, 2.4vw, 30px); font-family: var(--tm-font-sans); font-weight: 700; font-size: clamp(13px, 1.1vw, 15px); letter-spacing: 2px; cursor: pointer; text-transform: uppercase; transition: background var(--tm-transition), transform var(--tm-transition);}
.tm-step-6__cta svg {width: clamp(16px, 1.4vw, 18px); height: clamp(16px, 1.4vw, 18px); background: rgba(255,255,255,0.18); border-radius: 50%; padding: 3px;}
.tm-step-6__cta:hover {background: var(--tm-color-brand); transform: translateY(-2px);}

@media screen and (min-width: 1024px) {
    .tm-step-6__grid {grid-template-columns: 1.25fr 1fr; gap: clamp(48px, 6vw, 100px);}
    .tm-step-6__content {min-height: 100%; justify-content: space-between;}
    .tm-step-6__cta {align-self: flex-end;}
}

/* FIX LOGO FOOTER */