@font-face { font-family: "Newsreader"; font-style: normal; font-weight: 500; font-display: swap; src: url(newsreader.woff2) format("woff2"); }
@font-face { font-family: "Newsreader"; font-style: italic; font-weight: 500; font-display: swap; src: url(newsreader-i.woff2) format("woff2"); }
@font-face { font-family: "Public Sans"; font-style: normal; font-weight: 500; font-display: swap; src: url(publicsans.woff2) format("woff2"); }
@font-face { font-family: "Public Sans"; font-style: italic; font-weight: 500; font-display: swap; src: url(publicsans-i.woff2) format("woff2"); }

:root {
  --font-size-base: 12px;
  --font-size-medium: 16px;
  --font-size-large: 20px;
  --padding-base: 40px;
  --gap-base: 40px;
  --color-white: #fffef5;
  --color-black: #000;
  --font-primary: "Public Sans", system-ui, -apple-system, "Segoe UI", Helvetica, Arial, sans-serif;
  --font-titles: "Newsreader", Georgia, "Times New Roman", serif;
  --text-margin-base: 1.3em;
  --logo-w: clamp(290px, 40vw, 580px);
  --logo-h: calc(var(--logo-w) / 4.79);
  --header-top-offset: calc(var(--padding-base) / 2);
  --page-default-top-offset: calc(var(--logo-h) + var(--header-top-offset) + var(--padding-base));
  --default-transition-duration: .3s;
  --default-transition-timing-function: cubic-bezier(.25, .1, .25, 1);
  --ui-text-color: var(--color-black);
  --ui-fill-color: var(--color-black);
  --nav-trigger-height: 47px;
  --titulo-lh: 25.46px;
}
@media screen and (min-width: 1024px) and (max-width: 1200px) { :root { --padding-base: 30px; --gap-base: 30px; } }
@media screen and (max-width: 767px) {
  :root { --titulo-lh: 26.8px; --font-size-base: 13px; --font-size-medium: 17px; --font-size-large: 21px; --padding-base: 20px; --gap-base: 20px; --header-top-offset: var(--padding-base); }
}

*, *::before, *::after { box-sizing: border-box; border: 0 solid transparent; }
html { line-height: 1.15; -webkit-text-size-adjust: 100%; }
body, h1, h2, p, ul, figure, button, input { margin: 0; padding: 0; }
ul { list-style: none; }
img, svg, picture { display: block; vertical-align: middle; }
img { height: auto; max-width: 100%; }
a { color: inherit; text-decoration: none; }
button, input { font: inherit; color: inherit; line-height: inherit; }
button { background: none; cursor: pointer; }

body {
  background-color: var(--color-white);
  color: var(--color-black);
  font-family: var(--font-primary);
  font-size: var(--font-size-base);
  font-weight: 500;
  letter-spacing: -.013em;
  line-height: 1.34;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}
::selection { background: #000; color: #fff; }

.sr { position: absolute; width: 1px; height: 1px; margin: -1px; padding: 0; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0; }
.saltar { position: fixed; left: 12px; top: -60px; z-index: 1000; background: #000; color: #fffef5; padding: 10px 14px; font-size: 13px; transition: top .2s; }
.saltar:focus { top: 12px; }
a:focus-visible, button:focus-visible, input:focus-visible { outline: 2px solid currentColor; outline-offset: 4px; }


.cursor {
  color: var(--cursor-color, #000);
  display: none;
  height: 12px; width: 12px;
  left: 0; top: 0;
  pointer-events: none;
  position: fixed;
  transition: color var(--default-transition-duration) var(--default-transition-timing-function), transform .05s var(--default-transition-timing-function);
  will-change: transform;
  z-index: 666;
}
.cursor .default { background-color: currentColor; border-radius: 50%; height: 12px; width: 12px; }
@media (hover: hover) and (pointer: fine) {
  .js.cursor-activo .cursor { display: block; }
  .js.cursor-activo, .js.cursor-activo * { cursor: none; }
}


.pagina { position: relative; }
.js .pagina { animation: entrada 1s ease; }
@keyframes entrada { from { opacity: 0; } to { opacity: 1; } }


.pin {
  height: calc(100vh + var(--logo-h) + var(--header-top-offset));
  height: calc(100svh + var(--logo-h) + var(--header-top-offset));
  left: 0; top: 0; width: 100%;
  pointer-events: none;
  position: absolute;
  z-index: 9;
}
.index-header {
  --header-fill-override: var(--color-white);
  height: calc(var(--logo-h) + var(--header-top-offset));
  position: sticky; top: 0;
}
.logo { display: inline-flex; left: 50%; pointer-events: auto; position: absolute; top: var(--header-top-offset); transform: translate(-50%); z-index: 1; }
.logo svg { fill: var(--header-fill-override, var(--ui-fill-color)); height: var(--logo-h); width: var(--logo-w); transition: fill var(--default-transition-duration) var(--default-transition-timing-function); }


.landing { height: 100vh; height: 100svh; inset: 0; position: fixed; width: 100%; overflow: hidden; background: #1d1c1e; }
.landing picture, .landing img { height: 100%; inset: 0; object-fit: cover; position: absolute; width: 100%; z-index: 1; max-width: none; }
.landing::before { background: linear-gradient(to bottom, rgba(0, 0, 0, 0) 52%, rgba(0, 0, 0, .5) 100%); content: ""; inset: 0; pointer-events: none; position: absolute; z-index: 2; display: none; }
@media screen and (max-width: 1023px) { .landing::before { display: block; } }
.landing .overlay { background-color: #000; height: 100%; inset: 0; opacity: 0; pointer-events: none; position: absolute; width: 100%; z-index: 3; }
.landing .secret-hit { inset: 0; pointer-events: auto; position: absolute; z-index: 5; --color-secreto: var(--color-white); }

.secret-text {
  color: var(--color-secreto);
  display: flex; flex-flow: row wrap;
  font-family: var(--font-titles);
  font-size: var(--font-size-large);
  letter-spacing: 0;
  line-height: var(--titulo-lh);
  opacity: 0;
  position: absolute;
  transition: none;
  text-shadow: 0 0 22px rgba(0, 0, 0, .35);
}
.secret-text:not(.--active) { transition: opacity 1s var(--default-transition-timing-function); }
.secret-text.--active { opacity: 1; }
.secret-text span { opacity: 0; transform: translateY(.15em); transition: opacity .25s var(--default-transition-timing-function), transform .25s var(--default-transition-timing-function); }
.secret-text span:not(:last-child)::after { content: " "; white-space: pre; }
.secret-text span.--italic { font-style: italic; }
.secret-text span.--shown { opacity: 1; transform: translateY(0); }
@media screen and (min-width: 1024px) {
  
  .secret-hit[data-layout="1"] .secret-text { align-items: flex-end; bottom: 25%; right: calc(var(--padding-base) * 3); transform: translateY(25%); }
  .secret-hit[data-layout="1"] .secret-text span:first-child { margin-bottom: 1.3em; margin-right: 2em; }
  .secret-hit[data-layout="1"] .secret-text span:nth-child(2) { margin-right: 6em; margin-top: 1.3em; }
  .secret-hit[data-layout="1"] .secret-text span:nth-child(3) { margin-bottom: 6em; }
  .secret-hit[data-layout="1"] .secret-text span:nth-child(4) { margin-bottom: 4.7em; }
  .secret-hit[data-layout="1"] .secret-text span:nth-child(5) { margin-bottom: 5.35em; }
}
@media screen and (max-width: 1023px) {
  
  .secret-hit[data-layout="1"] .secret-text { bottom: 11%; flex-flow: column nowrap; font-size: clamp(19px, 3.2vw, 26px); left: 0; padding: 0 calc(var(--padding-base) * 1.6); right: auto; transform: none; width: 100%; align-items: flex-start; }
  .secret-hit[data-layout="1"] .secret-text span::after { content: none; }
  .secret-hit[data-layout="1"] .secret-text span:nth-child(2) { align-self: flex-end; }
  .secret-hit[data-layout="1"] .secret-text span:nth-child(3) { align-self: center; }
  .secret-hit[data-layout="1"] .secret-text span:nth-child(4) { margin-left: 1.8em; }
  .secret-hit[data-layout="1"] .secret-text span:nth-child(5) { align-self: flex-end; }
}


.content { background-color: var(--color-white); position: relative; top: 100vh; top: 100svh; width: 100%; z-index: 1; }
.opening { display: grid; gap: 14px var(--gap-base); grid-template-columns: repeat(21, 1fr); padding: 0 var(--padding-base); }
.opening .split { display: grid; grid-column: 1 / -1; grid-row: 1; grid-template-columns: subgrid; height: 100vh; height: 100dvh; }
.opening .large { grid-column: 1 / 9; height: 100%; margin-left: calc(var(--gap-base) * -1); position: relative; }
.opening .large img { height: 100%; inset: 0; object-fit: cover; object-position: 50% 62%; position: absolute; width: 100%; max-width: none; }
.opening .central { align-content: center; display: grid; grid-column: 9 / -1; grid-template-columns: subgrid; height: 100%; position: relative; }
.opening .image-container[data-image-orientation="landscape"] { grid-column: 4 / span 7; }
.image { aspect-ratio: var(--ratio); position: relative; }
.image img { height: 100%; inset: 0; object-fit: cover; position: absolute; width: 100%; max-width: none; }
h2.opening-text-heading { bottom: var(--padding-base); font-family: var(--font-titles); font-size: var(--font-size-large); font-weight: 500; left: 0; letter-spacing: 0; line-height: var(--titulo-lh); position: absolute; }
.opening .rest { display: grid; grid-column: 1 / -1; grid-template-columns: subgrid; }
.opening .rest .bottom-image { grid-column: 3 / span 5; margin-top: -60%; }
.opening .rest .central-image { display: none; grid-column: 1 / -1; margin: 0 calc(var(--padding-base) * -1); }
.opening .rest .opening-text { grid-column: 9 / span 6; }
@media screen and (min-width: 1024px) and (max-width: 1200px) { .opening .rest .opening-text { grid-column: 9 / span 8; } }
.opening nav.index-nav { grid-column: 19 / span 3; grid-row: 1; }
@media screen and (min-width: 1024px) and (max-width: 1200px) { .opening nav.index-nav { grid-column: 18 / span 4; } }

.text > * { margin: var(--text-margin-base) 0; }
.text > *:first-child { margin-top: 0 !important; }
.text > *:last-child { margin-bottom: 0 !important; }
.text a:hover { text-decoration: underline currentColor; text-decoration-thickness: 1px; text-underline-offset: 25%; }
.text em { font-style: italic; }


nav.main {
  color: var(--ui-text-color);
  height: calc(100vh - var(--padding-base));
  height: calc(100dvh - var(--padding-base));
  padding-top: var(--page-default-top-offset);
  position: sticky; top: 0;
  z-index: 11;
}

nav.main .inner { display: flex; flex-flow: column-reverse nowrap; height: 100%; justify-content: flex-start; row-gap: var(--padding-base); }
nav.main .menu { opacity: 0; pointer-events: none; visibility: hidden; transition: opacity var(--default-transition-duration) var(--default-transition-timing-function), visibility 0s linear var(--default-transition-duration); }
nav.main.abierto .menu { opacity: 1; pointer-events: auto; visibility: visible; transition-delay: 0s; }
nav.main .menu ul { display: flex; flex-flow: column nowrap; row-gap: .2em; }
nav.main .menu ul li a:hover { font-style: italic; }
nav.main button.nav-trigger { align-self: flex-start; display: block; line-height: 0; padding: 0; }
nav.main button.nav-trigger svg { fill: var(--ui-text-color); height: var(--nav-trigger-height); transition: fill var(--default-transition-duration) var(--default-transition-timing-function); width: auto; }


nav.small { background-color: var(--color-white); display: none; flex-flow: column nowrap; left: 0; opacity: 0; padding: var(--padding-base); pointer-events: none; position: fixed; row-gap: var(--padding-base); top: 0; visibility: hidden; width: 100%; z-index: 10; transition: opacity var(--default-transition-duration) var(--default-transition-timing-function), visibility 0s linear var(--default-transition-duration); }
nav.small.abierto { opacity: 1; pointer-events: auto; visibility: visible; transition-delay: 0s; }
nav.small a.logo { display: inline-flex; margin: 0 auto; position: static; transform: none; }
nav.small a.logo svg { fill: #000; }
nav.small .inner { display: grid; gap: 0 var(--gap-base); grid-template-columns: repeat(7, 1fr); }
nav.small .inner .menu { grid-column: 2 / -1; }
nav.small .inner .menu ul { display: flex; flex-flow: column nowrap; row-gap: .5em; width: max-content; }
nav.small .inner .menu ul li a:hover { font-style: italic; }


footer.index-footer { padding-top: 120px; position: relative; z-index: 11; }
footer .container { display: flex; flex-flow: row nowrap; gap: 0 var(--gap-base); justify-content: space-between; padding: var(--padding-base); }
footer .container .newsletter { width: clamp(100px, 14vw, 200px); }
footer .container a:hover { text-decoration: underline currentColor; text-decoration-thickness: 1px; text-underline-offset: 25%; }
form.newsletter .fields { position: relative; }
form.newsletter input[type=email] { background: none; border-bottom: 1px solid var(--color-black); border-radius: 0; outline-offset: 6px; padding: 0 14px 0 0; width: 100%; font-size: inherit; letter-spacing: inherit; }
form.newsletter input::placeholder { color: #bdbdb4; opacity: 1; }
form.newsletter button[type=submit] { padding: 4px; position: absolute; right: -4px; top: 50%; transform: translateY(-50%) translateY(-1px); line-height: 0; }
form.newsletter button[type=submit] svg { fill: var(--color-black); width: 6px; }
form.newsletter .message { margin-top: .5em; }
form.newsletter .message.--error { color: #b3261e; }
form.newsletter [hidden] { display: none; }


.aviso { background: #000; bottom: 24px; color: var(--color-white); font-size: var(--font-size-base); left: 50%; opacity: 0; padding: 10px 16px; pointer-events: none; position: fixed; transform: translate(-50%, 8px); transition: opacity .3s var(--default-transition-timing-function), transform .3s var(--default-transition-timing-function); z-index: 700; white-space: nowrap; }
.aviso.on { opacity: 1; transform: translate(-50%, 0); }


.js [data-fade], .js [data-fade-titular], .js [data-parallax] { opacity: 0; }
.js [data-fade].visto, .js [data-fade-titular].visto { opacity: 1; transition: opacity 1.2s var(--default-transition-timing-function); }
.js [data-parallax] { transform: translate3d(0, calc(var(--p, 20) * 1%), 0); }
.js [data-parallax].visto { opacity: 1; transition: opacity 1s var(--default-transition-timing-function); }


@media screen and (max-width: 1023px) {
  .opening { grid-template-columns: repeat(7, 1fr); }
  .opening .split { display: flex; flex-flow: column nowrap; }
  .opening .large { grid-column: 1 / -1; margin-right: calc(var(--gap-base) * -1); }
  .opening .large img { object-position: 50% 70%; }
  .opening .central { gap: 14px var(--gap-base); grid-column: 1 / -1; grid-template-columns: repeat(7, 1fr); height: auto; padding: var(--padding-base) 0; }
  .opening .central .image-container { display: none; }
  h2.opening-text-heading { bottom: auto; grid-column: 2 / -1; left: auto; max-width: 220px; position: relative; }
  .opening .rest { row-gap: calc(var(--padding-base) * 4); }
  .opening .rest .bottom-image { grid-column: 2 / -2; margin-top: 0; }
  .opening .rest .central-image { display: block; }
  .opening .rest .opening-text { grid-column: 2 / span 4; }
  .opening nav.index-nav { grid-column: 1 / span 1; }
  nav.main .menu { display: none; }
  nav.small { display: flex; }
  footer .container { flex-flow: column nowrap; row-gap: 1.34em; }
  footer .container .newsletter { max-width: 200px; width: 100%; }
}
@media screen and (max-height: 700px) and (max-width: 1023px) { .secret-hit[data-layout="1"] .secret-text { bottom: 5%; } }
@media screen and (max-width: 767px) {
  .opening .central { padding-top: calc(var(--padding-base) * 2); }
  .opening .rest .opening-text { grid-column: 2 / -1; }
  nav.small { padding-bottom: calc(var(--padding-base) * 3); }
  footer .container .newsletter { max-width: none; }
}


@media (prefers-reduced-motion: reduce) {
  .js .pagina { animation: none; }
  .js [data-fade], .js [data-fade-titular], .js [data-parallax] { opacity: 1; transform: none; transition: none; }
  .secret-text, .secret-text span, nav.main .menu, nav.small, .aviso, .logo svg, .cursor { transition: none; }
}