/* Mes del Jean. Todas las clases empiezan con mj- para no afectar el resto del sitio. */
[class^="mj-"],[class*=" mj-"]{box-sizing:border-box}
.mj-hero{display:grid;grid-template-columns:1fr 1fr;gap:60px;align-items:center;max-width:1100px;margin:0 auto;padding:50px 40px}
.mj-hero-img{width:100%;max-width:420px;justify-self:end;display:block;height:auto}
.mj-hero-txt{display:flex;flex-direction:column;align-items:flex-start}
.mj-label{color:#d4ff00;letter-spacing:.12em;font-weight:700;font-size:14px}
.mj-btn{display:inline-block;background:#d4ff00;color:#111;font-weight:700;padding:16px 28px;margin-top:18px;letter-spacing:.04em;text-decoration:none}
.mj-sec{max-width:1100px;margin:0 auto;padding:30px 40px}
.mj-sec h2{font-size:28px;margin:6px 0 0;color:#fff}
.mj-card{display:grid;grid-template-columns:1fr 1fr;gap:30px;background:#181818;border:1px solid #262626;padding:24px;margin-top:18px}
.mj-main{width:100%;aspect-ratio:1/1;object-fit:cover;object-position:top;display:block}
.mj-thumbs{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin-top:8px}
.mj-thumbs img{width:100%;aspect-ratio:1;object-fit:cover;display:block}
.mj-brand{color:#d4ff00;font-size:12px;letter-spacing:.1em;font-weight:700}
.mj-info h3{font-size:24px;margin:8px 0;color:#fff}
.mj-info p{color:#999}
@media(max-width:700px){
 .mj-hero{grid-template-columns:1fr;gap:0;padding:0}
 .mj-hero-img{max-width:none;justify-self:stretch}
 .mj-hero-txt{padding:24px 20px 10px}
 .mj-btn{display:block;width:100%;text-align:center;margin-top:0}
 .mj-sec{padding:24px 20px}
 .mj-card{grid-template-columns:1fr;padding:14px}
}

/* Ampliacion al tocar o hacer clic. No cambia la galeria original. */
.mj-hero-img[role="button"],.mj-main[role="button"],.mj-thumbs img[role="button"]{cursor:zoom-in}
.mj-hero-img[role="button"]:focus-visible,.mj-main[role="button"]:focus-visible,.mj-thumbs img[role="button"]:focus-visible{outline:3px solid #d4ff00;outline-offset:3px}
.mj-lightbox{position:fixed;inset:0;width:100%;height:100%;height:100dvh;max-width:none;max-height:none;margin:0;padding:64px 16px 24px;border:0;background:rgba(0,0,0,.94);color:#fff;overflow:hidden;box-sizing:border-box}
.mj-lightbox[open]{display:flex;align-items:center;justify-content:center}
.mj-lightbox::backdrop{background:rgba(0,0,0,.94)}
.mj-lightbox-img{display:block;width:auto;height:auto;max-width:100%;max-height:100%;object-fit:contain;margin:0}
.mj-lightbox-close{position:absolute;top:max(12px,env(safe-area-inset-top));right:max(12px,env(safe-area-inset-right));min-width:44px;min-height:44px;padding:8px 14px;border:1px solid #777;border-radius:4px;background:#181818;color:#fff;font:inherit;line-height:1.3;cursor:pointer}
.mj-lightbox-close:focus-visible{outline:3px solid #d4ff00;outline-offset:2px}