:root{--bg:#f4f2ed;--ink:#181817;--muted:#77736d;--line:#d8d4cc;--surface:#ebe8e1;--max:1500px;--pad:clamp(20px,4vw,64px);--hh:min(74vh,760px);color-scheme:light}
@media (prefers-color-scheme:dark){:root:not([data-theme=light]){--bg:#141413;--ink:#efede7;--muted:#99958f;--line:#34322f;--surface:#1d1c1a;color-scheme:dark}}
:root[data-theme=dark]{--bg:#141413;--ink:#efede7;--muted:#99958f;--line:#34322f;--surface:#1d1c1a;color-scheme:dark}
*{box-sizing:border-box} html{scroll-behavior:smooth;scroll-padding-top:96px}
body{margin:0;background:var(--bg);color:var(--ink);font-family:Fustat,Arial,sans-serif;transition:background .25s,color .25s}
a{color:inherit;text-decoration:none} button{font:inherit;color:inherit} img{max-width:100%}
h1,h2,h3{font-weight:400;margin:0}
.wrap{width:min(var(--max),calc(100% - var(--pad)*2));margin:auto}
:focus-visible{outline:1.5px solid var(--ink);outline-offset:3px}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
.skip{position:absolute;left:-999px;top:8px;background:var(--ink);color:var(--bg);padding:8px 12px;z-index:99} .skip:focus{left:8px}
.i{display:block;flex:none}
.iconBtn{border:0;background:transparent;cursor:pointer;width:36px;height:36px;display:grid;place-items:center;padding:0;color:var(--ink)}
.iconBtn:hover{color:var(--muted)}
small{font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:var(--muted)}
.link{font-size:13px;border-bottom:1px solid currentColor;padding-bottom:3px}
.link:hover{color:var(--muted)}

/* Cabecera */
header{height:76px;border-bottom:1px solid var(--line);position:sticky;top:0;z-index:30;background:var(--bg)}
.bar{height:100%;display:flex;align-items:center;gap:28px}
.brand{margin-right:auto;display:block;color:var(--ink)} .logo{display:block;width:46px;height:46px}
nav#menu{display:flex;gap:30px} nav#menu a{font-size:13px;color:var(--muted)} nav#menu a:hover{color:var(--ink)}
nav#menu a{position:relative;padding:6px 0}
nav#menu a[aria-current]{color:var(--ink)}
nav#menu a[aria-current]:after{content:"";position:absolute;left:0;right:0;bottom:0;height:1px;background:currentColor}
.menuBtn{display:none}

/* Hero: carrusel editorial */
.hero{padding:28px 0 92px}
.heroStage{height:var(--hh);min-height:540px;position:relative;overflow:hidden;background:var(--surface)}
.slide{position:absolute;inset:0;opacity:0;visibility:hidden;transition:opacity .7s ease,visibility 0s .7s}
.slide.is-active{opacity:1;visibility:visible;transition:opacity .7s ease}
.slide img{width:100%;height:100%;object-fit:cover;display:block}
.slide:after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(0,0,0,.62),rgba(0,0,0,.04) 72%);pointer-events:none}
.heroCopy{position:absolute;z-index:2;left:clamp(24px,5vw,72px);bottom:clamp(40px,6vw,76px);color:#fff;max-width:600px}
.heroCopy small{color:#fff;opacity:.78}
.heroCopy h2{font-size:clamp(52px,7vw,96px);line-height:.92;letter-spacing:-.06em;margin:16px 0 20px}
.heroCopy p{font-size:16px;line-height:1.55;font-weight:300;max-width:470px;margin:0 0 28px}
.heroCopy .link:hover{color:#fff;opacity:.75}
.heroNav{position:absolute;z-index:4;right:28px;bottom:28px;display:flex;align-items:center;gap:9px}
.dot{width:28px;height:2px;border:0;padding:0;background:rgba(255,255,255,.42);cursor:pointer;position:relative}
.dot:before{content:"";position:absolute;inset:-10px 0}
.dot.is-active{background:#fff}
.counter{color:#fff;font-size:11px;margin-left:7px;letter-spacing:.08em;font-variant-numeric:tabular-nums}
.heroStage :focus-visible{outline-color:#fff}
.heroArrow{color:#fff;width:30px;height:30px} .heroArrow:hover{color:#fff;opacity:.7} .heroArrow:first-of-type{margin-left:8px}

/* Texto breve */
.statement{display:grid;grid-template-columns:.85fr 1.15fr;gap:10vw;padding:24px 0 118px}
.statement h2{font-size:clamp(34px,4vw,58px);line-height:1.04;letter-spacing:-.045em}
.statement p{font-size:17px;line-height:1.7;font-weight:300;margin:0;max-width:650px;color:var(--muted)}

.head{display:flex;align-items:end;justify-content:space-between;gap:20px;border-bottom:1px solid var(--line);padding-bottom:16px;margin-bottom:28px}
.head h2{font-size:25px;letter-spacing:-.03em} .head span{font-size:12px;color:var(--muted)}

/* Colecciones */
.collections{padding-bottom:125px}
.collectionGrid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}
.collection{height:590px;position:relative;overflow:hidden;background:var(--surface);display:block}
.collection img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .6s ease}
.collection:hover img{transform:scale(1.012)}
.collection:after{content:"";position:absolute;inset:0;background:linear-gradient(0deg,rgba(0,0,0,.68),transparent 58%)}
.cc{position:absolute;z-index:2;left:26px;right:26px;bottom:24px;color:#fff}
.cc small{font-size:10px;color:#fff;opacity:.8}
.cc h3{font-size:clamp(28px,3vw,42px);letter-spacing:-.045em;margin:7px 0}
.cc p{font-size:13px;line-height:1.45;margin:0;opacity:.82;max-width:310px}

.art{display:block;background:var(--surface);aspect-ratio:4/5;overflow:hidden}
.art img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .6s ease,opacity .3s}
.work .art:hover img{transform:scale(1.015)}

/* Obras */
.workGrid{display:grid;grid-template-columns:repeat(12,1fr);gap:56px 22px}
.work{grid-column:span 4} .work:nth-child(6n+2),.work:nth-child(6n+5){grid-column:span 5} .work:nth-child(6n+3),.work:nth-child(6n){grid-column:span 3}
.work:nth-child(6n+3) .art,.work:nth-child(6n) .art{aspect-ratio:3/4}
.meta{padding-top:12px;display:flex;justify-content:space-between;align-items:flex-start;gap:18px}
.meta h3{font-size:14px;font-weight:500;margin:0 0 3px} .meta h3 a:hover{color:var(--muted)}
.meta p{font-size:11px;color:var(--muted);margin:0;line-height:1.5}
.metaR{display:flex;flex-direction:column;align-items:flex-end;gap:6px;font-size:11px;color:var(--muted);white-space:nowrap}
.metaR .link{font-size:11px;color:var(--ink)}

.works{padding-bottom:130px}

/* Detrás / contacto */
.closing{border-top:1px solid var(--line);padding:86px 0 100px;display:grid;grid-template-columns:minmax(0,.8fr) 1fr;gap:8vw;align-items:end}
.closingImg{display:block;aspect-ratio:4/5;max-width:480px;background:var(--surface);overflow:hidden}
.closingImg img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .6s ease} .closingImg:hover img{transform:scale(1.015)}
.closing h2{margin-bottom:34px}
.adelanto p{font-size:16px;line-height:1.7;color:var(--muted);max-width:520px;margin:0 0 18px}
.adelanto p:first-child{font-size:clamp(22px,2.2vw,30px);line-height:1.25;letter-spacing:-.03em;color:var(--ink);margin-bottom:22px}
.closing .link{display:inline-block;margin-top:14px}
.closing h2{font-size:clamp(34px,4vw,58px);line-height:1.04;letter-spacing:-.045em;max-width:8em}
.closing p{font-size:16px;line-height:1.7;color:var(--muted);max-width:560px;margin:0 0 22px}
.contact{border-top:1px solid var(--line);padding:78px 0 88px}
.contact small{display:block;margin-bottom:16px}
.contact h2{font-size:clamp(34px,4vw,58px);line-height:1.04;letter-spacing:-.045em;margin:0 0 16px}
.contact p{font-size:16px;line-height:1.7;color:var(--muted);max-width:510px;margin:0 0 28px}

/* Pie */
footer{border-top:1px solid var(--line);padding:52px 0 28px}
.footerGrid{display:grid;grid-template-columns:2fr 1fr 1fr;gap:40px;padding-bottom:52px}
.footerBrand .brand{display:inline-block;margin-bottom:12px} .footerBrand .logo{width:40px;height:40px}
.footerBrand p{font-size:11px;color:var(--muted);margin:0}
.footerCol{display:flex;flex-direction:column;align-items:flex-start;gap:9px}
.footerCol>span{font-size:10px;text-transform:uppercase;letter-spacing:.12em;color:var(--muted);margin-bottom:4px}
.footerCol a{font-size:12px;display:inline-flex;align-items:center;gap:8px} .footerCol a:hover{color:var(--muted)}
.footerCol .i{width:15px;height:15px}
.footerBottom{border-top:1px solid var(--line);padding-top:22px;display:flex;justify-content:space-between;gap:12px;font-size:10px;color:var(--muted)}

/* Página de colección */
.colHead{padding:72px 0 64px;max-width:720px}
.colHead h1{font-size:clamp(40px,5vw,72px);line-height:.95;letter-spacing:-.055em;margin:12px 0 0}
.colIntro{margin-top:30px;max-width:580px}
.colIntro p{font-size:16px;line-height:1.7;color:var(--muted);margin:0 0 14px}
.colIntro strong{font-weight:500;color:var(--ink)} .colIntro p:last-child{margin:22px 0 0}
.colHead>p{font-size:16px;line-height:1.7;color:var(--muted);margin:28px 0 0;max-width:560px}
.otras{display:flex;flex-wrap:wrap;align-items:baseline;gap:12px 28px;border-top:1px solid var(--line);margin-top:110px;padding:26px 0 90px;font-size:14px}
.otras small{width:100%} .otras a:hover{color:var(--muted)}

/* Detrás de ene-esencia */
.detras{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:clamp(28px,7vw,110px);padding:56px 0 110px;align-items:start}
.detrasFoto{position:sticky;top:116px;background:var(--surface)}
.detrasFoto img{display:block;width:100%;height:auto;max-height:calc(100vh - 150px);object-fit:cover}
.detrasTexto{max-width:600px;padding-top:8px}
.detrasTexto h1{font-size:clamp(40px,5vw,72px);line-height:.95;letter-spacing:-.055em;margin:12px 0 40px}
.detrasTexto p{font-size:16px;line-height:1.75;color:var(--muted);margin:0 0 18px}
.detrasTexto p:first-of-type{font-size:clamp(22px,2.2vw,30px);line-height:1.25;letter-spacing:-.03em;color:var(--ink);margin-bottom:28px}
.detrasTexto p:last-of-type{color:var(--ink)}
.detrasTexto .link{display:inline-block;margin-top:24px}

/* Ficha (página de obra y visor) */
.ficha small{display:block}
.ficha h1,.ficha h2{font-size:clamp(30px,3.4vw,48px);line-height:1;letter-spacing:-.05em;margin:12px 0 28px}
.ficha dl{display:grid;grid-template-columns:auto 1fr;gap:10px 24px;margin:0 0 30px;font-size:14px;border-top:1px solid var(--line);padding-top:20px}
.ficha dt{color:var(--muted)} .ficha dd{margin:0} .ficha dd a{border-bottom:1px solid var(--line)} .ficha dd a:hover{border-color:currentColor}
.actions{display:flex;flex-wrap:wrap;gap:24px;align-items:center}

.back{display:inline-flex;align-items:center;gap:8px;font-size:13px;color:var(--muted);margin:28px 0 0} .back:hover{color:var(--ink)} .back .i{width:16px;height:16px}
.obra{display:grid;grid-template-columns:minmax(0,1.5fr) minmax(280px,1fr);gap:clamp(28px,6vw,96px);padding:32px 0 100px;align-items:start}
.obraImgs{display:grid;gap:22px}
.obraImg{background:var(--surface);display:flex;justify-content:center}
.obraImg img{display:block;max-height:calc(100vh - 140px);width:auto;height:auto}
.obra .ficha{position:sticky;top:116px}
.pager{display:flex;justify-content:space-between;gap:20px;border-top:1px solid var(--line);padding:26px 0 80px;font-size:13px}
.pager a{color:var(--muted)} .pager a:hover{color:var(--ink)} .pager small{display:block;font-size:10px;margin-bottom:6px}
.pager .next{text-align:right;margin-left:auto}

/* Visor */
.viewer{border:0;padding:0;margin:0;width:100vw;height:100dvh;max-width:none;max-height:none;background:var(--bg);color:var(--ink)}
.viewer::backdrop{background:var(--bg)}
.viewer[open]{display:grid;grid-template-columns:minmax(0,1fr) 380px}
.vImg{position:relative;display:flex;align-items:center;justify-content:center;padding:clamp(16px,4vw,56px) 64px;min-height:0;background:var(--surface)}
.vImg img{max-width:100%;max-height:100%;width:auto;height:auto;display:block;object-fit:contain;transition:opacity .3s}
.viewer .ficha{padding:84px 40px 40px;overflow:auto;border-left:1px solid var(--line)}
.vPrev,.vNext{position:absolute;top:50%;transform:translateY(-50%)} .vPrev{left:14px} .vNext{right:14px}
.vClose{position:fixed;top:18px;right:18px}
.vCount{font-size:12px;color:var(--muted);margin-top:30px;font-variant-numeric:tabular-nums}

@media(max-width:980px){.collectionGrid{grid-template-columns:1fr 1fr}.collection:nth-child(3){grid-column:1/-1;height:520px}}
@media(max-width:820px){
  :root{--hh:min(64vh,620px)}
  header{height:64px} .logo{width:40px;height:40px} .bar{gap:6px}
  .menuBtn{display:grid}
  nav#menu{display:none;position:absolute;left:0;right:0;top:64px;background:var(--bg);border-bottom:1px solid var(--line);flex-direction:column;gap:0;padding:8px var(--pad) 16px}
  nav#menu.open{display:flex} nav#menu a{font-size:16px;color:var(--muted);padding:12px 0;align-self:flex-start} nav#menu a[aria-current]:after{bottom:8px}
  .hero{padding:18px 0 72px} .heroStage{min-height:600px} .heroCopy h2{font-size:52px} .heroCopy{right:24px;bottom:72px}
  .heroNav{left:24px;right:auto;bottom:28px}
  .statement,.closing{grid-template-columns:1fr;gap:28px;padding-top:60px;padding-bottom:85px}
  .detras{grid-template-columns:1fr;padding-top:24px} .detrasFoto{position:static} .detrasFoto img{max-height:none}
  .collectionGrid{grid-template-columns:1fr} .collection,.collection:nth-child(3){grid-column:auto;height:520px}
  .footerGrid{grid-template-columns:1fr 1fr} .footerBrand{grid-column:1/-1} .footerBottom{flex-direction:column}
  .work,.work:nth-child(n){grid-column:span 12} .work:nth-child(n) .art{aspect-ratio:4/5}
  .obra{grid-template-columns:1fr;padding-top:20px} .obra .ficha{position:static} .obraImg img{max-height:none;width:100%}
  .viewer[open]{grid-template-columns:1fr;grid-template-rows:minmax(0,62dvh) auto;overflow:auto}
  .vImg{padding:16px 48px} .vPrev{left:4px} .vNext{right:4px}
  .viewer .ficha{border-left:0;padding:28px 20px 40px}
  .vClose{top:8px;right:8px;background:var(--bg)}
}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto} *,*::before,*::after{transition:none!important}}
