:root{--bg:#0b0907;--ink:#f3ece0;--mute:#a89d8d;--accent:#ff5a1f;--line:rgba(243,236,224,.14);
  --serif:"Instrument Serif",Georgia,serif;--sans:"Schibsted Grotesk",system-ui,sans-serif;--mono:"DM Mono",ui-monospace,monospace;--pad:clamp(16px,4vw,64px)}
*{box-sizing:border-box;margin:0;padding:0}
[hidden]{display:none!important}
html{-webkit-text-size-adjust:100%}
body{background:var(--bg);color:var(--ink);font:17px/1.55 var(--sans);-webkit-font-smoothing:antialiased;overflow-x:hidden}
a{color:inherit;text-decoration:none}
em{font-family:var(--serif);font-style:italic;color:var(--accent)}
::selection{background:var(--accent);color:#000}
:focus-visible{outline:2px solid var(--accent);outline-offset:3px}

.top{position:fixed;top:0;left:0;right:0;z-index:40;display:flex;align-items:center;justify-content:space-between;gap:16px;padding:16px var(--pad);background:linear-gradient(var(--bg) 55%,rgba(11,9,7,0))}
.logo{font-family:var(--serif);font-size:30px;line-height:1;min-width:44px;min-height:44px;display:inline-flex;align-items:center}
.logo em{color:var(--ink)}
.back{font:12px var(--mono);text-transform:uppercase;letter-spacing:.1em;min-height:44px;display:inline-flex;align-items:center;color:var(--mute);transition:color .2s}
.back:hover{color:var(--ink)}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;min-height:44px;padding:0 26px;border-radius:999px;background:var(--accent);color:#0b0907;font-weight:600;font-size:15px;transition:background .25s}
.btn:hover{background:var(--ink)}
.btn--small{padding:0 20px;background:#fff;color:#000;font:500 12px var(--mono);text-transform:uppercase;letter-spacing:.08em}
@media (max-width:560px){.back{display:none}.top{justify-content:space-between}}

.intro{padding:clamp(110px,18vh,190px) var(--pad) clamp(34px,6vh,70px);max-width:1500px;margin:0 auto}
h1{font-family:var(--serif);font-weight:400;font-size:clamp(54px,11vw,190px);line-height:.9;letter-spacing:-.035em}
.line{display:block;overflow:hidden;padding:.06em .06em .2em;margin:-.06em 0 -.2em}
.line__in{display:inline-block;will-change:transform}
.sub{margin-top:clamp(14px,2.4vh,26px);max-width:52ch;font-size:clamp(17px,1.5vw,21px);color:var(--mute)}

/* Galería: filas justificadas que se recolocan solas según el ancho de pantalla */
.gallery{--h:clamp(150px,27vh,300px);display:flex;flex-wrap:wrap;gap:clamp(4px,.6vw,10px);padding:0 var(--pad);max-width:1700px;margin:0 auto}
.gallery::after{content:"";flex-grow:1000000}
.ph{flex-grow:calc(var(--r) * 100);flex-basis:calc(var(--r) * var(--h));position:relative;overflow:hidden;border:0;padding:0;background:#16120e;cursor:zoom-in;border-radius:3px;display:block}
.ph::before{content:"";display:block;padding-top:calc(100% / var(--r))}
.ph img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transition:transform .9s cubic-bezier(.2,.8,.2,1),opacity .6s;opacity:0}
.ph img.on{opacity:1}
.ph:hover img{transform:scale(1.04)}
.status{padding:30px var(--pad);text-align:center;color:var(--mute);font:13px var(--mono);text-transform:uppercase;letter-spacing:.1em}
.status:empty{display:none}

.end{display:flex;align-items:flex-end;justify-content:space-between;gap:30px;flex-wrap:wrap;padding:clamp(60px,12vh,150px) var(--pad) clamp(50px,9vh,100px);max-width:1700px;margin:0 auto}
.next{display:flex;flex-direction:column;gap:8px;min-height:44px}
.next span{font:12px var(--mono);text-transform:uppercase;letter-spacing:.14em;color:var(--mute)}
.next b{font:400 clamp(44px,8vw,120px)/.95 var(--serif);letter-spacing:-.03em;transition:color .3s}
.next:hover b{color:var(--accent)}

.foot{display:flex;justify-content:space-between;align-items:center;gap:12px 20px;flex-wrap:wrap;padding:24px var(--pad);border-top:1px solid var(--line);font:12px var(--mono);text-transform:uppercase;letter-spacing:.1em;color:var(--mute)}
.foot a{color:var(--ink);text-decoration:underline;text-underline-offset:4px;text-decoration-color:var(--line);display:inline-flex;align-items:center;min-height:44px;transition:color .2s,text-decoration-color .2s}
.foot a:hover{color:var(--accent);text-decoration-color:var(--accent)}

/* Visor a pantalla completa */
.lb{position:fixed;inset:0;z-index:100;background:rgba(6,5,4,.97);display:flex;align-items:center;justify-content:center;touch-action:pan-y}
.lb__fig{max-width:min(94vw,1800px);max-height:88vh;display:flex}
.lb__fig img{max-width:100%;max-height:88vh;object-fit:contain;border-radius:3px;transition:opacity .25s}
.lb__x,.lb__nav{position:absolute;width:48px;height:48px;border-radius:50%;border:1px solid var(--line);background:rgba(11,9,7,.6);color:var(--ink);font-size:18px;cursor:pointer;display:grid;place-items:center;transition:background .2s}
.lb__x:hover,.lb__nav:hover{background:var(--ink);color:#000}
.lb__x{top:16px;right:16px}
.lb__nav{top:50%;margin-top:-24px}
.lb__nav--prev{left:16px}.lb__nav--next{right:16px}
.lb__count{position:absolute;bottom:18px;left:0;right:0;text-align:center;font:12px var(--mono);letter-spacing:.14em;color:var(--mute)}
@media (max-width:600px){.lb__nav{top:auto;bottom:14px;margin:0}.lb__count{bottom:28px}}

@media (max-width:600px){.gallery{--h:130px}}
@media (prefers-reduced-motion:reduce){*{transition:none!important}}
