.page-template-moodboard .header {
position: relative;
z-index: 10;
} .page-template-moodboard .header {
mix-blend-mode: difference;
}
.page-template-moodboard .header a,
.page-template-moodboard .header h1 {
color: #fff;
}  .page-template-moodboard .footer,
.page-template-moodboard .suscribe {
display: none;
} .lienzo {
position: fixed;
inset: 0;
overflow: hidden;
z-index: 0; perspective: 1000px;
perspective-origin: 50% 50%;
background: #f0efec;
cursor: grab;
touch-action: none; -webkit-user-select: none;
user-select: none;
}
.lienzo-mundo.arrastrando {
cursor: grabbing;
}  .lienzo-mundo {
position: absolute;
top: 0;
left: 0;
transform-style: preserve-3d;
}
.lienzo-mundo {
will-change: transform;
} .lienzo-foto {
position: absolute;
top: 0;
left: 0;
display: block;
text-decoration: none; will-change: transform, opacity;
backface-visibility: hidden;
} .lienzo-foto {
opacity: 0;
visibility: hidden; }
.lienzo-foto img {
display: block;
width: 100%;
height: auto; background: #e4e2dd;
} .lienzo-nombre {
position: absolute;
left: 0;
bottom: -1.5em;
font-size: 11px;
font-weight: 600;
letter-spacing: .04em;
text-transform: uppercase;
color: #1a1a1a;
text-decoration: none;
white-space: nowrap;
opacity: 0;
transition: opacity .25s ease; pointer-events: auto;
cursor: pointer;
}
.lienzo-foto:hover .lienzo-nombre {
opacity: 1;
}
.lienzo-nombre:hover {
text-decoration: underline;
} .lienzo-nombres {
position: fixed;
left: 6vw;
top: 50%;
transform: translateY(-50%);
width: 22vw;
max-width: 320px;
z-index: 2; overflow: hidden; -webkit-mask-image: linear-gradient(to bottom,
transparent 0, #000 20%, #000 80%, transparent 100%);
mask-image: linear-gradient(to bottom,
transparent 0, #000 20%, #000 80%, transparent 100%);
-webkit-mask-repeat: no-repeat;
mask-repeat: no-repeat;
pointer-events: none; font-family: "EB Garamond", Georgia, "Times New Roman", serif;
letter-spacing: -0.02em; color: #fff;
mix-blend-mode: difference;
}
.lienzo-nombres ul {
margin: 0;
padding: 0;
list-style: none;
will-change: transform;
}
.lienzo-nombres li {
display: flex;
align-items: center;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
font-size: 18px;
font-weight: 420; opacity: .22;
} .lienzo-nombres li:nth-child(7) {
opacity: 1;
}
.lienzo-nombres li:nth-child(6),
.lienzo-nombres li:nth-child(8) {
opacity: .5;
}
@media (max-width: 900px) {
.lienzo-nombres {
display: none;
}
}   .lienzo-cabecera {
position: fixed;
inset: 0;
width: fit-content;
height: fit-content;
margin: auto;
text-align: center;
pointer-events: none;
z-index: 3; color: #fff;
mix-blend-mode: difference;
} .lienzo-titulo {
margin: 0;
font-size: clamp(2.6rem, 9vw, 5rem);
font-weight: 500;
line-height: 100%;
letter-spacing: -.02em;
font-family: "neue-haas-grotesk-display", "Helvetica Neue", Helvetica, Arial, sans-serif;
}  .lienzo-subtitulo {
margin: 4px 0 0 0;
font-size: 18px;
font-weight: 400;
line-height: 110%;
letter-spacing: -0.02em;
font-family: "EB Garamond", Georgia, "Times New Roman", serif;
}
@media (max-width: 600px) {
.lienzo-subtitulo { max-width: 15em;
margin-left: auto;
margin-right: auto;
}
} .lienzo-abajo {
position: fixed;
left: 0;
right: 0;
bottom: 20px;
z-index: 3;
display: flex;
flex-direction: column;
align-items: center;
gap: 4px;
pointer-events: none;
} .lienzo-pista {
margin: 0;
text-transform: uppercase;
color: #000;
transition: opacity .5s ease;
font-weight: 600;
font-size: 13px;
}
.lienzo-pista.fuera {
opacity: 0;
} .lienzo-pie {
max-width: 100%;
margin: 0;
padding: 0 16px;
font-size: 14px;
font-weight: 500;
text-align: center;
color: #000; font-family: "EB Garamond", Georgia, "Times New Roman", serif;
letter-spacing: -0.02em;
} @media (max-width: 780px) {
.lienzo-pie {
padding: 0 10px;
}
} .lienzo-lista {
position: fixed;
left: -9999px;
top: 0;
width: 1px;
overflow: hidden;
}
.lienzo-lista:focus-within {
left: 12px;
top: 12px;
width: auto;
max-width: 260px;
padding: 14px 18px;
background: #fff;
border: 1px solid #1a1a1a;
z-index: 5;
}
.lienzo-lista h2 {
margin: 0 0 6px;
font-size: 11px;
letter-spacing: .08em;
text-transform: uppercase;
}
.lienzo-lista ul {
margin: 0;
padding: 0;
list-style: none;
}
.lienzo-lista li {
font-size: 13px;
line-height: 1.6;
} .lienzo-vacio,
.lienzo-aviso {
position: fixed;
left: 12px;
bottom: 12px;
max-width: 420px;
margin: 0;
padding: 8px 12px;
background: #fffbe6;
border-left: 3px solid #d6a300;
font-size: 11px;
line-height: 1.5;
color: #3a3a38;
z-index: 4;
} @media (max-width: 700px) {
.lienzo-mundo {
zoom: 1.25;
}
}