/* ============ ESCENARIO: relato por scroll ============ */
.scrolly{position:relative}
.scene{position:relative}
.scene__pin{position:sticky;top:0;height:100svh;display:flex;flex-direction:column;align-items:center;
  justify-content:center;gap:clamp(14px,2vh,26px);padding:clamp(64px,9vh,96px) var(--pad) clamp(28px,5vh,52px)}
.scene__frame{position:relative;width:min(94vw,1240px);aspect-ratio:16/9.6;max-height:66svh;overflow:hidden;
  border:1px solid var(--line);background:#05060A;will-change:transform,filter}
.scene__veil{position:absolute;inset:0;background:var(--ground);pointer-events:none;z-index:5;opacity:0}
.scene__meta{display:flex;flex-wrap:wrap;gap:8px 22px;align-items:baseline;justify-content:center;text-align:center;
  width:min(94vw,1240px)}
.scene__meta .n{font-family:var(--f-mono);font-size:10px;letter-spacing:.2em;color:var(--muted)}
.scene__meta .nm{font-family:var(--f-head);font-size:clamp(17px,2.1vw,27px);letter-spacing:-.03em;line-height:1}
.scene__meta .sc{font-family:var(--f-mono);font-size:10px;letter-spacing:.18em;text-transform:uppercase;color:var(--muted)}
.scene__meta a{border-bottom:1px solid var(--line-2);padding-bottom:2px}
.scene__meta a:hover{color:var(--ice);border-color:var(--ice)}

/* lienzo interior de cada hero */
.rep{position:absolute;inset:0;overflow:hidden;background:#05060A}
.rep img,.rep canvas{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;display:block}
.rep .ui{position:absolute;inset:0;z-index:3}
.rep .bar2{position:absolute;top:0;left:0;right:0;display:flex;justify-content:space-between;align-items:center;
  padding:2.1% 3%;font-size:clamp(6px,.78vw,10px);letter-spacing:.2em;text-transform:uppercase}
.rep .nav2{display:flex;gap:1.6em}
.rep h4{margin:0;font-weight:inherit}

/* Kreas */
.rep--kreas{background:#0b0d10}
.rep--kreas .bands{position:absolute;inset:0;display:flex;z-index:1}
.rep--kreas .bands i{flex:1;background-size:cover;background-position:center top;opacity:0;transform:translateY(8%);
  border-right:1px solid rgba(255,255,255,.06)}
.rep--kreas .bands i:last-child{border-right:0}
.rep--kreas .grad{position:absolute;inset:0;z-index:2;
  background:linear-gradient(180deg,rgba(6,8,12,.72) 0%,rgba(6,8,12,.1) 30%,rgba(6,8,12,.28) 62%,rgba(6,8,12,.86) 100%)}
.rep--kreas .bar2{color:rgba(240,236,226,.86);font-family:var(--f-mono)}
.rep--kreas .ttl{position:absolute;left:0;right:0;top:44%;transform:translateY(-50%);text-align:center;
  font-family:"Archivo Black",Impact,sans-serif;font-size:clamp(22px,4.9vw,64px);line-height:.94;letter-spacing:-.035em;
  color:#F3EFE5;padding:0 4%}
.rep--kreas .ttl .ln{display:block;overflow:hidden}
.rep--kreas .ttl .ln span{display:block}
.rep--kreas .deck{position:absolute;left:50%;transform:translateX(-50%);top:60%;width:min(60%,560px);text-align:center;
  font-size:clamp(8px,1.05vw,14px);line-height:1.6;color:rgba(243,239,229,.82)}
.rep--kreas .labels{position:absolute;left:0;right:0;bottom:3.2%;display:grid;grid-template-columns:repeat(7,1fr);text-align:center;
  font-family:var(--f-mono);font-size:clamp(5.5px,.68vw,9px);letter-spacing:.2em;color:rgba(243,239,229,.62)}

/* Casa Segovia */
.rep--cs{background:#F0E7D4}
.rep--cs .plate{transform-origin:center 62%;will-change:transform}
.rep--cs .wash{position:absolute;inset:0;z-index:2;pointer-events:none;
  background:radial-gradient(46% 42% at 50% 52%, rgba(244,236,220,.88) 0%, rgba(244,236,220,.55) 42%, rgba(244,236,220,0) 72%)}
.rep--cs .lock{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);z-index:3;display:flex;
  flex-direction:column;align-items:center;gap:1.6%}
.rep--cs .lock img{position:static;width:clamp(48px,9.4vw,132px);height:auto;object-fit:contain}
.rep--cs .word{font-family:"Bodoni Moda",Georgia,serif;font-size:clamp(15px,3.5vw,46px);letter-spacing:.02em;
  color:#171310;display:flex;white-space:pre}
.rep--cs .word i{font-style:normal;display:inline-block}
.rep--cs .bar2{color:#5C4A32;font-family:var(--f-mono)}
.rep--cs .foot2{position:absolute;left:0;right:0;bottom:0;display:flex;justify-content:space-between;padding:2.1% 3%;
  font-family:var(--f-mono);font-size:clamp(5.5px,.68vw,9px);letter-spacing:.2em;text-transform:uppercase;color:#7A6647}

/* El Vintén */
.rep--ev{background:#0d0b08}
.rep--ev .grad{position:absolute;inset:0;z-index:2;background:linear-gradient(180deg,rgba(20,16,11,.5),rgba(20,16,11,.12) 40%,rgba(20,16,11,.72))}
.rep--ev .bar2{color:rgba(245,238,226,.9);font-family:var(--f-mono)}
.rep--ev .mid{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;
  text-align:center;z-index:3;gap:2.2%}
.rep--ev .eye{font-family:var(--f-mono);font-size:clamp(5.5px,.7vw,9.5px);letter-spacing:.34em;text-transform:uppercase;
  color:rgba(245,238,226,.78)}
.rep--ev .nm2{font-family:"Bodoni Moda",Georgia,serif;font-size:clamp(24px,5.4vw,74px);line-height:1;color:#F6F0E5}
.rep--ev .sub2{font-size:clamp(8px,1vw,13.5px);color:rgba(246,240,229,.84);line-height:1.7}

/* conceptuales */
.rep--hv{background:#07090D}
.rep--hv .grad{position:absolute;inset:0;z-index:2;background:linear-gradient(180deg,rgba(4,6,10,.66),rgba(4,6,10,.12) 38%,rgba(4,6,10,.8))}
.rep--hv .bar2{color:rgba(239,234,225,.85);font-family:Jost,var(--f-body)}
.rep--hv .blk{position:absolute;left:4%;right:4%;bottom:9%;z-index:3}
.rep--hv .eye{font-family:var(--f-body);font-size:clamp(5.5px,.7vw,9.5px);letter-spacing:.4em;text-transform:uppercase;
  color:rgba(239,234,225,.7);margin-bottom:2.4%}
.rep--hv .h{font-family:"Cormorant Garamond",Georgia,serif;font-weight:300;font-size:clamp(20px,4.3vw,58px);
  line-height:1.04;color:#EFEAE1}
.rep--hv .h .ln{display:block;overflow:hidden;padding-bottom:.16em;margin-bottom:-.16em}
.rep--hv .h .ln span{display:block}

.rep--mv{background:#F1F0EC}
.rep--mv .split2{position:absolute;inset:0;display:grid;grid-template-columns:1fr 1.25fr;z-index:3}
.rep--mv .left2{padding:0 4%;display:flex;flex-direction:column;justify-content:center;gap:6%;
  border-right:1px solid #D6D4CD;background:#F1F0EC}
.rep--mv .h{font-family:Archivo,sans-serif;font-weight:300;font-size:clamp(15px,2.7vw,38px);line-height:1.05;
  letter-spacing:-.028em;color:#16171A;max-width:13ch}
.rep--mv .h b{font-weight:600}
.rep--mv .meta2{font-family:var(--f-mono);font-size:clamp(5.5px,.66vw,9px);letter-spacing:.14em;text-transform:uppercase;
  color:#7A7A73;line-height:2}
.rep--mv .right2{position:relative;overflow:hidden}
.rep--mv .right2 img{filter:grayscale(.34) contrast(1.06)}
.rep--mv .top2{position:absolute;top:0;left:0;right:0;padding:2%3%;display:flex;justify-content:space-between;
  font-size:clamp(5.5px,.66vw,9px);letter-spacing:.14em;text-transform:uppercase;color:#54544E;z-index:4;
  border-bottom:1px solid #D6D4CD;background:#F1F0EC}

.rep--rp{background:#0A1017}
.rep--rp .split2{position:absolute;inset:0;display:grid;grid-template-columns:1.1fr 1fr;z-index:3}
.rep--rp .left2{padding:0 4.4%;display:flex;flex-direction:column;justify-content:center;gap:5%}
.rep--rp .eye{font-family:var(--f-mono);font-size:clamp(5.5px,.66vw,9px);letter-spacing:.24em;text-transform:uppercase;color:#5F7285}
.rep--rp .h{font-family:"Libre Baskerville",Georgia,serif;font-size:clamp(13px,2.2vw,30px);line-height:1.28;color:#E7EAEE;max-width:17ch}
.rep--rp .p2{font-size:clamp(7px,.92vw,12px);line-height:1.75;color:#9AA7B5;max-width:40ch}
.rep--rp .right2{position:relative;overflow:hidden;border-left:1px solid #17202B}
.rep--rp .right2 img{filter:saturate(.62) brightness(.84)}
.rep--rp .top2{position:absolute;top:0;left:0;right:0;padding:2% 3%;display:flex;justify-content:space-between;
  font-family:'IBM Plex Mono',var(--f-mono);font-size:clamp(5.5px,.66vw,9px);letter-spacing:.14em;text-transform:uppercase;
  color:#7C8A99;z-index:4;border-bottom:1px solid #17202B}
.rep--rp .mk{font-family:"Libre Baskerville",Georgia,serif;letter-spacing:.06em;color:#E7EAEE;text-transform:none}

@media(max-width:700px){
  .scene__frame{aspect-ratio:4/5;max-height:58svh}
  .rep--mv .split2,.rep--rp .split2{grid-template-columns:1fr}
  .rep--mv .right2,.rep--rp .right2{display:none}
}
@media(prefers-reduced-motion:reduce){
  .scene{height:auto!important}
  .scene__pin{position:static;height:auto;padding-top:0}
  .scene__veil{display:none}
}

/* --- fichas de producto: film real y páginas en movimiento --- */
.rep--film,.rep--page{background:#0b0d10}
.rep--page img{transform-origin:center 45%}
.scene--short .scene__pin{gap:12px}
.scene__meta .pill{font-family:var(--f-mono);font-size:9px;letter-spacing:.18em;text-transform:uppercase;
  color:var(--ice);border:1px solid var(--line-2);padding:3px 8px}

/* --- Kreas en la portada: el film del novillo --- */
.rep--kfilm{background:#0b0d10}
.rep--kfilm .grad{position:absolute;inset:0;z-index:2;
  background:linear-gradient(180deg,rgba(6,8,12,.6) 0%,rgba(6,8,12,.05) 26%,rgba(6,8,12,.3) 58%,rgba(6,8,12,.88) 100%)}
.rep--kfilm .bar2{color:rgba(240,236,226,.86);font-family:var(--f-mono)}
.rep--kfilm .blk{position:absolute;left:3.4%;right:3.4%;bottom:9.5%;z-index:3}
.rep--kfilm .eye{font-family:var(--f-mono);font-size:clamp(5.5px,.66vw,9px);letter-spacing:.24em;
  text-transform:uppercase;color:rgba(243,239,229,.66);margin:0 0 2.2%}
.rep--kfilm .ttl2{font-family:"Archivo Black",Impact,sans-serif;font-size:clamp(22px,5vw,66px);line-height:.92;
  letter-spacing:-.038em;color:#F3EFE5;margin:0}
.rep--kfilm .ttl2 .ln{display:block;overflow:hidden;padding-bottom:.08em;margin-bottom:-.08em}
.rep--kfilm .ttl2 .ln span{display:block}
.rep--kfilm .deck2{margin:2.2% 0 0;max-width:34ch;font-size:clamp(7.5px,1vw,13px);line-height:1.6;
  color:rgba(243,239,229,.8)}
.rep--kfilm .tele{position:absolute;left:0;right:0;bottom:3%;z-index:3;display:flex;justify-content:space-between;
  padding:0 3.4%;font-family:var(--f-mono);font-size:clamp(5.5px,.64vw,8.5px);letter-spacing:.2em;
  text-transform:uppercase;color:rgba(243,239,229,.55)}
.rep--kfilm .tele b{font-weight:400;color:var(--ice);font-variant-numeric:tabular-nums}

/* --- sonda: mecánica reconstruida de cada producto de Kreas --- */
.rep--probe{background:#070a0d}
.rep--probe .probe{position:absolute;inset:0;display:grid;grid-template-columns:minmax(0,.62fr) minmax(0,1fr);
  gap:clamp(12px,2.4vw,40px);padding:8.5% 3.6% 7%;z-index:3}
.rep--probe .probe__left{display:flex;flex-direction:column;justify-content:center;gap:4%}
.rep--probe .eye{font-family:var(--f-mono);font-size:clamp(5.5px,.66vw,9px);letter-spacing:.24em;
  text-transform:uppercase;color:#6E7681;margin:0}
.rep--probe .num{display:flex;align-items:baseline;gap:.18em;font-family:"Archivo Black",Impact,sans-serif;
  font-size:clamp(26px,5.4vw,72px);line-height:.86;letter-spacing:-.05em;color:#F3EFE5;
  font-variant-numeric:tabular-nums}
.rep--probe .num i{font-style:normal;font-family:var(--f-mono);font-size:.24em;letter-spacing:.14em;color:var(--ice)}
.rep--probe .lbl{font-family:var(--f-mono);font-size:clamp(5.5px,.66vw,9px);letter-spacing:.2em;
  text-transform:uppercase;color:#8D959F;margin:0}
.rep--probe .note{font-size:clamp(7px,.92vw,12px);line-height:1.65;color:#8D959F;margin:0;max-width:34ch}
.rep--probe .stage2{position:relative;overflow:hidden;background:radial-gradient(60% 55% at 62% 50%,rgba(200,214,229,.07),transparent 70%)}
.rep--probe .it{position:absolute;left:5%;right:0;top:0;bottom:0;margin:0;opacity:0;display:flex;
  align-items:center;gap:5%}
.rep--probe .it img{width:50%;max-height:74%;height:auto;object-fit:contain;display:block;
  filter:drop-shadow(0 18px 40px rgba(0,0,0,.6))}
.rep--probe .it figcaption{flex:1;min-width:0}
.rep--probe .it figcaption{font-family:var(--f-mono);font-size:clamp(5.5px,.64vw,8.5px);letter-spacing:.16em;
  text-transform:uppercase;color:#9AA2AC;line-height:1.9}
.rep--probe .it figcaption b{display:block;font-family:var(--f-body);font-size:1.55em;font-weight:500;
  letter-spacing:-.01em;color:#F3EFE5;text-transform:none;margin-bottom:.3em}
.rep--probe .rule2{position:absolute;left:0;top:0;bottom:0;width:1px;background:#1B1E24}
.rep--probe .rule2 i{position:absolute;left:0;width:9px;height:1px;background:#2A2F38}
.rep--probe .cursor{position:absolute;left:-4px;width:9px;height:9px;border:1px solid var(--ice);
  background:rgba(200,214,229,.16);top:0}
.rep--probe .tint{position:absolute;inset:0;z-index:2;pointer-events:none;opacity:0;
  background:radial-gradient(70% 60% at 50% 45%, rgba(196,122,42,.85), rgba(120,66,18,.6) 55%, rgba(40,22,8,.5))}
.rep--probe .bar2{color:rgba(240,236,226,.8);font-family:var(--f-mono);z-index:4}
@media(max-width:700px){
  .rep--probe .probe{grid-template-columns:1fr;gap:8px;padding:12% 5% 8%}
  .rep--probe .it img{width:44%}
}

/* --- Hilando Culturas: carbonilla -> foto; frases escritas a mano y firma con el logotipo del manual --- */
.rep--hilado{background:#FBEFE5}
.rep--hilado canvas{background:transparent}
.rep--hilado .bar2{color:#6F6660;font-family:"Hanken Grotesk",var(--f-body);letter-spacing:.16em}
.rep--hilado .frases{position:absolute;inset:0;z-index:3;pointer-events:none}
.rep--hilado .fr{position:absolute;left:5.5%;top:50%;translate:0 -50%;margin:0;opacity:0;
  font-family:"Comforter Brush","Bradley Hand","Segoe Print",cursive;font-weight:400;
  font-size:clamp(20px,3.9vw,52px);line-height:1.06;color:#221E1B;will-change:opacity,transform}
/* cada renglon mide lo que su texto: la escritura avanza al ritmo de las letras;
   el relleno evita que la mascara corte los trazos del pincel */
.rep--hilado .fr[data-k]{display:flex;flex-direction:column;align-items:flex-start}
.rep--hilado .fr[data-k] .l{display:block;white-space:nowrap;padding:.3em .25em .35em .35em;margin:-.3em -.25em -.35em -.35em}
.rep--hilado .fr.firma{width:34%}
.rep--hilado .logo-h{position:relative;display:block;width:100%;color:#262626}
.rep--hilado .logo-h svg{display:block;width:100%;height:auto;clip-path:inset(-25% 100% -25% 0)}
.rep--hilado .hilo-f{position:absolute;left:0;width:100%;height:1.5px;background:#262626;
  top:calc(100% + clamp(6px,1vw,16px));transform:scaleX(0);transform-origin:0 50%}
.rep--hilado .entrar2{display:inline-flex;align-items:center;gap:.8em;margin-top:clamp(16px,2.8vw,40px);
  padding:.95em 1.7em;border:1px solid #221E1B;border-radius:999px;background:rgba(255,255,255,.6);
  font:500 clamp(6px,.78vw,11px)/1 "Hanken Grotesk",var(--f-body);letter-spacing:.2em;
  text-transform:uppercase;color:#221E1B;opacity:0;white-space:nowrap}
.rep--hilado .cred{position:absolute;right:2.4%;bottom:3.2%;z-index:3;margin:0;
  font:400 clamp(6px,.7vw,10px)/1 "Hanken Grotesk",var(--f-body);letter-spacing:.08em;color:#6F6660}
