:root{--ink:#141414;--paper:#FBF7EF;--blue:#1D3F8C;--yellow:#F2C14E;--red:#E4584A;--sky:#7F9CE0;--teal:#9FD8D0}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
html{font-size:100%}
body{margin:0;background:var(--paper);color:var(--ink);font-family:'Bricolage Grotesque',system-ui,sans-serif;font-size:1.125rem;line-height:1.55}
a{color:inherit}
img{max-width:100%;height:auto}
.wrap{max-width:1360px;margin:0 auto;padding:0 40px}
.skip{position:absolute;left:-999px}.skip:focus{left:8px;top:8px;background:#fff;padding:8px;z-index:9}
/* header */
.top{background:var(--paper);border-bottom:3px solid var(--ink);position:relative}
.top .wrap{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:10px 28px;padding-top:14px;padding-bottom:14px}
.logo{font-weight:800;font-size:26px;letter-spacing:-.02em;text-decoration:none}
.nav{display:flex;flex-wrap:wrap;gap:6px 22px;font-weight:600;font-size:16px}
.nav a{text-decoration:none;padding:4px 0;border-bottom:3px solid transparent}
.nav a:hover,.nav a[aria-current]{border-bottom-color:var(--ink)}
.lang{display:flex;gap:8px;font-weight:700;font-size:14px}
.lang a{text-decoration:none;border:2px solid var(--ink);padding:2px 8px}
.lang a[aria-current]{background:var(--ink);color:var(--yellow)}
/* hero */
.hero{background:var(--blue);color:#fff;border-bottom:3px solid var(--ink)}
.hero .wrap{display:grid;grid-template-columns:1.1fr 1fr;gap:48px;align-items:center;padding-top:72px;padding-bottom:88px}
.tag{display:inline-block;background:var(--yellow);color:var(--ink);font-weight:700;font-size:14px;letter-spacing:.08em;text-transform:uppercase;padding:6px 12px;box-shadow:5px 5px 0 var(--ink);margin-bottom:28px}
.hero h1{margin:0 0 24px;font-weight:800;font-size:clamp(64px,10.4vw,150px);line-height:.88;letter-spacing:-.04em}
.hero p{font-size:21px;max-width:520px;margin:0 0 32px}
.btn{display:inline-block;background:var(--yellow);color:var(--ink);font-weight:700;padding:14px 26px;text-decoration:none;box-shadow:5px 5px 0 var(--ink);border:3px solid var(--ink);margin:0 14px 14px 0}
.btn.alt{background:#fff}
.btn:hover{transform:translate(-2px,-2px);box-shadow:7px 7px 0 var(--ink)}
.collage{position:relative;aspect-ratio:5/6}
.collage figure{position:absolute;margin:0;background:#fff;padding:8px;box-shadow:10px 10px 0 var(--ink);border:3px solid var(--ink)}
.collage img{display:block;width:100%;height:auto}
.collage .c1{left:0;top:0;width:62%;transform:rotate(-3deg)}
.collage .c2{right:0;top:18%;width:48%;transform:rotate(4deg)}
.collage .c3{left:14%;bottom:0;width:50%;transform:rotate(-2deg)}
.band{background:var(--yellow);border-bottom:3px solid var(--ink);font-weight:700}
.band .wrap{display:flex;flex-wrap:wrap;gap:10px 40px;padding-top:16px;padding-bottom:16px}
.band a{text-decoration:none}.band a:hover{text-decoration:underline}
/* sections */
section.s{padding:72px 0}
h2.big{font-size:clamp(40px,5vw,72px);line-height:1;margin:0 0 40px;letter-spacing:-.03em;font-weight:800}
.head2{display:flex;flex-wrap:wrap;align-items:baseline;justify-content:space-between;gap:10px 30px}
.head2 a{font-weight:700}
.grid4{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:32px 24px}
.pieza{display:block;text-decoration:none}
.pieza .mat{padding:16px;border:3px solid var(--ink);transition:transform .12s,box-shadow .12s;display:flex;align-items:center;justify-content:center;height:280px}
.pieza .mat img{max-height:100%;width:auto;max-width:100%;object-fit:contain;display:block;box-shadow:0 0 0 2px var(--ink)}
.pieza:nth-child(4n+1) .mat{background:var(--red)}.pieza:nth-child(4n+2) .mat{background:var(--sky)}
.pieza:nth-child(4n+3) .mat{background:var(--yellow)}.pieza:nth-child(4n) .mat{background:var(--teal)}
.pieza:hover .mat{transform:translate(-3px,-3px);box-shadow:6px 6px 0 var(--ink)}
.pieza .cap{padding-top:10px;font-weight:600;font-size:16px;line-height:1.3}
.pieza .cap small{display:block;font-weight:400;color:#555}
.quote{background:var(--teal);border-top:3px solid var(--ink);border-bottom:3px solid var(--ink)}
.quote blockquote{margin:0;padding:64px 0;font-size:clamp(24px,3vw,40px);font-weight:700;line-height:1.2;max-width:980px}
.quote cite{display:block;font-size:15px;font-weight:500;margin-top:18px;font-style:normal}
.galrows{background:var(--teal);border-top:3px solid var(--ink)}
.fila-g{display:flex;flex-wrap:wrap;align-items:baseline;gap:28px;padding:18px 12px;border-top:3px solid var(--ink);text-decoration:none}
.fila-g:last-child{border-bottom:3px solid var(--ink)}
.fila-g .n{font-size:64px;font-weight:800;min-width:150px;line-height:1}
.fila-g .t{font-size:clamp(22px,3vw,38px);font-weight:700;flex:1 1 200px;min-width:0}
.fila-g:hover{background:var(--ink);color:var(--teal)}
/* gallery index cards */
.galcards{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:40px 28px}
.gcard{border:3px solid var(--ink);background:#fff;display:flex;flex-direction:column}
.gcard:nth-child(4n+1){--c:var(--red)}.gcard:nth-child(4n+2){--c:var(--sky)}.gcard:nth-child(4n+3){--c:var(--yellow)}.gcard:nth-child(4n){--c:var(--teal)}
.gcard .im{background:var(--c);padding:14px;border-bottom:3px solid var(--ink);display:block}
.gcard .im img{display:block;width:100%;height:220px;object-fit:contain}
.gcard h2{margin:0;padding:14px 16px 6px;font-size:22px;line-height:1.2}
.gcard h2 small{display:block;font-size:14px;letter-spacing:.08em;text-transform:uppercase;color:#555}
.gcard h2 a{text-decoration:none}
.gcard ul{list-style:none;margin:0;padding:6px 16px 16px;display:flex;flex-wrap:wrap;gap:6px}
.gcard li a{display:inline-block;border:2px solid var(--ink);padding:1px 8px;font-size:14px;font-weight:600;text-decoration:none}
.gcard li a:hover{background:var(--ink);color:var(--yellow)}
/* page */
.pagehead{background:var(--yellow);border-bottom:3px solid var(--ink)}
.pagehead .wrap{padding-top:40px;padding-bottom:40px}
.crumbs{font-size:14px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;display:flex;flex-wrap:wrap;gap:6px 18px;margin-bottom:14px}
.crumbs a{text-decoration:none;border-bottom:2px solid var(--ink)}
.pagehead h1{margin:0;font-weight:800;font-size:clamp(40px,6vw,88px);line-height:.95;letter-spacing:-.03em}
.page{padding:48px 0 80px}
.content{max-width:1000px}
.content .row{display:flex;flex-wrap:wrap;gap:16px 28px;margin:0 0 14px}
.content .cell{flex:1 1 260px;min-width:0}
.content .cell:has(> img),.content .cell:has(> p > img),.content .cell:has(> a > img){flex:0 1 auto}
.content p{margin:0 0 1em}
.content .tbl{margin:0 0 24px}
.content img{border:3px solid var(--ink);background:#fff}
.content img[src$=".gif"]{border:0;background:none}
.content a{overflow-wrap:anywhere;word-break:break-word;text-decoration-thickness:2px;text-underline-offset:3px}
.content a:hover{background:var(--yellow)}
.content ul,.content ol{padding-left:1.3em}
.content hr{border:0;border-top:3px solid var(--ink);margin:32px 0}
.content h2,.content h3{letter-spacing:-.02em}
.tour{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:32px 24px}
.thumbs{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:24px 18px}
.thumbs a{text-decoration:none;font-weight:700;text-align:center}
.thumbs .mat{background:var(--teal);border:3px solid var(--ink);padding:10px;height:170px;display:flex;align-items:center;justify-content:center;margin-bottom:6px}
.thumbs a:nth-child(3n+2) .mat{background:var(--yellow)}.thumbs a:nth-child(3n) .mat{background:var(--sky)}
.thumbs .mat img{max-height:100%;width:auto;border:0;background:none}
.thumbs a:hover .mat{box-shadow:6px 6px 0 var(--ink);transform:translate(-3px,-3px)}
/* chooser */
.choose{min-height:100vh;display:grid;grid-template-rows:auto 1fr;background:var(--blue);color:#fff}
.choose h1{font-size:clamp(64px,12vw,170px);line-height:.88;margin:0 0 40px;letter-spacing:-.04em;font-weight:800}
.langs{display:grid;grid-template-columns:repeat(3,1fr);gap:24px}
.langs a{display:block;background:var(--yellow);color:var(--ink);border:3px solid var(--ink);box-shadow:8px 8px 0 var(--ink);padding:28px;font-size:36px;font-weight:800;text-decoration:none}
.langs a:hover{transform:translate(-3px,-3px);box-shadow:11px 11px 0 var(--ink)}
/* footer */
footer.foot{background:var(--ink);color:#fff;padding:56px 0 28px}
.fcols{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:32px}
.fcols .fh{font-weight:400;margin-top:0;margin:0 0 12px;color:var(--teal);font-size:13px;letter-spacing:.14em;text-transform:uppercase}
.fcols a{display:block;text-decoration:none;padding:3px 0}.fcols a:hover{color:var(--yellow)}
.legal{border-top:1px solid #444;margin-top:36px;padding-top:18px;font-size:14px;color:#bbb;display:flex;flex-wrap:wrap;justify-content:space-between;gap:8px}
@media(max-width:900px){
 .wrap{padding:0 20px}.hero .wrap{grid-template-columns:1fr;padding-top:48px;padding-bottom:56px}
 .grid4,.tour{grid-template-columns:repeat(2,minmax(0,1fr))}.galcards{grid-template-columns:repeat(2,1fr)}
 .fcols{grid-template-columns:repeat(2,1fr)}.fila-g .n{font-size:40px;min-width:90px}.langs{grid-template-columns:1fr}
 .top{position:static}.collage{max-width:420px}
}
@media(max-width:560px){.galcards{grid-template-columns:1fr}.pieza .mat{height:200px}}
@media print{.top,.foot,.band{display:none}}
.prevnext{display:flex;flex-wrap:wrap;gap:12px;margin-top:32px}
.prevnext a{border:3px solid var(--ink);padding:8px 16px;font-weight:700;text-decoration:none;background:#fff;box-shadow:4px 4px 0 var(--ink)}
.prevnext a:hover{background:var(--yellow)}

:focus-visible{outline:3px solid #fff;outline-offset:2px;box-shadow:0 0 0 6px var(--ink)!important}
.skip:focus{outline:3px solid var(--ink)}
.pieza:focus-visible .mat,.thumbs a:focus-visible .mat{transform:translate(-3px,-3px);box-shadow:6px 6px 0 var(--ink)}
.fila-g:focus-visible{background:var(--ink);color:var(--teal)}
.fcols a,.nav a,.crumbs a{min-height:24px}
.content .cell,.content p{overflow-wrap:anywhere}
@media(prefers-reduced-motion:reduce){*{transition:none!important;scroll-behavior:auto!important}.btn:hover,.pieza:hover .mat{transform:none}}
@media(forced-colors:active){.btn,.pieza .mat,.gcard{border:3px solid CanvasText}}
.fcols>div{min-width:0;overflow-wrap:anywhere}
@media(max-width:420px){.fcols{grid-template-columns:1fr}}
/* listas tabulares (año | nombre | †año, autor | fechas | n.º): rejilla con columnas alineadas */
.content .tbl:not(:has(p)):not(:has(.tbl)):has(>.row>.cell:nth-child(2)){display:grid;grid-template-columns:repeat(2,minmax(0,max-content));gap:0 28px;justify-content:start}
.content .tbl:not(:has(p)):not(:has(.tbl)):has(>.row>.cell:nth-child(3)){grid-template-columns:repeat(3,minmax(0,max-content))}
.content .tbl:not(:has(p)):not(:has(.tbl)):has(>.row>.cell:nth-child(2))>.row{display:grid;grid-template-columns:subgrid;grid-column:1/-1;margin:0;padding:5px 0;gap:0 28px}
.content .tbl:not(:has(p)):not(:has(.tbl)):has(>.row>.cell:nth-child(2))>.row>.cell{flex:none}
@media(max-width:560px){.content .tbl:not(:has(p)):not(:has(.tbl)):has(>.row>.cell:nth-child(2)){gap:0 14px}}
/* ficha de obra: la imagen cabe en pantalla y la ficha técnica va al lado en escritorio */
.obra .content img{max-height:80vh;width:auto;max-width:100%;object-fit:contain}
@media(min-width:900px){.obra .content #c>p:has(>img){float:left;margin:0 36px 24px 0;max-width:55%}.obra .content #c>p:has(>img)+p{padding-top:6px}.obra .content #c>.tbl:has(.tbl),.obra .prevnext{clear:both}}

/* Bricolage Grotesque (SIL OFL), servida desde el propio dominio */
/* vietnamese */
@font-face {
  font-family: 'Bricolage Grotesque';
  font-style: normal;
  font-weight: 400 800;
  font-stretch: 100%;
  font-display: swap;
  src: url(/assets/fonts/bricolage-vietnamese.woff2) format('woff2');
  unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329, U+1EA0-1EF9, U+20AB;
}
/* latin-ext */
@font-face {
  font-family: 'Bricolage Grotesque';
  font-style: normal;
  font-weight: 400 800;
  font-stretch: 100%;
  font-display: swap;
  src: url(/assets/fonts/bricolage-latin-ext.woff2) format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: 'Bricolage Grotesque';
  font-style: normal;
  font-weight: 400 800;
  font-stretch: 100%;
  font-display: swap;
  src: url(/assets/fonts/bricolage-latin.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}