.hero{position:relative;overflow:hidden;height:100vh;height:100svh;min-height:600px;background:#000}
.hero img.bg{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:0% 20%}
@media(max-aspect-ratio:3/2){.hero img.bg{object-position:30% 20%}}@media(max-aspect-ratio:1/1){.hero img.bg{object-position:51% 20%}}
.hero img.bg.custom{object-position:70% 20%}html[data-theme=dark] .hero img.bg.dim{filter:brightness(.55) saturate(.8)}
.hero::after{content:"";position:absolute;inset:0;pointer-events:none;background:linear-gradient(90deg,var(--veil) 0,transparent 62%)}
#fx{position:absolute;inset:0;width:100%;height:100%;z-index:2;pointer-events:none}
.in{position:absolute;z-index:3;left:5%;top:53%;transform:translateY(-50%);width:min(48%,860px)}
.kick{font-size:clamp(13px,1.6vw,24px);letter-spacing:.14em;text-transform:uppercase;font-weight:700;color:var(--hsub);text-shadow:0 0 14px var(--halo)}
.in h1{font-family:var(--display);font-weight:400;color:var(--title);line-height:.95;font-size:clamp(52px,min(9.2vw,19vh),200px);margin:.12em 0 .22em;text-shadow:0 0 34px var(--halo);display:table;text-align:center}.in h1 span{display:block}.in h1 .de{font-size:.46em;line-height:1}
.cta{display:flex;flex-direction:column;gap:14px;align-items:flex-start;margin-top:30px}
.btn{display:inline-block;min-width:min(360px,100%);text-align:center;border:1px solid #6b0000;padding:15px 28px;font-size:clamp(13px,1.25vw,19px);letter-spacing:.07em;text-transform:uppercase;font-weight:700;background:#6b0000;color:#ddd3c5;transition:.25s;font-family:var(--cuerpo);box-shadow:0 6px 18px #0005}.btn:hover{background:#0b0b0b;border-color:#0b0b0b;color:#ddd3c5;transform:translateY(-2px)}.btn.sm{min-width:0;padding:10px 18px;font-size:12px}
.sec{padding:84px 6% 10px;display:grid;grid-template-columns:minmax(230px,24%) 1fr;gap:20px 44px;align-items:start}
.sec-h{grid-column:1/-1;display:flex;align-items:center;gap:22px;font-family:var(--display);font-weight:400;font-size:clamp(30px,3.4vw,54px);color:var(--acc);margin:0 0 6px;line-height:1.1}.sec-h::after{content:"";flex:1;height:1px;background:var(--acc);opacity:.7}
.sec-t p{font-size:clamp(15px,1.25vw,19px);line-height:1.6;margin-bottom:12px}
.shelf{display:grid;grid-template-columns:repeat(4,1fr);gap:22px}.fig{text-align:center}.bk{width:100%;max-width:190px;margin:0 auto;aspect-ratio:7/10;position:relative;transition:transform .3s}.bk img{width:100%;display:block}.bk.l3 img{display:none}.fig:hover .bk{transform:translateY(-6px)}
.st{display:block;margin-top:6px;font-weight:700;font-size:clamp(12px,1.1vw,16px);letter-spacing:.06em;text-transform:uppercase}.fig.ok .st{color:var(--acc)}
.ics{display:flex;gap:11px;justify-content:center;margin-top:5px}.ics>*{width:21px;height:21px;color:var(--txt);background:none;border:0;padding:0;display:block}.ics svg{width:100%;height:100%}.ics button:hover{color:var(--acc)}
.pgrid{display:grid;grid-template-columns:repeat(4,1fr);gap:24px 22px}.pj{text-align:center}.pj .im{aspect-ratio:2/3;border:1px solid var(--linea);box-shadow:0 8px 22px #0004;overflow:hidden;background:linear-gradient(160deg,#4a1a14,#0b0b0b);transition:.3s}.pj:hover .im{transform:translateY(-5px);border-color:var(--acc)}.pj img{width:100%;height:100%;object-fit:cover;display:block}.pj .im.noimg img{display:none}
.pj b{display:block;margin-top:8px;font-size:clamp(11px,1vw,14px);letter-spacing:.05em;text-transform:uppercase}
.car{position:relative}.track{display:flex;gap:18px;overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:none;padding:6px 2px}.track::-webkit-scrollbar{display:none}
.tr{flex:0 0 calc((100% - 54px)/4);scroll-snap-align:start;aspect-ratio:2/3;position:relative;border:1px solid var(--linea);box-shadow:0 8px 22px #0004;overflow:hidden;background:linear-gradient(160deg,#4a1a14,#0b0b0b);color:#ddd3c5;transition:.3s}.tr:hover{transform:translateY(-5px);border-color:var(--acc)}.tr img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}.tr img.noimg{display:none}
.tr .pl{position:absolute;inset:0;display:grid;place-items:center}.tr .pl i{width:68px;height:68px;border:3px solid #fff;border-radius:50%;display:grid;place-items:center;background:#0b0b0b66;transition:.25s}.tr:hover .pl i{background:#6b0000;transform:scale(1.1)}.tr .pl i::after{content:"";margin-left:6px;border-left:20px solid #fff;border-top:12px solid transparent;border-bottom:12px solid transparent}
.tr span{position:absolute;left:0;right:0;bottom:0;padding:26px 10px 10px;background:linear-gradient(transparent,#000c);font-size:14px;text-align:center}
.cb{position:absolute;top:50%;transform:translateY(-50%);width:46px;height:46px;border-radius:50%;border:1px solid #ddd3c5;background:#6b0000;color:#ddd3c5;font-size:24px;line-height:1;z-index:3;box-shadow:0 4px 14px #0007}.cb:hover{background:#0b0b0b}.cb.l{left:-14px}.cb.r{right:-14px}
.dgrid{display:grid;grid-template-columns:repeat(4,1fr);gap:18px}.dp{display:flex;flex-direction:column;gap:8px;padding:18px;background:var(--card);border:1px solid var(--linea);box-shadow:0 4px 14px #0002;transition:.25s;color:var(--txt)}.dp:hover{border-color:var(--acc);transform:translateY(-4px);color:var(--txt)}.dp small{font-size:10px;letter-spacing:.24em;text-transform:uppercase;color:var(--acc)}.dp b{font-family:var(--display);font-weight:400;font-size:clamp(15px,1.3vw,20px);line-height:1.15;text-transform:uppercase}.dp p{font-size:13px;line-height:1.45;color:var(--txt2)}.dp em{margin-top:auto;font-style:normal;font-size:11px;letter-spacing:.2em;text-transform:uppercase;color:var(--acc)}
.autor{display:grid;grid-template-columns:1fr 250px;gap:36px;padding:84px 6% 90px;align-items:start}.autor .sec-h{grid-column:1/-1}.autor img{width:100%;aspect-ratio:3/4;object-fit:cover;object-position:50% 20%;border:1px solid var(--linea);box-shadow:0 10px 26px #0005}.autor p{font-size:clamp(15px,1.3vw,19px);line-height:1.6;margin-bottom:10px}
.modal{position:fixed;inset:0;background:#0b0b0bf2;display:none;place-items:center;z-index:90;padding:18px;overflow:auto}.modal.on{display:grid}
.card{width:min(1120px,100%);border:1px solid #a88a58;background:#0b0b0b url(assets/mar-oscuro.jpg) center/cover;color:#ddd3c5;padding:34px;position:relative;animation:in .4s}@keyframes in{from{opacity:0;transform:translateY(20px) scale(.97)}}
.card h3{font-family:var(--display);font-weight:400;font-size:clamp(24px,3vw,40px);color:#c23a2e;letter-spacing:.05em;margin-bottom:10px;padding-right:90px}.card p{line-height:1.65;color:#c9bda9;margin-bottom:12px}.card .btn{min-width:0}
.row{display:grid;grid-template-columns:400px 1fr;gap:38px;align-items:start}.b3{position:relative;width:100%;aspect-ratio:7/10}.b3 img{width:100%}.b3.l3 img{display:none}.rot{display:flex;align-items:center;justify-content:center;gap:8px;color:#c9bda9;font-size:13px;margin-top:6px}.rot svg{width:24px;height:24px}
.hook{font-style:italic;color:#ddd3c5!important;border-left:2px solid #6b0000;padding-left:12px}.stt{font-size:11px;letter-spacing:.3em;text-transform:uppercase;color:#a88a58;margin-bottom:10px}.acts{display:flex;gap:10px;flex-wrap:wrap;margin-top:18px}
.x{position:absolute;top:6px;right:14px;font-size:30px;color:#8d8a83}.x:hover{color:#ddd3c5}.stamp{position:absolute;top:14px;right:56px;width:54px;animation:st .7s .3s both}@keyframes st{from{opacity:0;transform:scale(2.2) rotate(-20deg)}to{opacity:1;transform:scale(1) rotate(-8deg)}}
.aut{display:grid;grid-template-columns:300px 1fr;gap:30px;align-items:start}.aut img{width:100%;border:2px solid #6b0000}.vid{position:relative;aspect-ratio:16/9}.vid iframe{position:absolute;inset:0;width:100%;height:100%;border:0}
@media(max-width:900px){.hero{min-height:560px}.hero::after{background:linear-gradient(transparent 20%,var(--veil) 85%)}.in{left:0;right:0;top:auto;bottom:26px;transform:none;width:auto;padding:0 6%}.in h1{font-size:clamp(46px,15vw,84px)}.cta{align-items:stretch}
.sec,.autor{grid-template-columns:1fr;padding-top:60px}.shelf,.pgrid,.dgrid{grid-template-columns:repeat(2,1fr)}.tr{flex-basis:calc((100% - 18px)/2)}.row,.aut{grid-template-columns:1fr}.b3{max-width:300px;margin:0 auto}.autor img{max-width:230px}.cb.l{left:-6px}.cb.r{right:-6px}.stamp{width:42px}}
/* v10 */
.pgrid{grid-template-columns:repeat(8,1fr);gap:12px}.pj b{font-size:10px;line-height:1.25}
.track{gap:14px}.tr{flex:0 0 calc((100% - 98px)/8)}.tr .pl i{width:38px;height:38px;border-width:2px}.tr .pl i::after{margin-left:3px;border-left-width:11px;border-top-width:7px;border-bottom-width:7px}.tr span{font-size:11px;padding:18px 6px 6px}.cb.l{left:-10px}.cb.r{right:-10px}
.in h1{background:#6b0000 url(assets/mar-carmesi.jpg) center/cover;-webkit-background-clip:text;background-clip:text;color:transparent;-webkit-text-fill-color:transparent;text-shadow:none;filter:drop-shadow(0 0 16px var(--halo))}html[data-theme=dark] .in h1{filter:brightness(1.45) drop-shadow(0 0 16px var(--halo))}
.pj .im,.tr{background:#3a0000 url(assets/mar-carmesi.jpg) center/cover}
.modal{background:#e9e2d4 var(--bgimg) center/cover fixed}html[data-theme=dark] .modal{background-color:#0b0b0b}
.card{width:min(1500px,100%);background:var(--card);color:var(--txt);border:1px solid var(--acc)}.card h3{color:var(--acc)}.card p{color:var(--txt2)}.card .hook{color:var(--txt)!important;border-left-color:var(--acc)}.stt{color:var(--acc)}.x{color:var(--txt)}.x:hover{color:var(--acc)}
.row{grid-template-columns:minmax(380px,44%) 1fr;gap:42px}.b3{height:min(86vh,980px);width:auto;max-width:100%;margin:0 auto}
.vb{display:flex;gap:8px;justify-content:center;margin-top:10px;flex-wrap:wrap}.vb button{font-size:12px;letter-spacing:.08em;text-transform:uppercase;padding:7px 12px;border:1px solid var(--acc);background:transparent;color:var(--txt)}.vb button:hover{background:var(--acc);color:#ddd3c5}.hint{font-size:12px;text-align:center;color:var(--txt2)!important;margin-top:8px}
.aut{grid-template-columns:minmax(300px,520px) 1fr}.aut img{max-height:86vh;object-fit:contain;position:sticky;top:10px;border-color:var(--acc)}.card h4{font-family:var(--ba);font-weight:700;font-size:1.05rem;color:var(--acc);margin:20px 0 8px}.card .aut p{font-size:1.02rem}
@media(max-width:900px){.pgrid{grid-template-columns:repeat(4,1fr)}.tr{flex-basis:calc((100% - 28px)/3)}.row,.aut{grid-template-columns:1fr}.b3{height:auto;width:min(100%,320px)}}
/* v11 */
.pj .im,.tr,.dp,.autor img{box-shadow:0 5px 12px var(--sh)}.pj:hover .im,.tr:hover,.dp:hover{box-shadow:0 8px 16px var(--sh)}
