/* Nosotros · el scroll enciende */
/* fondo vivo: el body deja ver las tomas fijas; las secciones son transparentes y llevan solo un velo de lectura */
body{background:transparent}
.por{background:transparent}

.sec-h{display:grid;gap:22px;justify-items:start;margin-bottom:72px}
.sec-h .t2{max-width:18ch}

/* portada: la foto va casi en su color, solo templada */
.no-por>img.fd{object-position:50% 62%;filter:grayscale(.78) contrast(1.22) brightness(.98)}
.no-por .tinte{opacity:.78}
.no-por .velo{background:linear-gradient(90deg,rgba(8,8,10,.66) 0,rgba(8,8,10,.4) 42%,rgba(8,8,10,0) 78%),linear-gradient(180deg,rgba(8,8,10,.5) 0,rgba(8,8,10,0) 24%,rgba(8,8,10,.05) 50%,rgba(8,8,10,.6) 78%,#08080A 100%)}
.no-por .in{display:grid;gap:30px;max-width:none}
.no-por .eb,.no-por .t1,.no-por .lead{text-shadow:0 2px 26px rgba(8,8,10,.75)}
.no-por .t1{max-width:16ch;font-size:clamp(46px,6.1cqw,112px)}
.no-pie{display:flex;align-items:end;justify-content:space-between;gap:40px;margin-top:26px;padding-top:30px;border-top:1px solid var(--hl)}
.desp{display:inline-flex;align-items:center;gap:14px;font:600 11.5px/1 var(--fx);letter-spacing:.26em;text-transform:uppercase;color:var(--b)}
.desp svg{width:22px;height:22px;color:var(--o);animation:baja 1.8s var(--ease) infinite}
@keyframes baja{0%{transform:translateY(-5px);opacity:0}40%{opacity:1}100%{transform:translateY(7px);opacity:0}}

/* declaración: la foto se enciende con las palabras */
.decl{position:relative;height:200vh}
.decl-st{position:sticky;top:0;height:100svh;min-height:640px;overflow:hidden;display:grid;place-items:center;--p:0}
.decl-bg{position:absolute;inset:-4%;width:108%;height:108%;filter:grayscale(.6) contrast(1.08);opacity:calc(.1 + var(--p)*.5);transform:scale(calc(1.1 - var(--p)*.1));will-change:opacity,transform}
.decl-v{position:absolute;inset:0;background:radial-gradient(70cqw 50cqw at 50% 48%,rgba(8,8,10,.5) 0,rgba(8,8,10,.88) 100%),linear-gradient(180deg,#08080A 0,rgba(8,8,10,0) 24%,rgba(8,8,10,0) 76%,#08080A 100%)}
.decl-t{position:relative;z-index:3;max-width:19ch;padding:0 var(--m);text-align:center;font:500 clamp(40px,6cqw,108px)/1.05 var(--fx);letter-spacing:-.045em;text-wrap:balance}
.decl-t span{opacity:.13;transition:opacity .25s linear}
.decl-s{position:absolute;z-index:3;left:0;right:0;bottom:11svh;padding:0 var(--m);text-align:center;font:400 clamp(15px,1.15cqw,19px)/1.5 var(--fx);color:var(--b);opacity:0;transform:translateY(14px);transition:opacity .9s var(--out),transform .9s var(--out)}
.decl-st.fin .decl-s{opacity:1;transform:none}
.decl-g{position:absolute;z-index:3;left:var(--m);bottom:6svh;display:flex;align-items:center;gap:12px;font:600 11px/1 var(--fx);letter-spacing:.24em;text-transform:uppercase;color:var(--b2);transition:opacity .5s}
.decl-g svg{width:18px;height:18px;color:var(--o);animation:baja 1.8s var(--ease) infinite}
.decl-st.fin .decl-g{opacity:0}
.decl-r{position:absolute;z-index:3;right:var(--m);top:50%;width:1px;height:26vh;margin-top:-13vh;background:var(--hl)}
.decl-r i{position:absolute;left:0;top:0;width:1px;height:calc(var(--p)*100%);background:var(--o)}

/* cómo trabajamos: índice largo; cada capítulo se enciende al cruzar el centro y su foto se abre con el scroll */
.cap{position:relative;background:linear-gradient(180deg,rgba(8,8,10,.5),rgba(8,8,10,.62) 30%,rgba(8,8,10,.62) 100%);padding:clamp(90px,9vw,150px) var(--m) clamp(40px,4vw,70px)}
.cap-l{counter-reset:c}
.cap-ct{position:sticky;top:calc(100svh - 70px);height:0;z-index:6;display:flex;justify-content:flex-end;align-items:center;gap:12px;font:600 11.5px/1 var(--fx);letter-spacing:.18em;color:var(--b2);pointer-events:none}
.cap-ct b{color:#fff;font-weight:600}.cap-ct i{width:46px;height:1px;background:var(--hl)}
.cp{--a:0;position:relative;display:grid;grid-template-columns:repeat(12,1fr);column-gap:clamp(18px,2.2cqw,40px);align-items:center;min-height:min(60svh,600px);padding:clamp(24px,2.6vw,44px) 0;border-top:1px solid var(--hl)}
.cp:last-child{border-bottom:1px solid var(--hl)}
.cp-t{grid-column:1/8;display:grid;gap:clamp(16px,1.8cqw,30px);align-content:center;transform:translate3d(calc((1 - var(--a))*-30px),0,0)}
.cp-f{grid-column:9/13;height:min(50svh,480px)}
.cp.izq .cp-t{grid-column:6/13;order:2;transform:translate3d(calc((1 - var(--a))*30px),0,0)}
.cp.izq .cp-f{grid-column:1/5;order:1}
.cp-n{font:600 12px/1 var(--fx);letter-spacing:.26em;color:var(--b2);display:flex;align-items:center;gap:14px;transition:color .4s}
.cp-n::after{content:"";height:1px;width:calc(var(--a)*90px + 24px);background:currentColor;opacity:.5}
.cp.on .cp-n{color:var(--o)}
.cp h3{font:500 clamp(40px,5.6cqw,104px)/1 var(--fx);letter-spacing:-.045em;text-wrap:balance;max-width:14ch;opacity:calc(.26 + var(--a)*.74)}
.cp p{max-width:44ch;font:400 clamp(15px,1.15cqw,19px)/1.55 var(--fx);color:var(--b);opacity:calc((var(--a) - .45)*2.2)}
.cp-fi{position:relative;width:100%;height:100%;border-radius:24px;overflow:hidden;background:#17171a;clip-path:inset(0 calc((1 - var(--a))*50%) 0 calc((1 - var(--a))*50%) round 24px);will-change:clip-path}
.cp-fi img{transform:scale(calc(1.22 - var(--a)*.2));filter:saturate(.9) brightness(.9)}
.cp-fi::after{content:"";position:absolute;inset:0;border-radius:24px;box-shadow:inset 0 0 0 1px rgba(255,255,255,.1)}

/* eventos: hoja de contactos escalonada */
.evi{background:rgba(8,8,10,.62);padding:clamp(70px,7vw,110px) var(--m) clamp(70px,7vw,110px)}
.evi-g{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(18px,2.2cqw,40px);align-items:start}
.ev-c{display:grid;gap:clamp(18px,2.2cqw,40px)}
.ev-c.c2{margin-top:clamp(50px,6.5cqw,110px)}.ev-c.c3{margin-top:clamp(100px,13cqw,220px)}
.ev{display:grid;gap:14px;cursor:default}
.ev-f{position:relative;overflow:hidden;border-radius:22px;aspect-ratio:4/5;background:#17171a;clip-path:inset(100% 0 0 0 round 22px);transition:clip-path 1.3s var(--ease);transition-delay:var(--d,0ms)}
.ev.sq .ev-f{aspect-ratio:1/1}
.ev.on .ev-f{clip-path:inset(0 0 0 0 round 22px)}
.ev-f img{--c:0;filter:grayscale(calc(1 - var(--c))) brightness(calc(.55 + var(--c)*.45)) saturate(calc(.8 + var(--c)*.25));transform:scale(1.12);transition:transform 1.6s var(--out)}
.ev.on .ev-f img{transform:scale(1.02)}
.ev:hover .ev-f img{transform:scale(1.07)}
.ev-f::after{content:"";position:absolute;inset:0;border-radius:22px;box-shadow:inset 0 0 0 1px rgba(255,255,255,.1);pointer-events:none}
.ev figcaption{display:flex;align-items:baseline;gap:14px;font:500 15px/1 var(--fx);letter-spacing:-.01em;opacity:.55;transition:opacity .4s}
.ev figcaption i{margin-left:auto;font:600 10.5px/1 var(--fx);letter-spacing:.2em;text-transform:uppercase;font-style:normal;color:var(--b2)}
.ev-c2{position:absolute;z-index:2;left:16px;top:16px;padding:9px 13px;border-radius:999px;background:rgba(8,8,10,.5);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);box-shadow:inset 0 0 0 1px rgba(255,255,255,.16);font:600 10.5px/1 var(--fx);letter-spacing:.2em;text-transform:uppercase}
.ev-n{position:absolute;z-index:2;left:18px;bottom:8px;font:500 clamp(56px,6cqw,104px)/1 var(--fx);font-style:normal;letter-spacing:-.06em;color:transparent;-webkit-text-stroke:1.2px rgba(255,255,255,.7);opacity:calc(.5 + var(--c,0)*.5)}
.ev-f::before{content:"";position:absolute;z-index:1;inset:0;background:linear-gradient(180deg,rgba(8,8,10,0) 55%,rgba(8,8,10,.6) 100%)}
.ev.lit figcaption,.ev:hover figcaption{opacity:1}

/* clientes: celdas que se encienden una a una */
.cli{position:relative;background:rgba(8,8,10,.62);padding:clamp(80px,8vw,130px) var(--m) clamp(90px,9vw,140px)}
.cli-g{display:grid;grid-template-columns:repeat(4,1fr);gap:1px;background:var(--hl);border:1px solid var(--hl);border-radius:24px;overflow:hidden;backdrop-filter:blur(2px)}
.cli-g li{position:relative;display:grid;place-items:center;align-content:center;gap:12px;min-height:clamp(170px,16cqw,280px);background:rgba(12,12,14,.7);transition:background-color .5s}
.cli-g li u{display:grid;place-items:center;width:clamp(50px,4cqw,70px);aspect-ratio:1;border-radius:50%;box-shadow:inset 0 0 0 1px var(--hl);font:500 clamp(14px,1.2cqw,19px)/1 var(--fx);letter-spacing:.04em;text-decoration:none;opacity:.2;transition:opacity .9s var(--out),box-shadow .6s}
.cli-g li b{font:600 clamp(12px,.95cqw,15px)/1 var(--fx);letter-spacing:.3em;text-transform:uppercase;opacity:.2;transition:opacity .9s var(--out)}
.cli-g li small{font:500 11px/1 var(--fx);letter-spacing:.16em;text-transform:uppercase;color:var(--b2);opacity:0;transition:opacity .9s .15s}
.cli-g li .num{position:absolute;left:18px;top:16px;font:600 11px/1 var(--fx);letter-spacing:.14em;color:var(--b2);opacity:0;transition:opacity .9s}
.cli-g li::before{content:"";position:absolute;left:0;right:0;top:0;height:2px;background:var(--o);transform:scaleX(0);transform-origin:0 50%;opacity:0}
.cli-g li.on u{opacity:1;box-shadow:inset 0 0 0 1px rgba(255,255,255,.5)}.cli-g li.on b{opacity:.95}.cli-g li.on small,.cli-g li.on .num{opacity:1}
.cli-g li.on::before{animation:barre 1.6s var(--ease) both}
@keyframes barre{0%{transform:scaleX(0);opacity:1}55%{transform:scaleX(1);opacity:1}100%{transform:scaleX(1);opacity:0}}
.cli-g li:hover{background:rgba(30,30,34,.85)}.cli-g li:hover b{opacity:1}

/* cierre */
.cie{position:relative;overflow:hidden;min-height:78svh;display:grid;align-items:center;background:rgba(8,8,10,.45)}
.cie-bg{position:absolute;inset:0;filter:grayscale(.35) brightness(.7) contrast(1.05)}
.cie-v{position:absolute;inset:0;background:linear-gradient(180deg,rgba(8,8,10,.62) 0,rgba(8,8,10,.2) 45%,rgba(8,8,10,.55) 100%)}
.cie-in{position:relative;z-index:3;padding:120px var(--m);display:grid;gap:26px;justify-items:start}
.cie-in .t1{max-width:13ch}
.cie-a{display:flex;gap:12px;margin-top:14px;flex-wrap:wrap}

@media (max-width:900px){
 .no-pie{flex-direction:column;align-items:start}
 .decl{height:300vh}
 .no-por .velo{background:linear-gradient(180deg,rgba(8,8,10,.6) 0,rgba(8,8,10,.36) 26%,rgba(8,8,10,.7) 58%,#08080A 100%)}
 .cp{min-height:0}.cp h3{font-size:34px}
 .cp-t,.cp.izq .cp-t{grid-column:1/-1;order:1;transform:none}.cp-f,.cp.izq .cp-f{grid-column:1/-1;order:2;height:46svh;margin-top:24px}
 .evi-g{grid-template-columns:1fr 1fr}.ev-c.c3{grid-column:1/-1;margin-top:0;grid-template-columns:1fr 1fr}
 .cli-g{grid-template-columns:1fr 1fr}
 .ev-c2{left:10px;top:10px;padding:7px 10px;font-size:9.5px!important;letter-spacing:.14em}
}

.ev-c2{font-size:12px!important}
/* secciones en espera de datos reales (eventos recientes y marcas): se quitan el atributo hidden cuando existan */
.evi[hidden],.cli[hidden]{display:none}

/* "Siga bajando" bien presente (14 oct 2026) */
.desp,.decl-g{padding:13px 22px 13px 24px;border-radius:999px;font-size:13.5px;letter-spacing:.2em;color:#fff;background:rgba(8,8,10,.55);box-shadow:inset 0 0 0 1px rgba(255,255,255,.4);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}
.desp svg,.decl-g svg{width:20px;height:20px}
@media (max-width:900px){.desp,.decl-g{font-size:13px;padding:12px 20px 12px 22px}}