/* Cómo trabajamos (desde 2026-10-07): al estilo de la home nueva.
   Hero sobre noche con degradé tonal a petróleo y grano; los cuatro pasos como capítulos de corrido
   con índice fijo; filetes en vez de cajas; un solo lima por pantalla en el contenido.
   Solo la carga como-trabajamos.html. Clases propias con prefijo c- (v3.css y paginas.css usan nombres cortos). */
:root{
  --texto-2:rgba(230,237,240,.74);           /* 6,9:1 sobre noche · 5,0:1 sobre petróleo */
  --filete-claro:rgba(230,237,240,.18);
}

.c-sr{position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}

/* ── grano (de la home: estático) ── */
.grano{position:relative;isolation:isolate}
.grano::after{content:'';position:absolute;inset:0;pointer-events:none;z-index:0;opacity:.16;mix-blend-mode:overlay;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='160' height='160' filter='url(%23n)'/%3E%3C/svg%3E")}
.grano>*{position:relative;z-index:1}

/* etiquetas */
.c-eyebrow{display:flex;align-items:center;gap:10px;margin-bottom:26px;font:500 11px/1.3 var(--mono);letter-spacing:.2em;text-transform:uppercase;color:var(--salvia)}
.c-eyebrow i{width:6px;height:6px;border-radius:50%;background:var(--salvia);flex:none}
.c-eyebrow-b{font:500 11px/1.3 var(--mono);letter-spacing:.2em;text-transform:uppercase;color:var(--tinta-suave)}

/* ═══ 1 · HERO ═══════════════════════════════════════════ */
.c-hero{color:var(--claro);--fuerte:var(--claro);
  background:
    radial-gradient(70% 60% at 100% 0%, rgba(34,79,85,.95) 0%, rgba(34,79,85,.45) 38%, rgba(34,79,85,0) 72%),
    var(--noche);
  padding-block:clamp(56px,7vw,104px) clamp(64px,8vw,112px);overflow-x:clip}
.c-hero .wrap{display:grid;grid-template-columns:minmax(0,7fr) minmax(0,5fr);gap:clamp(40px,6vw,96px);align-items:end}
.c-hero h1{font-size:clamp(40px,5vw,70px);line-height:1.02;letter-spacing:-.04em;color:var(--claro)}
.c-hero h1 .serif{color:var(--salvia-claro);font-size:.66em;line-height:1.15;margin-top:14px;letter-spacing:-.005em}
.c-bajada{margin-top:24px;font-size:17.5px;line-height:1.6;color:var(--texto-2);max-width:33em;text-wrap:pretty}

.c-hero-indice ol{list-style:none;border-top:1px solid var(--filete-claro)}
.c-hero-indice li{border-bottom:1px solid var(--filete-claro)}
.c-hero-indice a{display:grid;grid-template-columns:44px minmax(0,1fr) auto;gap:16px;align-items:baseline;padding:15px 0 16px;color:var(--claro);text-decoration:none}
.c-hero-indice .n{font:500 12px/1 var(--mono);letter-spacing:.2em;color:var(--texto-2)}
.c-hero-indice b{display:block;font-size:19px;font-weight:600;letter-spacing:-.015em;line-height:1.3}
.c-hero-indice small{display:block;margin-top:2px;font-size:14px;line-height:1.4;color:var(--texto-2)}
.c-hero-indice .flecha{color:var(--texto-2);transition:transform 200ms var(--ease-out),color 200ms ease}
@media (hover:hover) and (pointer:fine){
  .c-hero-indice a:hover b{color:var(--salvia-claro)}
  .c-hero-indice a:hover .flecha{transform:translateY(3px);color:var(--claro)}
}

/* ═══ 2 · LOS CUATRO PASOS ═══════════════════════════════ */
.c-pasos{background:var(--hueso);padding-block:clamp(72px,9vw,128px)}
.c-pasos-grid{display:grid;grid-template-columns:168px minmax(0,1fr);gap:clamp(32px,5vw,80px);align-items:start}

/* índice fijo: un solo marcador que se desliza al paso que cruza el centro de la pantalla */
.c-indice{position:sticky;top:calc(66px + 56px)}
.c-indice ol{list-style:none;position:relative;border-left:1px solid var(--linea)}
.c-indice ol::before{content:'';position:absolute;left:-1px;top:0;width:2px;height:44px;background:var(--noche);
  transform:translateY(calc(var(--k,0) * 44px));transition:transform 320ms var(--ease-in-out)}
.c-indice a{display:flex;align-items:center;gap:14px;height:44px;padding-left:18px;font-size:15px;font-weight:500;color:var(--tinta-suave);text-decoration:none;transition:color 200ms ease}
.c-indice a span{font:500 11px/1 var(--mono);letter-spacing:.18em}
.c-indice a[aria-current="true"]{color:var(--tinta)}
.c-indice a[aria-current="true"] span{color:var(--petroleo)}
@media (hover:hover) and (pointer:fine){.c-indice a:hover{color:var(--tinta)}}

.c-caps{min-width:0}
.c-cap{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,6fr);column-gap:clamp(32px,4vw,64px);row-gap:36px;align-items:start;
  padding-block:clamp(56px,7vw,96px);border-top:1px solid var(--linea-fuerte)}
.c-cap:first-child{padding-top:0;border-top:0}
.c-num{font:500 clamp(44px,4.4vw,64px)/1 var(--mono);letter-spacing:-.02em;color:var(--petroleo)}
.c-cap h2{margin-top:20px;font-size:clamp(36px,3.9vw,54px);line-height:1.02;letter-spacing:-.04em;color:var(--tinta)}
.c-sub{margin-top:10px;font-size:clamp(18px,1.55vw,21px);line-height:1.35;font-weight:500;color:var(--tinta-media)}
.c-desc{margin-top:22px;max-width:34em;font-size:17px;line-height:1.65;color:var(--tinta-media);text-wrap:pretty}
.c-desc-2{margin-top:16px;font-size:16px}
.c-construye{list-style:none;margin-top:14px;max-width:30em;border-top:1px solid var(--linea);counter-reset:c}
.c-construye li{display:flex;gap:14px;align-items:baseline;padding:10px 0;border-bottom:1px solid var(--linea);font-size:16.5px;font-weight:500;color:var(--tinta)}
.c-construye li::before{content:counter(c,lower-alpha);counter-increment:c;flex:none;width:14px;font:500 11px var(--mono);letter-spacing:.14em;color:var(--verde-hoja)}

/* esquema: el mismo de antes (gx-* de paginas.css), se dibuja una vez al entrar */
.c-graf{margin:0;border-radius:var(--r);overflow:hidden}
.c-graf .eyebrow{letter-spacing:.14em}
.c-graf :is(.ap,.dib,.cre,.pop,.late){transform-box:fill-box}
.anim .c-graf:not(.play) :is(.ap,.pop,.late,.cre){opacity:0}
.anim .c-graf:not(.play) .dib{stroke-dasharray:1;stroke-dashoffset:1}

/* Necesitamos / Te llevás: dos columnas separadas por filete, alineadas con el texto y el esquema */
.c-np{grid-column:1/-1;display:grid;grid-template-columns:subgrid;border-top:1px solid var(--linea-fuerte);padding-top:20px}
.c-np>div{min-width:0}
.c-np .c-lleva{border-left:1px solid var(--linea-fuerte);padding-left:24px}
.c-np dt{font:500 11px/1.3 var(--mono);letter-spacing:.2em;text-transform:uppercase;color:var(--tinta-suave)}
.c-np dd{margin-top:8px;font-size:16px;line-height:1.5;color:var(--tinta-media);max-width:30em}
.c-np .c-lleva dd{font-size:18px;font-weight:600;line-height:1.4;letter-spacing:-.01em;color:var(--tinta)}

.c-cta{margin-top:8px;padding-top:28px;border-top:1px solid var(--linea-fuerte)}
.c-cta .lp-link{color:var(--petroleo)}
@media (hover:hover) and (pointer:fine){.c-cta .lp-link:hover{text-decoration:underline;text-underline-offset:5px}}

/* ═══ 3 · CUATRO MIRADAS ═════════════════════════════════ */
.c-miradas{background:var(--claro);padding-block:clamp(72px,8vw,120px)}
.c-miradas h2{font-size:clamp(30px,3.4vw,46px);line-height:1.06;letter-spacing:-.04em}
.c-mv{list-style:none;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));margin-top:clamp(36px,4vw,56px);border-top:1px solid var(--linea-fuerte)}
.c-mv li{min-width:0;padding:28px clamp(16px,1.8vw,28px) 4px}
.c-mv li+li{border-left:1px solid var(--linea)}
.c-mv li:first-child{padding-left:0}
.c-mv li:last-child{padding-right:0}
.c-mv b{display:block;font-size:22px;font-weight:700;letter-spacing:-.025em;line-height:1.2}
.c-mv-s{display:block;margin-top:6px;font-size:16px;font-weight:500;line-height:1.4;color:var(--tinta)}
.c-mv p{margin-top:14px;font-size:15px;line-height:1.6;color:var(--tinta-media);text-wrap:pretty}

/* ═══ 4 · DESPUÉS DE ENTREGAR ════════════════════════════ */
.c-despues{background:var(--noche);color:var(--claro);--fuerte:var(--claro);padding-block:clamp(80px,9vw,136px)}
.c-despues .c-eyebrow-b{color:var(--azul-gris)}
.c-despues h2{margin-top:18px;font-size:clamp(32px,3.8vw,52px);line-height:1.04;letter-spacing:-.04em}
.c-despues h2 .serif{color:var(--salvia-claro);font-size:.7em;line-height:1.12;margin-top:12px}
.c-despues-cab{display:grid;grid-template-columns:minmax(0,6fr) minmax(0,5fr);gap:clamp(40px,6vw,96px);align-items:end;margin-bottom:clamp(48px,6vw,80px)}
.c-despues-txt{margin-top:22px;max-width:32em;font-size:17px;line-height:1.6;color:var(--texto-2)}
.c-mant{list-style:none;border-top:1px solid var(--filete-claro)}
.c-mant li{display:grid;grid-template-columns:minmax(0,12em) minmax(0,1fr);gap:4px 24px;align-items:baseline;padding:16px 0;border-bottom:1px solid var(--filete-claro)}
.c-mant b{font-size:16.5px;font-weight:600;letter-spacing:-.01em;line-height:1.35}
.c-mant span{font-size:15px;line-height:1.5;color:var(--texto-2)}

/* informe de muestra: mismo componente (.ft de paginas.js), marco con filetes en vez de cajas */
.c-ft{column-gap:clamp(24px,3.4vw,56px);row-gap:18px}
.c-ft .ft-tabs{gap:0;border-top:1px solid var(--filete-claro)}
.c-ft .ft-tab{background:none;border:0;border-bottom:1px solid var(--filete-claro);border-radius:0;padding:16px 0 18px;color:var(--texto-2);transition:color 200ms ease}
.c-ft .ft-tab b{color:inherit}
.c-ft .ft-tab small{color:rgba(230,237,240,.66)}
.c-ft .ft-tab[aria-selected="true"]{background:none;border-color:var(--filete-claro);color:var(--claro)}
.c-ft .ft-tab[aria-selected="true"] small{color:var(--texto-2)}
.c-ft .ft-tab .barra{bottom:-1px;height:2px}
/* sin rotación (celular o movimiento reducido) la pestaña elegida se marca con un filete claro */
.c-ft:not(.auto) .ft-tab[aria-selected="true"]{box-shadow:inset 0 -2px 0 var(--claro)}
@media (hover:hover) and (pointer:fine){.c-ft .ft-tab:hover{color:var(--claro);border-color:var(--filete-claro)}}
.c-ft .ft-panel{background:none;border:0;border-radius:0;overflow:visible}
.c-ft .hoja{background:var(--blanco);border-radius:var(--r)}
.c-ft .ft-pie{background:none;border:0;padding:16px 0 0}
.c-ft .ft-pie p{font-size:15px;color:var(--texto-2);max-width:46em}
/* montos completos: si no entran, la fuente baja; no se abrevian */
.c-ft .hoja-kpis b{font-size:clamp(16px,1.45vw,21px)}
.c-ft .resul li>em{font-size:clamp(9.5px,.8vw,11.5px);letter-spacing:-.01em;white-space:nowrap}
.c-ft .antig li{grid-template-columns:minmax(0,1fr) 7.6em}  /* columna fija: las barras quedan del mismo largo aunque el monto sea más ancho */
.c-ft .antig b{white-space:nowrap}
.c-ft .hoja-tabla td{white-space:nowrap}
/* el naranja de alerta como texto chico da 3,2:1 sobre blanco: el texto va en el naranja oscuro de los esquemas (7,0:1); barras y rayado siguen en naranja */
.c-ft .resul li.raya>em,.c-ft .antig li.alerta b,.c-ft .hoja-tabla tr.alerta td:last-child{color:#9A3A12}
.c-despues .inf-nota{margin-top:20px;font-size:13.5px;color:var(--texto-2)}

/* ═══ 5 · UN DÍA EN INFYN ═══════════════════════════════ */
.c-dia{background:var(--petroleo);color:var(--claro);--fuerte:var(--claro);padding-block:clamp(80px,9vw,128px)}
.c-dia-grid{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:clamp(40px,6vw,96px);align-items:center}
.c-dia .c-eyebrow{color:var(--salvia-claro)}
.c-dia .c-eyebrow i{background:var(--salvia-claro)}
.c-dia h2{font-size:clamp(32px,3.8vw,52px);line-height:1.04;letter-spacing:-.04em}
.c-dia h2 .serif{color:var(--salvia-claro);font-size:.7em;line-height:1.12;margin-top:12px}
.c-dia-txt>p:not([class]){margin-top:22px;max-width:32em;font-size:17px;line-height:1.6;color:var(--texto-2)}
.c-dia-nota{margin-top:28px;font:500 11px/1.4 var(--mono);letter-spacing:.2em;text-transform:uppercase;color:var(--salvia-claro)}
.dia-cel{position:relative;width:min(300px,78vw);aspect-ratio:9/16;border-radius:38px;padding:10px;background:#0F1720;border:1px solid rgba(230,237,240,.16)}
.dia-cel video{display:block;width:100%;height:100%;object-fit:cover;border-radius:29px;background:var(--noche-medio)}
.dia-pausa{position:absolute;right:22px;bottom:22px;--ctl:var(--claro);background:rgba(30,48,69,.72);border:1px solid rgba(230,237,240,.3);border-radius:999px;padding:9px 14px}
.dia-pausa::after{inset:-8px -6px}
.dia-pausa:focus-visible{outline:2px solid var(--lima);outline-offset:2px}

/* ═══ 6 · EQUIPO ═════════════════════════════════════════ */
.c-red{background:var(--claro);padding-block:clamp(80px,9vw,128px)}
.c-red-cab{max-width:46em;margin-bottom:clamp(40px,5vw,64px)}
.c-red-cab h2{margin-top:18px;font-size:clamp(32px,3.8vw,52px);line-height:1.04;letter-spacing:-.04em}
.c-red-cab h2 .serif{font-size:.7em;margin-top:12px}
.c-red-cab>p:not([class]){margin-top:20px;max-width:38em;font-size:17px;line-height:1.6;color:var(--tinta-media)}
.c-red-preg{margin-bottom:12px;font:500 11px/1.3 var(--mono);letter-spacing:.2em;text-transform:uppercase;color:var(--tinta-suave)}
@keyframes cRedLlenar{to{transform:scaleX(1)}}

.c-sofia{display:flex;align-items:center;gap:14px;margin-top:20px}
.c-sofia img{width:56px;height:56px;border-radius:50%;object-fit:cover;flex:none}
.c-sofia b{font-size:18px;font-weight:600;letter-spacing:-.015em}
/* las áreas cuelgan de un filete que baja desde la foto; las que entran se conectan con un trazo */
.c-red-nota{margin-top:28px;max-width:44em;font-size:15px;color:var(--tinta-media)}
.c-red-nota em{font-family:var(--serif);font-style:italic;font-size:1.18em;color:var(--verde-hoja)}

/* ═══ 7 · CIERRE (el de la home) ════════════════════════ */
.cierre-b{color:var(--claro);--fuerte:var(--claro);padding-block:clamp(88px,10vw,140px);
  background:radial-gradient(60% 80% at 0% 100%, rgba(34,79,85,.85) 0%, rgba(34,79,85,0) 70%),var(--noche)}
.cierre-b .wrap{display:grid;grid-template-columns:minmax(0,7fr) minmax(0,5fr);gap:40px;align-items:end}
.cierre-b h2{font-size:clamp(34px,4.6vw,64px);line-height:1.02;letter-spacing:-.045em}
.cierre-b h2 .serif{display:block;color:var(--salvia-claro);font-size:.66em;margin-top:12px}
.cierre-acc{justify-self:end}
.btn-b{display:inline-flex;align-items:center;gap:12px;font:500 16px/1 var(--sans);padding:17px 22px;border-radius:2px;text-decoration:none;border:1px solid transparent;
  transition:background-color 200ms ease,border-color 200ms ease,transform 160ms var(--ease-out)}
.btn-b:active{transform:scale(.97)}
.btn-b .flecha{transition:transform 200ms var(--ease-out)}
.btn-lima-b{background:var(--lima);color:var(--tinta)}
@media (hover:hover) and (pointer:fine){.btn-lima-b:hover{background:#CEDF79}.btn-b:hover .flecha{transform:translateX(3px)}}
.micro{margin-top:16px;font:500 11px/1.4 var(--mono);letter-spacing:.18em;text-transform:uppercase;color:rgba(230,237,240,.72)}

/* ════════ RESPONSIVE ════════ */
@media (max-width:1180px){
  .c-cap{grid-template-columns:minmax(0,1fr);row-gap:28px}
  .c-graf{max-width:620px}
  .c-np{grid-template-columns:minmax(0,1fr) minmax(0,1fr);column-gap:0}
  .c-np>div:first-child{padding-right:24px}
}
@media (max-width:1000px){
  .c-mv{grid-template-columns:repeat(2,minmax(0,1fr))}
  .c-mv li:nth-child(odd){padding-left:0;border-left:0}
  .c-mv li:nth-child(even){padding-right:0}
  .c-mv li:nth-child(n+3){border-top:1px solid var(--linea);margin-top:20px}
}
@media (max-width:900px){
  .c-ft .ft-tabs{gap:24px;border-top:0;border-bottom:1px solid var(--filete-claro)}
  .c-ft .ft-tab{border-bottom:0;padding:12px 0 14px}
  .c-hero .wrap,.c-despues-cab,.cierre-b .wrap{grid-template-columns:1fr}
  .c-hero .wrap{gap:44px}
  .c-pasos-grid{grid-template-columns:1fr}
  .c-indice{display:none}
  .cierre-acc{justify-self:start}
}
@media (max-width:800px){
  .c-dia-grid{grid-template-columns:1fr}
  .dia-cel{justify-self:center}
}
@media (max-width:600px){
  .c-graf .eyebrow{flex-direction:column;gap:2px;letter-spacing:.1em}
  .c-graf .eyebrow span{text-wrap:balance}
  .c-mv{grid-template-columns:1fr}
  .c-mv li,.c-mv li:nth-child(odd),.c-mv li:nth-child(even){padding:24px 0 4px;border-left:0}
  .c-mv li+li{border-top:1px solid var(--linea);margin-top:20px}
  .c-np{grid-template-columns:1fr;row-gap:18px}
  .c-np>div:first-child{padding-right:0}
  .c-np .c-lleva{border-left:0;padding-left:0;padding-top:18px;border-top:1px solid var(--linea)}
  .c-mant li{grid-template-columns:1fr}
}
@media (max-width:560px){
  .c-hero{padding-top:44px;padding-bottom:64px}
  .c-bajada{font-size:16.5px}
  .c-hero-indice b{font-size:17px}
  .c-hero-indice small{font-size:13.5px}
  .c-cap{padding-block:48px}
  .c-cap:first-child{padding-top:0}
  .c-desc{font-size:16.5px}
  .c-ft .hoja-kpis b{font-size:17px}
  .c-ft .hoja-tabla{font-size:12.5px}
  .c-ft .hoja-tabla th:nth-child(2),.c-ft .hoja-tabla th:nth-child(3){letter-spacing:.06em}
}

/* ═══ movimiento reducido: todo en su estado final, quieto ═══ */
@media (prefers-reduced-motion:reduce){
}

/* Equipo, quieto (2026-10-07): Sofía al frente y las áreas de la red en una línea */
.c-eq-fila{display:grid;grid-template-columns:auto minmax(0,1fr);gap:clamp(28px,5vw,72px);align-items:center;padding-block:28px;border-block:1px solid var(--linea-fuerte)}
.c-eq-fila .c-sofia{margin-top:0}
.c-eq-fila .c-sofia img{width:64px;height:64px}
.c-eq-areas ul{list-style:none;display:flex;flex-wrap:wrap;row-gap:6px;margin-top:10px}
.c-eq-areas li{font-size:18px;font-weight:500;letter-spacing:-.01em;color:var(--tinta)}
.c-eq-areas li+li::before{content:'·';margin:0 14px;color:var(--azul-gris)}
@media (max-width:700px){.c-eq-fila{grid-template-columns:1fr;gap:20px}.c-eq-areas ul{display:grid;grid-template-columns:1fr 1fr;gap:10px 16px}.c-eq-areas li{font-size:16.5px}.c-eq-areas li+li::before{content:none}}