/* Fase 1 · 6-nov-2026 · Mondrian vivo, deslizador, plano ancho, videos, registro de descargas */
:root{--mr:#DD0100;--my:#FAC901;--mb:#225095;--mk:#0B0B0B;--ro:#DD0100;--az:#225095;--am:#FAC901}
.vt button[aria-pressed=true],.pl-tabs button[aria-pressed=true]{background:var(--my)!important;color:#0b0b0b!important;border-color:var(--my)!important}
/* franja Mondrian viva arriba de cada sección */
.mstrip{display:flex;height:6px;width:100%;overflow:hidden;pointer-events:none}
.mstrip i{flex:1;background:var(--mk);transition:flex 1.4s var(--e-rev,ease)}
.mstrip i:nth-child(2){background:var(--mr)}.mstrip i:nth-child(4){background:var(--my)}.mstrip i:nth-child(6){background:var(--mb)}
.mstrip i:nth-child(odd){flex:.35}
/* aparición al hacer scroll */
.rv0{opacity:0;transform:translateY(28px);transition:opacity .9s var(--e-rev,ease),transform .9s var(--e-rev,ease)}
.rv1{opacity:1;transform:none}
/* cursor propio (solo mouse) */
#cur,#cur2{position:fixed;left:0;top:0;pointer-events:none;z-index:9999;border-radius:50%;transform:translate(-50%,-50%);mix-blend-mode:difference}
#cur,#cur2{opacity:0}body.cur-on #cur,body.cur-on #cur2{opacity:1}#cur{width:8px;height:8px;background:#fff}
#cur2{width:38px;height:38px;border:1.5px solid #fff;transition:width .25s,height .25s,background .25s,border-color .25s}
#cur2.on{width:74px;height:74px;background:rgba(250,201,1,.25);border-color:var(--my);mix-blend-mode:normal}
@media (pointer:coarse){#cur,#cur2{display:none}}
/* imágenes y tarjetas con vida */
.lift{transition:transform .5s var(--e-rev,ease),box-shadow .5s}
.lift:hover{transform:translateY(-6px) scale(1.01);box-shadow:0 18px 40px rgba(0,0,0,.45)}
a.btn,a.btn2,button.btn,button.btn2{position:relative;overflow:hidden}
a.btn:after,a.btn2:after{content:"";position:absolute;left:-60%;top:0;width:40%;height:100%;background:linear-gradient(90deg,transparent,rgba(255,255,255,.35),transparent);transform:skewX(-20deg);animation:shine 4.5s infinite}
@keyframes shine{0%,70%{left:-60%}100%{left:130%}}
/* collage Mondrian con movimiento */
.mlive{position:relative}
.mlive:before,.mlive:after{content:"";position:absolute;z-index:3;pointer-events:none;border:3px solid #0b0b0b}
.mlive:before{width:46px;height:46px;right:-14px;top:-14px;background:var(--mr);animation:mb1 7s ease-in-out infinite}
.mlive:after{width:34px;height:70px;left:-12px;bottom:-12px;background:var(--mb);animation:mb2 9s ease-in-out infinite}
@keyframes mb1{0%,100%{transform:scale(1);background:var(--mr)}33%{transform:scale(1.35);background:var(--my)}66%{transform:scale(.8);background:var(--mb)}}
@keyframes mb2{0%,100%{transform:translateY(0);background:var(--mb)}50%{transform:translateY(-40px);background:var(--mr)}}
.mdot{position:absolute;z-index:4;width:14px;height:14px;background:var(--my);border:2px solid #0b0b0b;pointer-events:none;animation:md 12s linear infinite}
@keyframes md{0%{left:0;top:0}25%{left:calc(100% - 14px);top:0}50%{left:calc(100% - 14px);top:calc(100% - 14px)}75%{left:0;top:calc(100% - 14px)}100%{left:0;top:0}}
/* deslizador obra negra / terminado */
.cmp,.cmp.sl{clip-path:none!important;transform:none!important}
.cmp-ver{display:none!important}
.cmp .hnd{position:absolute;top:50%;left:50%;width:62px;height:62px;margin:-31px 0 0 -31px;border-radius:50%;background:var(--my);border:3px solid #0b0b0b;z-index:5;display:grid;place-items:center;font:700 20px/1 var(--sans);color:#0b0b0b;box-shadow:0 0 0 0 rgba(250,201,1,.7);animation:pulse 1.8s infinite;pointer-events:none}
.cmp .bar{width:4px!important;background:var(--my)!important;z-index:4}
.cmp .bar:after{display:none}
.cmp .lb1,.cmp .lb2{z-index:5;font-size:14px!important;padding:8px 12px!important;background:rgba(11,11,11,.8)!important;color:#fff!important}
.cmp .lb1{border-top:4px solid var(--mb)}.cmp .lb2{border-top:4px solid var(--mr)}
.cmp-tip{margin:8px 0 0;font-weight:650}
@keyframes pulse{0%{box-shadow:0 0 0 0 rgba(250,201,1,.7)}70%{box-shadow:0 0 0 22px rgba(250,201,1,0)}100%{box-shadow:0 0 0 0 rgba(250,201,1,0)}}
.cmpsel button{transition:transform .3s,box-shadow .3s}.cmpsel button:hover{transform:translateY(-4px);box-shadow:0 0 0 3px var(--my)}
/* plano a todo lo ancho */
#plw.full{width:100%;max-width:none;margin:22px 0 0}
#plw.full .pl-img{max-height:none}
/* videos apilados */
.vstack{display:grid;gap:56px;margin-top:26px}
.vstack figure{margin:0}
.vstack h4{font:400 clamp(22px,2.4vw,34px)/1.15 var(--ser);margin:0 0 12px}
.vstack .k{display:inline-block;font:600 12px var(--sans);letter-spacing:.18em;text-transform:uppercase;padding:5px 10px;margin-bottom:10px;color:#0b0b0b}
.vstack .k.r{background:var(--mr);color:#fff}.vstack .k.y{background:var(--my)}.vstack .k.b{background:var(--mb);color:#fff}
.vstack video{width:100%;aspect-ratio:16/9;background:#000;display:block;object-fit:cover}
.vlogo{height:46px;width:auto;margin:12px 0 0;display:block}
.vplay{position:absolute;inset:0;display:grid;place-items:center;background:transparent;border:0;cursor:pointer;z-index:3}
.vplay span{width:96px;height:96px;border-radius:50%;background:var(--my);border:4px solid #0b0b0b;display:grid;place-items:center;animation:pulse 1.8s infinite;transition:transform .3s}
.vplay span:before{content:"";border-left:30px solid #0b0b0b;border-top:18px solid transparent;border-bottom:18px solid transparent;margin-left:8px}
.vplay:hover span{transform:scale(1.12)}
.vplay em{position:absolute;bottom:18px;left:18px;font:600 13px var(--sans);letter-spacing:.14em;text-transform:uppercase;background:#0b0b0b;color:#fff;padding:8px 12px;font-style:normal}
.vwrap{position:relative}
/* impacto social */
.imp{border:1px solid var(--ln);display:grid;grid-template-columns:1.1fr .9fr}
.imp>div{padding:clamp(20px,3vw,40px)}
.imp .n{display:grid;grid-template-columns:1fr 1fr;gap:14px;margin:18px 0}
.imp .n div{padding:16px;border-left:6px solid var(--mr);background:rgba(255,255,255,.04)}
.imp .n div+div{border-color:var(--mb)}
.imp .n b{display:block;font:400 44px/1 var(--ser);color:var(--my)}
@media (max-width:860px){.imp{grid-template-columns:1fr}.imp .n{grid-template-columns:1fr}}
/* contado 601 / 602 */
.cont{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px;margin:26px 0}
.cont a{display:block;text-decoration:none;color:inherit;border:3px solid var(--my);padding:22px;position:relative;background:linear-gradient(135deg,rgba(250,201,1,.1),transparent)}
.cont a:before{content:"CONTADO";position:absolute;top:-3px;right:-3px;background:var(--mr);color:#fff;font:700 12px var(--sans);letter-spacing:.18em;padding:6px 10px}
.cont b.p{display:block;font:400 clamp(32px,4vw,52px)/1 var(--ser);color:var(--my);margin:6px 0}
.cont s{opacity:.7}
.cont ul{margin:10px 0 0;padding-left:18px}
@media (max-width:760px){.cont{grid-template-columns:1fr}}
/* piso entero */
.pe{display:grid;grid-template-columns:1.2fr 1fr;gap:0;border:1px solid var(--ln);overflow:hidden}
.pe figure{margin:0;position:relative;min-height:340px}
.pe figure img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transition:transform 6s ease}
.pe:hover figure img{transform:scale(1.08)}
.pe .tx{padding:clamp(22px,3vw,44px)}
.pe .tx h3{font:400 clamp(28px,3vw,44px)/1.1 var(--ser);margin:0 0 12px}
.pe .dt{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin:18px 0}
.pe .dt div{border-top:4px solid var(--my);padding-top:8px}.pe .dt div:nth-child(2){border-color:var(--mr)}.pe .dt div:nth-child(3){border-color:var(--mb)}
.pe .dt b{display:block;font:400 26px/1.1 var(--ser)}
@media (max-width:860px){.pe{grid-template-columns:1fr}}
/* materiales en collage Mondrian */
.mz{display:grid;grid-template-columns:repeat(6,1fr);grid-auto-rows:minmax(150px,auto);gap:8px;background:var(--mk);padding:8px;margin-top:22px}
.mz>a{position:relative;overflow:hidden;color:#fff;text-decoration:none;display:block;min-height:240px}
.mz>a img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transition:transform 1.2s var(--e-rev,ease)}
.mz>a:hover img{transform:scale(1.1)}
.mz>a .c{position:absolute;left:0;right:0;bottom:0;padding:14px;background:linear-gradient(transparent,rgba(0,0,0,.88))}
.mz>a .c b{display:block;font:400 22px/1.15 var(--ser)}
.mz>a .c ol{margin:8px 0 0;padding-left:18px;font-size:13.5px;line-height:1.35;max-height:0;overflow:hidden;transition:max-height .6s}
.mz>a:hover .c ol,.mz>a:focus .c ol{max-height:260px}
.mz{grid-template-areas:"cel cel cel alu alu alu" "cel cel cel cri cri ylw" "ace ace red sip sip sip" "con con con con blu blu"}.mz>:nth-child(1){grid-area:cel}.mz>:nth-child(2){grid-area:ylw}.mz>:nth-child(3){grid-area:alu}.mz>:nth-child(4){grid-area:cri}.mz>:nth-child(5){grid-area:red}.mz>:nth-child(6){grid-area:ace}.mz>:nth-child(7){grid-area:sip}.mz>:nth-child(8){grid-area:blu}.mz>:nth-child(9){grid-area:con}
.mz .blk{min-height:120px;animation:blk 8s ease-in-out infinite}
.mz .blk.r{background:var(--mr)}.mz .blk.y{background:var(--my);animation-delay:-2.7s}.mz .blk.b{background:var(--mb);animation-delay:-5.3s}
@keyframes blk{0%,100%{background:var(--mr)}33%{background:var(--my)}66%{background:var(--mb)}}
.why{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin-top:18px}
.why div{padding:14px 16px;border-left:6px solid var(--mr)}.why div:nth-child(2){border-color:var(--my)}.why div:nth-child(3){border-color:var(--mb)}
@media (max-width:860px){.mz{grid-template-columns:1fr 1fr;grid-template-areas:"cel cel" "alu ylw" "cri cri" "red ace" "sip sip" "blu con"}.why{grid-template-columns:1fr}}
/* fideicomiso vivo */
.fsvg .fl{stroke-dasharray:8 10;animation:flu 1.2s linear infinite}
@keyframes flu{to{stroke-dashoffset:-36}}
.fsvg .fn rect{transition:fill .4s,stroke .4s}
.fsvg .fn:hover rect{stroke:var(--my)!important;stroke-width:3}
.fsvg .fn.bim rect{stroke:var(--mb)!important;stroke-width:3;animation:glow 2.4s ease-in-out infinite}
@keyframes glow{50%{filter:drop-shadow(0 0 10px #225095)}}
.fid-bim{display:flex;align-items:center;gap:16px;margin:16px 0 0;flex-wrap:wrap}
.fid-bim img{height:44px;width:auto}
/* regreso a la página principal */
.brand .gl.mond rect{stroke:none}
.home-lbl{display:block;font:600 10.5px/1 var(--sans);letter-spacing:.12em;text-transform:uppercase;color:var(--my);margin-top:3px}
/* registro para descargas */
#reg{position:fixed;inset:0;z-index:10000;background:rgba(0,0,0,.72);display:none;place-items:center;padding:16px}
#reg.on{display:grid}
#reg form{background:#12100D;color:#E4DBCC;max-width:460px;width:100%;padding:26px;border-top:8px solid var(--my);position:relative}
#reg h3{margin:0 0 6px;font:400 26px/1.15 var(--ser)}
#reg label{display:block;margin:12px 0 4px;font-weight:650;font-size:14px}
#reg input,#reg select{width:100%;min-height:44px;padding:8px 10px;background:#1b1813;color:#fff;border:1px solid #5A5044;font:inherit}
#reg button[type=submit]{margin-top:16px;width:100%;min-height:48px;background:var(--my);color:#0b0b0b;border:0;font-weight:700;cursor:pointer}
#reg .x{position:absolute;top:8px;right:10px;background:none;border:0;color:#fff;font-size:26px;cursor:pointer}
#reg .er{color:#ff8a80;font-size:14px;min-height:18px;margin:8px 0 0}
@media (prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}.rv0{opacity:1;transform:none}}
.mz>*{align-self:stretch;height:100%;min-height:200px;display:block}

/* 6-nov · explorador apilado: edificio, franja negra, plano, ficha */
.sel.sel-v{display:block}
.sel.sel-v .sel-f{position:static;order:0}
.sel.sel-v .sel-c{display:block;margin-top:22px}
@media(min-width:1100px){.sel.sel-v .lvl{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:8px}.sel.sel-v .lvb{grid-template-columns:auto 1fr;grid-template-rows:auto auto;min-height:72px}.sel.sel-v .lvb em{grid-column:1/-1}.sel.sel-v .flt{margin-top:14px}}
.sel-gap{height:80px;background:#000;margin:44px calc(50% - 50vw)}
#plw.full{margin-top:0}
#ufx.ufx-v{margin-top:0;grid-template-columns:1fr}
#ufx.ufx-v .ufx-p{display:none}
@media(min-width:1100px){#ufx.ufx-v .ufx-d{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);column-gap:40px;align-items:start}#ufx.ufx-v .ufx-d>*{grid-column:1}#ufx.ufx-v .ufx-d>dl,#ufx.ufx-v .ufx-d>.kp,#ufx.ufx-v .ufx-d>.btns,#ufx.ufx-v .ufx-d>.lim,#ufx.ufx-v .ufx-d>.sub3{grid-column:2}#ufx.ufx-v .ufx-d>dl{grid-row:1/span 3}}

/* 8-nov: videos centrados y completos en pantalla */
.vf,figure.ar-v{max-width:min(100%,calc(78vh*16/9));margin-left:auto!important;margin-right:auto!important}
video{max-height:78vh}
.vred video,.dvs video,.dv video,[data-v9] video{max-height:none}

/* 8-nov: pie con logos nítidos y alineados */
.ft-g>div:first-child img.ft-dla{width:200px!important;height:auto!important;background:none!important;padding:0!important;margin-bottom:18px}
.ft-lg{display:grid!important;grid-template-columns:repeat(3,minmax(0,1fr));gap:0!important;margin-top:22px;max-width:460px;border:1px solid rgba(240,234,222,.18)}
.ft-lg img{width:100%!important;height:92px!important;max-width:none!important;max-height:none!important;object-fit:contain;display:block;box-sizing:border-box;padding:14px 16px;border-right:1px solid rgba(240,234,222,.18)}
.ft-lg img:last-child{border-right:0}
.ft-lg img[src*="bim"]{padding:24px 8px}
.ft-lg img[src*="aruma"]{padding:10px 14px}
.ft-lg img[src*="301"]{padding:8px 10px}

/* 8-nov: plano completo visible y botón volver */
#plw .pl-img{max-height:74vh;width:auto!important;max-width:100%;margin:0 auto;display:block;object-fit:contain}
.pl-back{display:inline-block;margin:10px 0 12px;padding:11px 16px;background:#F2C230;color:#111;border:3px solid #0b0b0b;font:700 12px/1.2 var(--sans,Arial);letter-spacing:.08em;text-transform:uppercase;cursor:pointer}
.pl-back:hover{background:#fff}

/* 8-nov b: el plano de piso siempre cabe en pantalla (gana a #plw.full) */
#plw.full .pl-img,#plw .pl-img{max-height:72vh!important;width:auto!important;max-width:100%!important;margin:0 auto;display:block;object-fit:contain}

/* 8-nov: portadas con botón integrado: ocultar botón duplicado, conservar clic en toda el área */
.vwrap:has(video[poster*="/portadas/"]) .vplay span,.vwrap:has(video[poster*="/portadas/"]) .vplay em,.vwrap.pt .vplay span,.vwrap.pt .vplay em{display:none!important}
figure:has(video[poster*="/portadas/"]) > .vp,.vwrap:has(video[poster*="/portadas/"]) .vp{display:none!important}
/* 8-nov: portada del video de BIM (YouTube) */
figure[data-yt="ZlgWfUFD7sU"] .yt-p{background:#0b0e18 url(/m/portadas/bim2.webp) center/cover no-repeat}
