@font-face {
  font-family: "JE CAI";
  src: url("./fonts/JECAI.woff2") format("woff2"),
       url("./fonts/JECAI.woff") format("woff");
  font-weight: 400;
  font-style: normal;
  font-display: block;
}

:root{
  --bg:#fff;
  --ink:#111111;
  --muted:rgba(17,17,17,.55);
  --visual-viewport-height:100svh;

  --pad:50px;
  --edge-bottom:24px;
  --gutter:28px;
  --font:"acumin-pro", system-ui, -apple-system, Segoe UI, Roboto, Helvetica, Arial, sans-serif;
}

*{ box-sizing:border-box; }

html{
  font-size:12px;
  -webkit-tap-highlight-color: transparent;
}

html,body{ height:100%; }

body{
  margin:0;
  background:var(--bg);
  color:var(--ink);
  font-family:var(--font);
  line-height:1.45;
  overflow-x:hidden;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  text-rendering: optimizeLegibility;
}

.habitat-inhabitado{
  background:#fff;
}

a{ color:inherit; text-decoration:none; }
button,
summary,
a{
  -webkit-tap-highlight-color: transparent;
}

a:focus:not(:focus-visible),
button:focus:not(:focus-visible),
summary:focus:not(:focus-visible){
  outline:none;
}

.sr-only{
  position:absolute;
  width:1px;
  height:1px;
  padding:0;
  margin:-1px;
  overflow:hidden;
  clip:rect(0, 0, 0, 0);
  white-space:nowrap;
  border:0;
}

.u{ text-decoration: underline; text-underline-offset: 3px; }

@media (hover:hover) and (pointer:fine){
  .custom-cursor{
    position:fixed;
    top:0;
    left:0;
    width:14px;
    height:14px;
    pointer-events:none;
    z-index:9999;
    border-radius:50%;
    background-color:var(--ink);
    background-position:center;
    background-repeat:no-repeat;
    background-size:0 0;
    transform:translate(-50%, -50%);
    transition:opacity 120ms ease;
  }

  .custom-cursor::after{
    content:"";
  }

  .custom-cursor.is-hidden{
    opacity:0;
  }

  .custom-cursor.is-text{
    width:10px;
    height:10px;
  }

  .custom-cursor.is-hover{
    width:24px;
    height:24px;
    border-radius:0;
    background-color:transparent;
    background-image:url("./assets/cursors/cursor_hover_black.svg");
    background-size:24px 24px;
  }

  .custom-cursor.is-scroll{
    width:auto;
    height:auto;
    border-radius:0;
    background:transparent;
    color:var(--ink);
    font-family:var(--font);
    font-size:.72rem;
    letter-spacing:.16em;
    line-height:1;
    text-transform:uppercase;
  }

  .custom-cursor.is-scroll::after{
    content:"SCROLL";
  }
}

/* -----------------------
   BRAND
------------------------ */

.brand{
  position:fixed;
  top:var(--pad);
  left:var(--pad);
  z-index:100;
}

.brand__name{
  display:inline-block;
  width:auto;
  height:auto;
  color:var(--ink);
  font-family:"JE CAI", "Newsreader", serif;
  font-size:1.5rem;
  letter-spacing:.08em;
  line-height:1;
  text-align: left;
  white-space:nowrap;
  font-synthesis:none;
}

.brand__logo{
  display:block;
  width:100%;
  height:100%;
  object-fit:contain;
  object-position:center center;
}

/* -----------------------
   MENU
------------------------ */

.menu{
  position:fixed;
  left:var(--pad);
  bottom:var(--edge-bottom);
  z-index:10;
  transition:
    opacity 620ms cubic-bezier(0.215, 0.61, 0.355, 1),
    visibility 0ms linear 0ms;
}

.menu__nav{
  display:flex;
  flex-direction:column;
  gap:2px;
}

.menu__item{
  width:fit-content;
  font-synthesis:none;
}

.menu__item.is-active{
  text-decoration: underline;
  text-underline-offset:3px;
}

@media (hover:hover) and (pointer:fine){
  .menu__nav > a.menu__item:hover,
  .menu__nav > a.menu__item:focus-visible,
  .menu__details:not([open]) > summary.menu__item:hover,
  .menu__details:not([open]) > summary.menu__item:focus-visible,
  .project-info-toggle:hover,
  .project-info-toggle:focus-visible,
  .contact-page .col--contact a:hover,
  .contact-page .col--contact a:focus-visible,
  .menu__emblem-links a:hover,
  .menu__emblem-links a:focus-visible,
  .not-found__link:hover,
  .not-found__link:focus-visible{
    font-style:italic;
  }
}

.menu__details[open] > .menu__item{
  text-decoration: underline;
  text-underline-offset:3px;
}

.menu__details summary{
  list-style:none;
  cursor:pointer;
}

.menu__details summary::-webkit-details-marker{
  display:none;
}

.menu__sub{
  margin-left:18px;
  display:flex;
  flex-direction:column;
  gap:2px;
}

.menu__subitem.is-active{
  text-decoration: underline;
  text-underline-offset:3px;
}

.menu__subitem{
  position:relative;
  width:fit-content;
  font-synthesis:none;
}

.menu__project-meta{
  position:absolute;
  top:50%;
  opacity:0;
  pointer-events:none;
  font-family:inherit;
  font-size:.82em;
  font-style:italic;
  font-weight:inherit;
  line-height:1;
  white-space:nowrap;
  transform:translateY(-46%);
  transition:opacity 160ms ease;
}

.menu__project-year{
  right:calc(100% + 8px);
}

.menu__project-type{
  left:calc(100% + 8px);
}

@media (hover:hover) and (pointer:fine){
  .menu__subitem:hover .menu__project-meta,
  .menu__subitem:focus-visible .menu__project-meta{
    opacity:.62;
  }
}

.home-page .menu__item,
.home-page .menu__subitem{
  font-family:"Newsreader", serif;
  font-optical-sizing:auto;
  font-weight:360;
  font-style:normal;
  line-height:1.25;
}

.menu__emblem{
  position:fixed;
  right:var(--pad);
  bottom:var(--pad);
  left:auto;
  z-index:1;
  display:block;
  width:52px;
  height:52px;
  padding:4px;
  background:#fff;
  border-radius:50%;
  object-fit:contain;
  pointer-events:none;
}

.menu__emblem-contact{
  position:fixed;
  right:var(--pad);
  bottom:var(--edge-bottom);
  z-index:1;
  display:flex;
  flex-direction:column;
  align-items:flex-end;
  gap:4px;
}

.menu__emblem-contact .menu__emblem{
  position:static;
  right:auto;
  bottom:auto;
}

.menu__emblem-links{
  display:flex;
  flex-direction:column;
  align-items:flex-end;
  gap:2px;
  font-family:"Newsreader", serif;
  font-optical-sizing:auto;
  font-size:13px;
  font-weight:360;
  font-style:normal;
  line-height:1.25;
}

.menu__emblem-links a{
  width:fit-content;
  color:inherit;
  text-decoration:none;
}

/* -----------------------
   PAGE
------------------------ */

.page{
  min-height:100vh;
  padding: calc(var(--pad) * 2) var(--pad) var(--pad);
}

.home-page{
  background:#fff;
  color:#111111;
  --ink:#111111;
  --home-focus-delay:1650ms;
}

.home-page.home-hover-seen{
  --home-focus-delay:220ms;
}

.home-page.home-classic{
  --home-focus-delay:0ms;
}

.home-page::before{
  content:"";
  position:fixed;
  top:0;
  bottom:0;
  left:0;
  width:33.333vw;
  z-index:50;
  background:#fff;
  pointer-events:none;
  transition:
    opacity 620ms cubic-bezier(0.215, 0.61, 0.355, 1),
    visibility 0ms linear 620ms;
}

.home-page .brand,
.home-page .menu{
  z-index:100;
}

.home-page.home-classic::before{
  display:none;
}

.home-image{
  position:fixed;
  top:0;
  right:0;
  bottom:0;
  left:0;
  z-index:1;
  pointer-events:auto;
  overflow:hidden;
}

.home-page.home-classic .home-image{
  top:50%;
  right:auto;
  bottom:auto;
  left:50%;
  z-index:1;
  pointer-events:none;
  overflow:visible;
  transform:translate(-50%, -50%);
  display:flex;
  flex-direction:column;
  align-items:flex-end;
}

.home-image img{
  width:100%;
  height:100%;
  object-fit:cover;
  object-position:center center;
  display:block;
}

.home-page.home-classic .home-image img{
  width:50vw;
  height:auto;
  aspect-ratio:2752 / 1536;
  object-fit:cover;
}

.home-hover-zone{
  position:fixed;
  top:0;
  right:0;
  bottom:0;
  left:33.333vw;
  z-index:60;
  background:transparent;
}

.home-page.home-classic .home-hover-zone{
  display:none;
}

.home-page:has(.home-hover-zone:hover)::before,
.home-page:has(.home-hover-zone:hover) .menu,
.home-page.home-image-focus::before,
.home-page.home-image-focus .menu{
  opacity:0;
  visibility:hidden;
  pointer-events:none;
}

.home-page.home-classic.home-image-focus .menu{
  opacity:1;
  visibility:visible;
  pointer-events:auto;
}

.home-page:has(.home-hover-zone:hover)::before,
.home-page:has(.home-hover-zone:hover) .menu{
  transition-delay:
    var(--home-focus-delay),
    calc(var(--home-focus-delay) + 621ms);
}

.home-page:not(:has(.home-hover-zone:hover))::before,
.home-page:not(:has(.home-hover-zone:hover)) .menu,
.home-page.home-image-focus:not(:has(.home-hover-zone:hover))::before,
.home-page.home-image-focus:not(:has(.home-hover-zone:hover)) .menu{
  transition-delay:0ms, 0ms;
}

.home-caption{
  margin-top: 8px;
  text-align: right;
  font-size: 0.75rem;
}

/* -----------------------
   GRID
------------------------ */

.grid{
  position:relative;
  width:100%;
  max-width:1600px;
  margin:0 auto;
  padding-top:100px;

  display:grid;
  grid-template-columns: repeat(12, 1fr);
  column-gap: var(--gutter);

  /* 🔥 NUEVO: FILAS REALES */
  grid-template-rows: auto 1fr;
  row-gap: 44px;  /* aire entre números y contenido */

  align-items:start;
}

/* -----------------------
   NUMBERS (01–05)
------------------------ */

.grid__marker{
  grid-row:1;
  align-self:end;
  font-size:0.9rem;   /* ≈10.8px */
  letter-spacing:.05em;
  color:var(--ink);
}

/* cada número alineado a su columna */
.m1{ grid-column: 1 / span 2; }
.m2{ grid-column: 3 / span 3; }
.m3{ grid-column: 6 / span 4; }
.m4{ grid-column: 10 / span 2; }
.m5{ grid-column: 12 / span 1; }

/* -----------------------
   CONTENIDO
------------------------ */

/* TODO el contenido empieza en fila 2 */
.col{
  grid-row:2;
  align-self: start;
}

/* Column mapping */
.col--title{ grid-column: 1 / span 2; }
.col--text{  grid-column: 3 / span 3; }
.col--image{
  position:relative;
  align-self: start;
  grid-column: 6 / span 4;
  width: 100%;
  justify-self: stretch;
  min-width: 0;
}
.col--metaA{ grid-column: 10 / span 2; }
.col--metaB{ grid-column: 12 / span 1; }
.col--contact{
  grid-column: 1 / span 2;
  grid-row: 3;
}

.carousel{
  position: relative;
  width: 100%;
}

.carousel__track{
  position: relative;
  aspect-ratio: 4 / 5; /* ajusta según tus imágenes */
  overflow: hidden;
}

.carousel__track img{
  position: absolute;
  inset: 0;
  width: 100%;
  height: auto;

  opacity: 0;
  z-index: 0;
  -webkit-backface-visibility: hidden;
  backface-visibility: hidden;
  will-change: opacity;
  transition: none;
}

.carousel__track img.is-active{
  opacity: 1;
  z-index: 1;
}

.carousel__track img.is-leaving{
  opacity: 0;
  z-index: 2;
  pointer-events: none;
  transition: opacity 240ms ease-out;
}

.imagen-s2-project .carousel__track .stack-image img{
  transition:
    opacity 520ms cubic-bezier(0.215, 0.61, 0.355, 1),
    transform 520ms cubic-bezier(0.215, 0.61, 0.355, 1);
}

.imagen-s2-project .carousel__track .stack-image.is-arriving img{
  opacity: .88;
  transform: translateY(3px);
}

@media (prefers-reduced-motion: reduce){
  .carousel__track img,
  .carousel__track img.is-leaving,
  .imagen-s2-project .carousel__track .stack-image img{
    transition: none;
  }

  .carousel__track img,
  .carousel__track img.is-active,
  .imagen-s2-project .carousel__track .stack-image.is-arriving img{
    transform: none;
  }
}

.collectable-space .col--image{
  display: flex;
  justify-content: center;
}

.collectable-space .carousel{
  width: 80%;
}

.collectable-space .carousel__track img{
  width: 80%;
  margin: 0 auto;
}

.poem{
  grid-row: 3;
  z-index: 2;
}

.col--info-image{
  grid-row: 2;
  grid-column: 6 / span 6;
}

.col--info-image img{
  width: 25%;
  height: auto;
  display: block;
}

.project-info-toggle{
  display:none;
}

.project-info-panel[hidden]{
  display:none;
}

.project-info-panel__meta{
  margin-bottom: 2rem;
}

.project-info-panel__meta-item{
  margin:0 0 .15rem;
  line-height:1.25;
}

.project-info-panel__actions{
  display:flex;
  flex-wrap:wrap;
  gap:.75rem;
  margin-top:1.8rem;
}

.project-info-panel__action{
  display:inline-flex;
  align-items:center;
  width:fit-content;
  text-decoration:underline;
  text-underline-offset:3px;
}

.project-info-panel__action--button{
  padding:0;
  border:0;
  background:transparent;
  color:inherit;
  font:inherit;
  line-height:inherit;
  cursor:pointer;
}

.patria-project{
  --project-viewport-height: var(--visual-viewport-height, 100svh);
  --project-stack-min-height: var(--project-viewport-height);
  --project-image-max-height: 70svh;
  --project-scroll-padding-top: 0px;
  --project-scroll-padding-bottom: 0px;
  height: var(--project-viewport-height);
  overflow: hidden;
}

.patria-project .brand{
  display:block;
  color:#fff;
  mix-blend-mode:difference;
  z-index: 60;
}

.patria-project .brand__name{
  color:#fff;
}

.patria-project .menu{
  color:#fff;
  mix-blend-mode:difference;
  z-index:60;
}

.patria-project .menu__item,
.patria-project .menu__subitem{
  color:#fff;
  font-family:"Newsreader", serif;
  font-optical-sizing:auto;
  font-weight:360;
  font-style:normal;
  line-height:1.25;
}

.patria-project .project-info-toggle{
  display:block;
  position:fixed;
  right: var(--pad);
  bottom: var(--pad);
  z-index: 60;
  padding:0;
  border:0;
  background:transparent;
  color:#fff;
  font-family:"Newsreader", serif;
  font-size:1rem;
  font-optical-sizing:auto;
  font-weight:360;
  font-style:normal;
  line-height:1.2;
  cursor:pointer;
  text-decoration: underline;
  text-underline-offset: 3px;
  mix-blend-mode:difference;
}

.patria-project .project-info-toggle__close{
  display:none;
}

.patria-project .project-info-panel{
  position:fixed;
  inset:0;
  z-index: 18;
  padding: calc(var(--pad) * 2) var(--pad) var(--pad);
  background: rgba(255,255,255,.78);
  backdrop-filter: blur(8px);
  overflow-y:auto;
}

.patria-project .project-info-panel__inner{
  width:min(100%, 420px);
  margin-right:auto;
}

.patria-project .project-info-panel__meta-item{
  font-family:"Newsreader", serif;
  font-optical-sizing:auto;
  font-weight:360;
  font-style:normal;
  line-height:1.25;
}

.patria-project .project-info-panel__meta-item em{
  font-style:italic;
}

.patria-project .project-info-panel__text{
  font-family:"Newsreader", serif;
  font-size:1rem;
  font-optical-sizing:auto;
  font-weight:340;
  font-style:normal;
  margin:0 0 1.2rem;
  line-height:1.38;
}

.patria-project .page{
  height: var(--project-viewport-height);
  padding: 0;
  overflow-y: auto;
  -webkit-overflow-scrolling: touch;
  scroll-behavior: smooth;
  scroll-snap-type: y mandatory;
  scroll-padding-top: var(--project-scroll-padding-top);
  scroll-padding-bottom: var(--project-scroll-padding-bottom);
}

.patria-project .grid{
  display:flex;
  flex-direction:column;
  width:100%;
  max-width:none;
  margin:0 auto;
  padding-top:0;
  gap:0;
  align-items:stretch;
}

.patria-project .grid__marker,
.patria-project .col--title,
.patria-project .col--text,
.patria-project .col--metaA,
.patria-project .col--metaB{
  display:none;
}

.patria-project .col--image{
  order:1;
  width:100%;
  margin:0 auto;
  display:flex;
  justify-content:center;
}

.patria-project .carousel{
  width:100%;
  max-width:none;
  margin:0;
}

.patria-project .carousel__track{
  aspect-ratio:auto;
  display:flex;
  flex-direction:column;
  gap:0;
  overflow:visible;
}

.patria-project .stack-image{
  min-height: var(--project-stack-min-height);
  margin:0;
  display:flex;
  align-items:center;
  justify-content:center;
  scroll-snap-align:center;
  scroll-snap-stop:always;
  cursor:pointer;
}

.patria-project .carousel__track img{
  position:static;
  inset:auto;
  display:block;
  width:min(100%, 82vw);
  height:auto;
  max-height:var(--project-image-max-height);
  max-width:100%;
  margin:0 auto;
  opacity:1;
  z-index:auto;
  transform:translateZ(0);
  -webkit-transform:translateZ(0);
  transform-origin:center center;
  -webkit-transform-origin:center center;
  backface-visibility:visible;
  will-change:auto;
  transition:none;
  object-fit:contain;
  object-position:center center;
  align-self:center;
}

.patria-project .stack-image--video{
  width:100%;
}

.patria-project .project-video{
  display:block;
  width:100vw;
  height:var(--project-viewport-height);
  max-width:none;
  max-height:none;
  object-fit:cover;
  object-position:center center;
}

.out-of-the-box-project .stack-image--video{
  width:100%;
  min-height:var(--project-viewport-height);
  background:#000;
}

.out-of-the-box-project .project-video{
  display:block;
  width:100vw;
  height:82svh;
  max-width:none;
  max-height:82%;
  object-fit:contain;
  object-position:center center;
}

.patria-project.info-open .page{
  overflow:hidden;
}

.patria-project.info-open .project-info-toggle__close{
  display:inline;
  text-decoration: underline;
  text-underline-offset: 3px;
}

.patria-project.info-open .project-info-toggle{
  text-decoration:none;
}

.patria-project.info-open .project-info-toggle__label{
  display:none;
}

.pudra-project{
  --project-viewport-height: var(--visual-viewport-height, 100svh);
  --project-stack-min-height: var(--project-viewport-height);
  --project-image-max-height: 70svh;
  --project-scroll-padding-top: 0px;
  --project-scroll-padding-bottom: 0px;
  height: var(--project-viewport-height);
  overflow: hidden;
}

.pudra-project .brand{
  display:block;
  z-index: 60;
}

.pudra-project .menu{
  z-index:60;
}

.pudra-project .menu__item,
.pudra-project .menu__subitem{
  font-family:"Newsreader", serif;
  font-optical-sizing:auto;
  font-weight:360;
  font-style:normal;
  line-height:1.25;
}

.pudra-project .project-info-toggle{
  display:block;
  position:fixed;
  right: var(--pad);
  bottom: var(--pad);
  z-index: 60;
  padding:0;
  border:0;
  background:transparent;
  color:var(--ink);
  font-family:"Newsreader", serif;
  font-size:1rem;
  font-optical-sizing:auto;
  font-weight:360;
  font-style:normal;
  line-height:1.2;
  cursor:pointer;
  text-decoration: underline;
  text-underline-offset: 3px;
}

.pudra-project .project-info-toggle__close{
  display:none;
}

.pudra-project .project-info-panel{
  position:fixed;
  inset:0;
  z-index: 18;
  padding: calc(var(--pad) * 2) var(--pad) var(--pad);
  background: rgba(255,255,255,.78);
  backdrop-filter: blur(8px);
  overflow-y:auto;
}

.pudra-project .project-info-panel__inner{
  width:min(100%, 420px);
  margin-right:auto;
}

.pudra-project .project-info-panel__meta-item{
  font-family:"Newsreader", serif;
  font-optical-sizing:auto;
  font-weight:360;
  font-style:normal;
  line-height:1.25;
}

.pudra-project .project-info-panel__meta-item em{
  font-style:italic;
}

.pudra-project .project-info-panel__text{
  font-family:"Newsreader", serif;
  font-size:1rem;
  font-optical-sizing:auto;
  font-weight:340;
  font-style:normal;
  margin:0 0 1.2rem;
  line-height:1.38;
}

.pudra-project .page{
  height: var(--project-viewport-height);
  padding: 0;
  overflow-y: auto;
  -webkit-overflow-scrolling: touch;
  scroll-behavior: smooth;
  scroll-snap-type: y mandatory;
  scroll-padding-top: var(--project-scroll-padding-top);
  scroll-padding-bottom: var(--project-scroll-padding-bottom);
}

.pudra-project .grid{
  display:flex;
  flex-direction:column;
  width:100%;
  max-width:none;
  margin:0 auto;
  padding-top:0;
  gap:0;
  align-items:stretch;
}

.pudra-project .grid__marker,
.pudra-project .col--title,
.pudra-project .col--text,
.pudra-project .col--metaA,
.pudra-project .col--metaB{
  display:none;
}

.pudra-project .col--image{
  order:1;
  width:100%;
  margin:0 auto;
  display:flex;
  justify-content:center;
}

.pudra-project .carousel{
  width:100%;
  max-width:none;
  margin:0;
}

.pudra-project .carousel__track{
  aspect-ratio:auto;
  display:flex;
  flex-direction:column;
  gap:0;
  overflow:visible;
}

.pudra-project .stack-image{
  min-height: var(--project-stack-min-height);
  margin:0;
  display:flex;
  align-items:center;
  justify-content:center;
  scroll-snap-align:center;
  scroll-snap-stop:always;
  cursor:pointer;
}

.pudra-project .carousel__track img{
  position:static;
  inset:auto;
  display:block;
  width:min(92vw, 720px);
  height:auto;
  max-height:var(--project-image-max-height);
  max-width:100%;
  margin:0 auto;
  opacity:1;
  z-index:auto;
  transform:translateZ(0);
  -webkit-transform:translateZ(0);
  transform-origin:center center;
  -webkit-transform-origin:center center;
  backface-visibility:visible;
  will-change:auto;
  transition:none;
  object-fit:contain;
  object-position:center center;
  align-self:center;
}

.pudra-project.info-open .page{
  overflow:hidden;
}

.pudra-project.info-open .project-info-toggle__close{
  display:inline;
  text-decoration: underline;
  text-underline-offset: 3px;
}

.pudra-project.info-open .project-info-toggle{
  text-decoration:none;
}

.pudra-project.info-open .project-info-toggle__label{
  display:none;
}

.project-creative-link{
  display:inline-flex;
  width:fit-content;
  margin-top:.6rem;
  text-decoration:underline;
  text-underline-offset:3px;
}

.project-research-summary{
  display:none;
}

.project-research-summary__item{
  margin:0 0 1.55rem;
}

.project-research-summary__item:last-child{
  margin-bottom:0;
}

.project-research-summary__index{
  margin:0 0 .35rem;
  font-size:.9rem;
  letter-spacing:.05em;
  line-height:1.2;
}

.project-research-summary__value{
  margin:0;
  max-width:28ch;
  line-height:1.45;
}

.project-research-summary__value--body{
  margin-bottom:1rem;
}

.project-research-summary__item .project-research-summary__value--body:last-child{
  margin-bottom:0;
}

.project-research-sheet{
  position:fixed;
  top:0;
  bottom:0;
  left:calc(
    ((100vw - min(calc(100vw - (var(--pad) * 2)), 1600px)) / 2) +
    (
      (
        min(calc(100vw - (var(--pad) * 2)), 1600px) -
        (11 * var(--gutter))
      ) / 12 * 5
    ) +
    (5 * var(--gutter))
  );
  right:calc((100vw - min(calc(100vw - (var(--pad) * 2)), 1600px)) / 2);
  z-index:16;
  padding:0;
  border-left:0;
  background:transparent;
  box-shadow:none;
  display:flex;
  flex-direction:column;
  align-items:flex-start;
  opacity:0;
  visibility:hidden;
  pointer-events:none;
  transform:translateX(56px);
  overflow-x:hidden;
  overflow-y:hidden;
  transition:
    opacity 280ms ease,
    transform 380ms cubic-bezier(.22,1,.36,1),
    visibility 0ms linear 380ms;
}

.project-research-sheet__close{
  flex:0 0 auto;
  margin:0 0 2rem;
  padding:0;
  border:0;
  background:transparent;
  color:inherit;
  font:inherit;
  cursor:pointer;
  text-decoration:underline;
  text-underline-offset:3px;
}

.project-research-index{
  display:none;
  width:100%;
}

.project-research-index .menu__nav{
  gap:2px;
  padding:0;
  width:fit-content;
}

.project-research-index__item,
.project-research-index__subitem{
  padding:0;
  border:0;
  background:transparent;
  color:inherit;
  font:inherit;
  text-align:left;
  cursor:pointer;
}

.project-research-index__group{
  display:flex;
  flex-direction:column;
  gap:2px;
}

.project-research-content{
  width:100%;
  flex:1 1 auto;
  min-height:0;
  overflow-x:hidden;
  overflow-y:auto;
  scroll-behavior:smooth;
  scroll-snap-type:y mandatory;
  -webkit-overflow-scrolling:touch;
}

.project-research-content__spacer{
  display:none;
}

.project-research-chapter{
  min-height:100%;
  padding:0 0 3rem;
  scroll-snap-align:start;
  scroll-snap-stop:always;
}

.project-research-chapter ~ .project-research-chapter{
  padding-top:2.75rem;
}

.project-research-chapter__title{
  margin:0 0 1.1rem;
  font-size:.76rem;
  font-weight:400;
  letter-spacing:.16em;
  line-height:1.2;
  text-transform:uppercase;
}

.project-research-chapter__context{
  text-transform:none;
}

.project-research-chapter__subtitle{
  margin:0 0 1.15rem;
  line-height:1.4;
}

.project-research-chapter__figure{
  margin:0 0 1.25rem;
  display:flex;
  justify-content:center;
}

.project-research-chapter__image{
  display:block;
  width:min(100%, 360px);
  height:250px;
  object-fit:cover;
  object-position:center center;
}

.project-research-chapter__image--lower-focus{
  object-position:center 72%;
}

.project-research-visual{
  position:absolute;
  inset:0;
  z-index:3;
  display:grid;
  place-items:center;
  opacity:0;
  visibility:hidden;
  pointer-events:none;
  transition:
    opacity 260ms ease,
    visibility 0ms linear 260ms;
}

.project-research-visual__image{
  display:block;
  width:min(100%, 360px);
  height:250px;
  object-fit:cover;
  object-position:center center;
}

.project-research-visual__figure{
  margin:0;
  width:min(100%, 360px);
  display:flex;
  flex-direction:column;
  align-items:center;
}

.project-research-visual__caption{
  margin:.65rem 0 0;
  width:100%;
  line-height:1.35;
  text-align:center;
}

.project-research-visual__caption strong{
  font-weight:700;
}

.project-research-visual__caption em{
  font-style:italic;
}

.project-research-visual__caption span{
  display:block;
  margin-top:.2rem;
  font-size:.82em;
  line-height:1.25;
}

.project-research-visual__image--lower-focus{
  object-position:center 72%;
}

.project-research-visual__image--contain{
  object-fit:contain;
}

.project-research-visual__image--square{
  height:auto;
  aspect-ratio:1 / 1;
}

.project-research-visual__image--portrait{
  width:min(100%, 235px);
  height:auto;
}

.project-research-mobile-figure{
  display:none;
}

.jw-a-show-project.research-visual-open .project-research-visual{
  opacity:1;
  visibility:visible;
  transition-delay:0ms;
}

.jw-a-show-project.research-visual-backdrop .col--image .carousel{
  filter:blur(10px);
  opacity:.38;
  transform:scale(.985);
}

.jw-a-show-project .col--image .carousel{
  transition:
    filter 260ms ease,
    opacity 260ms ease,
    transform 260ms ease;
}

.project-research-chapter__columns{
  display:grid;
  grid-template-columns:repeat(3, minmax(0, 1fr));
  column-gap:var(--gutter);
  align-items:start;
}

.project-research-chapter__column{
  min-width:0;
}

.project-research-chapter__text{
  margin:0 0 1.2rem;
  line-height:1.55;
}

.project-research-chapter__text sup{
  font-size:.72em;
  line-height:0;
  vertical-align:super;
}

.project-research-chapter__text:last-child{
  margin-bottom:0;
}

.jw-a-show-project.research-open .project-research-summary{
  display:block;
  grid-row:2;
  grid-column:1 / span 2;
  align-self:start;
  padding-right:1.4rem;
}

.jw-a-show-project.research-open .project-research-summary__item:not(:first-child){
  display:none;
}

.jw-a-show-project.research-open .project-research-summary__index{
  display:none;
}

.jw-a-show-project.research-open .col--title,
.jw-a-show-project.research-open .col--text,
.jw-a-show-project.research-open .col--metaA,
.jw-a-show-project.research-open .col--metaB{
  display:none;
}

.jw-a-show-project.research-open .col--image{
  grid-column:3 / span 3;
  width:100%;
}

.jw-a-show-project.research-open .project-research-sheet{
  padding:var(--pad) 1.35rem 1.5rem;
  border-left:1px solid rgba(17,17,17,.08);
  background:rgba(255,252,248,.92);
  box-shadow:-18px 0 34px rgba(17,17,17,.06);
  backdrop-filter:blur(10px);
  opacity:1;
  visibility:visible;
  pointer-events:auto;
  transform:translateX(0);
  transition-delay:0ms;
}

/* -----------------------
   MAPOI CREATIVE PROCESS
------------------------ */

.project-process-page{
  min-height:100vh;
  position:relative;
  background:#fff;
}

.project-process-page .brand{
  z-index:20;
}

.project-process-page .menu__item,
.project-process-page .menu__subitem,
.project-process-page .creative-process__back{
  font-family:"Newsreader", serif;
  font-optical-sizing:auto;
  font-weight:360;
  font-style:normal;
  line-height:1.25;
}

.project-process-page .page{
  position:relative;
  z-index:1;
  min-height:100svh;
  display:flex;
  align-items:center;
  justify-content:center;
  padding: 0 var(--pad);
}

.creative-process{
  width:100%;
  margin:0 auto;
}

.creative-process__back{
  display:block;
  position:fixed;
  right: var(--pad);
  bottom: var(--pad);
  z-index:25;
  padding:12px 14px;
  border:0;
  background:transparent;
  color:var(--ink);
  font:inherit;
  text-decoration: underline;
  text-underline-offset: 3px;
}

.creative-process__stage{
  position:relative;
  width:100%;
  margin:0 auto;
  aspect-ratio:16 / 9;
  isolation:isolate;
}

/* Keep the collage on the original artboard, but scale it up slightly for more presence. */
.creative-process__canvas{
  position:absolute;
  top:50%;
  left:50%;
  height:100%;
  aspect-ratio:3508 / 2480;
  transform:translate(-50%, -50%) scale(1.08);
}

.moodboard-piece{
  position:absolute;
  margin:0;
  opacity:0;
  transform-origin:center center;
  will-change:opacity, transform, filter;
  filter:drop-shadow(0 18px 34px rgba(17,17,17,.06));
  transform:
    translate3d(var(--enter-x, 0px), var(--enter-y, 26px), 0)
    rotate(var(--piece-rotation, 0deg))
    scale(.955);
  transition:
    opacity 1080ms cubic-bezier(.22,1,.36,1),
    transform 1240ms cubic-bezier(.22,1,.36,1),
    filter 450ms ease;
}

.moodboard-piece img{
  display:block;
  width:100%;
  height:auto;
}

.moodboard-piece.is-visible{
  opacity:1;
  transform:
    translate3d(0, 0, 0)
    rotate(var(--piece-rotation, 0deg))
    scale(1);
}

.creative-process__stage.is-instant .moodboard-piece{
  transition-duration:0ms;
}

@media (hover:hover) and (pointer:fine){
  .project-info-panel__action:hover,
  .project-creative-link:hover{
    opacity:.68;
  }

  .creative-process__back:hover{
    opacity:.68;
  }
}

/* Desktop composition: edit top / left / width here to retune the collage. */
.piece--bag{
  top:10.5%;
  left:2.4%;
  width:28.8%;
  z-index:6;
  --piece-rotation:-14deg;
  --enter-x:-28px;
  --enter-y:36px;
}

.piece--note{
  top:15.2%;
  left:43.5%;
  width:10.4%;
  z-index:7;
  --enter-y:-24px;
}

.piece--woven{
  top:5.8%;
  left:59.5%;
  width:25.1%;
  z-index:3;
  --enter-y:-28px;
}

.piece--candle{
  top:58.3%;
  left:7.5%;
  width:10.1%;
  z-index:4;
  --enter-y:28px;
}

.piece--pattern{
  top:61.7%;
  left:22.9%;
  width:48.3%;
  z-index:1;
  --enter-y:26px;
}

.piece--cauliflower{
  top:24.2%;
  left:25.2%;
  width:43.8%;
  z-index:5;
  --enter-y:34px;
}

.piece--red{
  top:63.6%;
  left:67.2%;
  width:27.6%;
  z-index:4;
  --enter-x:24px;
  --enter-y:16px;
}

/* Habitat Inhabitado composition */
.habitat-piece--flower-large{
  top:3.5%;
  left:1%;
  width:22%;
  z-index:7;
  --piece-rotation:-8deg;
  --enter-x:-26px;
  --enter-y:-14px;
}

.habitat-piece--flower-small{
  top:13.2%;
  left:15.8%;
  width:6.2%;
  z-index:8;
  --piece-rotation:-18deg;
  --enter-y:-18px;
}

.habitat-piece--pods{
  top:5.5%;
  left:27.5%;
  width:26%;
  z-index:5;
  --piece-rotation:-5deg;
  --enter-y:-20px;
}

.habitat-piece--squares{
  top:18.8%;
  left:18.5%;
  width:22%;
  z-index:2;
  --enter-y:18px;
}

.habitat-piece--collage{
  top:18.2%;
  left:35.2%;
  width:24%;
  z-index:3;
  --enter-y:22px;
}

.habitat-piece--green-plate{
  top:37%;
  left:8.5%;
  width:31%;
  z-index:4;
  --enter-x:-18px;
  --enter-y:26px;
}

.habitat-piece--red-plate{
  top:42%;
  left:50.8%;
  width:29.5%;
  z-index:4;
  --enter-y:26px;
}

.habitat-piece--chair{
  top:31.5%;
  left:72.4%;
  width:15.5%;
  z-index:6;
  --enter-x:18px;
  --enter-y:18px;
}

.habitat-piece--amber{
  top:13.5%;
  left:66.8%;
  width:10.6%;
  z-index:7;
  --enter-y:-20px;
}

.habitat-piece--textile{
  top:42.6%;
  left:83.7%;
  width:16.4%;
  z-index:1;
  --enter-x:24px;
  --enter-y:18px;
}

.habitat-piece--pomegranate{
  top:63.2%;
  left:29%;
  width:11.8%;
  z-index:7;
  --enter-y:16px;
}

.habitat-piece--lips{
  top:58.8%;
  left:44.2%;
  width:11%;
  z-index:7;
  --enter-y:16px;
}

.habitat-piece--shell{
  top:58.2%;
  left:74.7%;
  width:9%;
  z-index:8;
  --piece-rotation:6deg;
  --enter-x:14px;
  --enter-y:16px;
}

/* Collectable Space composition */
.collectable-process-page{
  background:#fff;
}

.collectable-piece--panel{
  top:16.2%;
  left:34.2%;
  width:29.8%;
  z-index:4;
  --piece-rotation:-1deg;
  --enter-y:-18px;
}

.collectable-piece--fill{
  top:0;
  left:0;
  width:100%;
  z-index:0;
  --enter-y:0px;
}

.collectable-piece--textile-frame{
  top:17.8%;
  left:35%;
  width:28.7%;
  z-index:5;
  --piece-rotation:-2deg;
  --enter-y:-14px;
}

.collectable-piece--portrait{
  top:44.6%;
  left:46.1%;
  width:10.4%;
  z-index:7;
  --piece-rotation:-1deg;
  --enter-y:12px;
}

.collectable-piece--chair-slim{
  top:1.2%;
  left:60.6%;
  width:19.2%;
  z-index:10;
  --piece-rotation:28deg;
  --enter-x:20px;
  --enter-y:-24px;
}

.collectable-piece--chair-heavy{
  top:60.4%;
  left:19.4%;
  width:16.7%;
  z-index:6;
  --piece-rotation:-28deg;
  --enter-x:-20px;
  --enter-y:18px;
}

.collectable-piece--pot{
  top:56.3%;
  left:38.2%;
  width:28.5%;
  z-index:9;
  --enter-y:28px;
}

.collectable-piece--leg-right{
  top:38.9%;
  left:58.2%;
  width:31%;
  z-index:3;
  --enter-x:18px;
  --enter-y:12px;
}

.collectable-piece--leg-left{
  top:35.9%;
  left:7.2%;
  width:35.2%;
  z-index:3;
  --enter-x:-18px;
  --enter-y:12px;
}

.collectable-piece--clock{
  top:36.4%;
  left:47.4%;
  width:6%;
  z-index:8;
  --piece-rotation:-5deg;
  --enter-y:-18px;
}

.contact-page .grid{
  padding-top: 0;
  row-gap: 24px;
}

.contact-page .menu__item,
.contact-page .menu__subitem,
.contact-page .col__p{
  font-family:"Newsreader", serif;
  font-optical-sizing:auto;
  font-weight:360;
  font-style:normal;
  line-height:1.25;
}

.contact-page .col--contact{
  grid-column: 1 / span 2;
  grid-row: 1;
  align-self: start;
  display:none;
}

.contact-page .col--text{
  grid-column: 3 / span 4;
  grid-row: 1;
}

.contact-page .col--info-image{
  grid-column: 7 / span 2;
  grid-row: 1;
  align-self:start;
  justify-self:start;
  width:min(100%, 132px);
  margin:0;
}

.contact-page .col--info-image img{
  display:block;
  width:100%;
  aspect-ratio:3 / 4;
  object-fit:cover;
  object-position:center 22%;
}

.not-found-page .menu__item,
.not-found-page .menu__subitem,
.not-found-page .not-found__code,
.not-found-page .not-found__title,
.not-found-page .not-found__text,
.not-found-page .not-found__link{
  font-family:"Newsreader", serif;
  font-optical-sizing:auto;
  font-weight:360;
  font-style:normal;
  line-height:1.25;
}

.not-found{
  min-height:calc(100vh - (var(--pad) * 3));
  padding-top:0;
  align-content:center;
}

.not-found__code{
  grid-column:1 / span 2;
  grid-row:1;
  margin:0;
  font-size:1rem;
}

.not-found__content{
  grid-column:3 / span 4;
  grid-row:1;
}

.not-found__title{
  margin:0 0 1.2rem;
  font-size:1rem;
  font-weight:360;
}

.not-found__text{
  max-width:34ch;
  margin:0 0 1.2rem;
}

.not-found__link{
  display:inline-flex;
  width:fit-content;
}

@media (hover:hover) and (pointer:fine){
  .not-found-page .not-found__link:hover,
  .not-found-page .not-found__link:focus-visible{
    font-style:italic;
  }
}

/* m2 */
.p1{
  grid-column: 3 / span 3;
}

/* m3 */
.p2{
  grid-column: 6 / span 4;
}

/* m4 */
.p3{
  grid-column: 10 / span 2;
}

/* -----------------------
   TYPOGRAPHY
------------------------ */

.col__title{
  margin:0;
  font-size:1rem;  /* ≈15.6px */
  font-weight:400;
}

.col__p{
  margin:0 0 1.2rem;
  max-width:42ch;
  line-height:1.5;
}

.col--contact .col__p{
  margin-bottom:0;
}

.col__label{
  margin-bottom:10px;
}

.meta{
  line-height:1.45;
}

.meta__k{
  color:var(--muted);
  margin-bottom:6px;
}

/* -----------------------
   IMAGE
------------------------ */

.figure{
  margin:0;
}

.figure__img{
  width:100%;
  height:auto;
  display:block;
  max-width: none;
}

/* -----------------------
   RESPONSIVE
------------------------ */

@media (max-width:1100px){

  :root{
    --pad:36px;
    --gutter:20px;
  }

  .grid{
    padding-top:0;
    grid-template-columns:1fr;
    grid-template-rows:none;
    row-gap:28px;
  }

  .page{
    padding: calc(var(--pad) * 2) var(--pad) 132px;
  }

  .grid__marker{
    display:none;
  }

  .col--title,
  .col--contact,
  .col--text,
  .col--image,
  .col--metaA,
  .col--metaB,
  .col--info-image{
    grid-column:1 / -1;
    grid-row:auto;
  }

  .col__p{
    max-width:none;
  }

  .col--info-image img{
    width:min(100%, 260px);
  }
}

/* =========================
   MOBILE
========================= */

@media (max-width: 768px){

  :root{
    --pad:18px;
    --gutter:16px;
  }

  html{
    font-size:14px;
  }

  body{
    min-height:100svh;
  }

  .brand{
    top: 50px;
    left: 50px;
    right: 50px;
    width: auto;
  }

  .brand__name{
    display:block;
    width:fit-content;
    margin-left:auto;
  }

  .grid{
    display: flex;
    flex-direction: column;
    gap: 20px;
    max-width: 100%;
  }

  .col{
    width:100%;
  }

  .col--title{
    order:1;
  }

  .col--contact{
    order:2;
  }

  .col--image,
  .col--info-image{
    order:3;
  }

  .col--text{
    order:4;
  }

  .col--metaA{
    order:5;
  }

  .col--metaB{
    order:6;
  }

  .page{
    padding: 84px var(--pad) 172px;
  }

  .menu{
    left: var(--pad);
    right: var(--pad);
    bottom: var(--pad);
    width: auto;
    max-width: 320px;
  }

  .info-open .menu{
    opacity:0;
    visibility:hidden;
    pointer-events:none;
    transition:
      opacity 420ms cubic-bezier(0.215, 0.61, 0.355, 1),
      visibility 0ms linear 420ms;
  }

  .menu__nav{
    gap:4px;
    padding:12px 14px;
    background:transparent;
    border:0;
    border-radius:0;
    box-shadow:none;
    backdrop-filter:none;
  }

  .menu__emblem,
  .menu__emblem-contact{
    display:none;
  }

  .menu__sub{
    margin-left:18px;
    margin-top:6px;
    gap:4px;
  }

  .home-image{
    position:relative;
    top:auto;
    right:auto;
    bottom:auto;
    left:auto;
    transform:none;
    min-height:100svh;
    box-sizing:border-box;
    width:100vw;
    margin-left:calc(50% - 50vw);
    padding:84px 0 172px;
    display:grid;
    place-items:center;
  }

  .home-page.home-classic .home-image{
    position:relative;
    top:auto;
    right:auto;
    bottom:auto;
    left:auto;
    z-index:1;
    pointer-events:none;
    overflow:visible;
    transform:none;
    min-height:100svh;
    box-sizing:border-box;
    width:100vw;
    margin-left:calc(50% - 50vw);
    padding:84px 0 172px;
    display:grid;
    place-items:center;
  }

  .home-page::before{
    display:none;
  }

  .home-hover-zone{
    display:none;
  }

  .home-image img{
    width:min(calc(100vw - (var(--pad) * 2)), 82vw, 460px);
    height:auto;
    max-width:none;
    margin:0 auto;
  }

  .home-page.home-classic .home-image img{
    width:min(calc(100vw - (var(--pad) * 2)), 82vw, 460px);
    height:auto;
    max-width:none;
    margin:0 auto;
    aspect-ratio:auto;
    object-fit:cover;
  }

  .home-caption{
    width:100%;
    text-align:center;
  }

  .carousel__track{
    aspect-ratio:3 / 4;
  }

  .carousel__track img{
    height:100%;
    object-fit:contain;
    object-position:center;
  }

  .collectable-space .col--image{
    justify-content:flex-start;
  }

  .collectable-space .carousel{
    width:100%;
  }

  .collectable-space .carousel__track img{
    width:100%;
  }

  .col--info-image img{
    width:min(100%, 320px);
  }

  .habitat-inhabitado .menu,
  .mapoi-project .menu,
  .project-process-page .menu,
  .collectable-space-project .menu,
  .novia-robot-project .menu{
    left:0;
    right:0;
    bottom:0;
    width:auto;
    max-width:none;
    padding:16px 0 var(--pad);
    background:transparent;
    overflow:visible;
    isolation:isolate;
    pointer-events:none;
  }

  .habitat-inhabitado .menu::after,
  .mapoi-project .menu::after,
  .project-process-page .menu::after,
  .collectable-space-project .menu::after,
  .novia-robot-project .menu::after{
    content:"";
    position:absolute;
    left:0;
    right:0;
    top:-88px;
    bottom:0;
    background:rgba(255,255,255,.12);
    backdrop-filter:saturate(150%) blur(16px);
    -webkit-backdrop-filter:saturate(150%) blur(16px);
    -webkit-mask-image:linear-gradient(to bottom, transparent 0, rgba(0,0,0,.5) 36px, #000 88px, #000 100%);
    mask-image:linear-gradient(to bottom, transparent 0, rgba(0,0,0,.5) 36px, #000 88px, #000 100%);
    pointer-events:none;
    z-index:0;
  }

  .habitat-inhabitado .menu__nav,
  .mapoi-project .menu__nav,
  .project-process-page .menu__nav,
  .collectable-space-project .menu__nav,
  .novia-robot-project .menu__nav{
    position:relative;
    z-index:1;
    width:fit-content;
    margin-left:var(--pad);
    pointer-events:auto;
  }

  .habitat-inhabitado,
  .mapoi-project,
  .collectable-space-project,
  .novia-robot-project{
    --project-viewport-height: var(--visual-viewport-height, 100svh);
    --project-stack-min-height: calc(var(--project-viewport-height) * 0.78);
    --project-image-max-height: calc(var(--project-viewport-height) * 0.62);
    --project-scroll-padding-top: calc(var(--project-viewport-height) * 0.14);
    --project-scroll-padding-bottom: calc(var(--project-viewport-height) * 0.18);
  }

  .collectable-space-project{
    --project-stack-min-height: calc(var(--project-viewport-height) * 0.86);
    --project-image-max-height: calc(var(--project-viewport-height) * 0.68);
  }

  .habitat-inhabitado{
    height: var(--project-viewport-height);
    overflow: hidden;
  }

  .habitat-inhabitado .brand{
    z-index: 24;
  }

  .habitat-inhabitado .project-info-toggle{
    display:block;
    position:fixed;
    right: var(--pad);
    bottom: var(--pad);
    z-index: 25;
    padding:12px 14px;
    border:0;
    background:transparent;
    color:var(--ink);
    font:inherit;
    cursor:pointer;
    text-decoration: underline;
    text-underline-offset: 3px;
  }

  .habitat-inhabitado .project-info-toggle__close{
    display:none;
  }

  .habitat-inhabitado .project-info-panel{
    position:fixed;
    inset:0;
    z-index: 18;
    padding: 104px 18px 32px 32px;
    background: rgba(255,255,255,.78);
    backdrop-filter: blur(8px);
    overflow-y:auto;
  }

  .habitat-inhabitado .project-info-panel__inner{
    width:min(100%, 360px);
    margin-right:auto;
  }

  .habitat-inhabitado .project-info-panel__text{
    margin:0 0 1.2rem;
    line-height:1.5;
  }

  .habitat-inhabitado .page{
    padding: 82px 8px 172px;
    height: var(--project-viewport-height);
    overflow-y: auto;
    -webkit-overflow-scrolling: touch;
    scroll-behavior: smooth;
    scroll-snap-type: y mandatory;
    scroll-padding-top: var(--project-scroll-padding-top);
    scroll-padding-bottom: var(--project-scroll-padding-bottom);
  }

  .habitat-inhabitado .grid{
    display:flex;
    flex-direction:column;
    width:min(100%, 430px);
    max-width:none;
    margin:0 auto;
    gap: 28px;
    align-items: stretch;
  }

  .habitat-inhabitado .col--title,
  .habitat-inhabitado .col--metaA,
  .habitat-inhabitado .col--metaB{
    display:none;
  }

  .habitat-inhabitado .col--image{
    order:1;
    width: min(100%, 380px);
    margin: 0 auto;
  }

  .habitat-inhabitado .col--text{
    display:none;
  }

  .habitat-inhabitado .carousel{
    width:100%;
    max-width: none;
    margin: 0;
  }

  .habitat-inhabitado .carousel__track{
    aspect-ratio: auto;
    display:flex;
    flex-direction:column;
    gap: 0;
    overflow: visible;
  }

  .habitat-inhabitado .stack-image{
    min-height: var(--project-stack-min-height);
    margin: 0;
    display:flex;
    align-items:center;
    justify-content:center;
    scroll-snap-align: center;
    scroll-snap-stop: always;
  }

  .habitat-inhabitado .carousel__track img{
    position: static;
    inset: auto;
    display:block;
    width:min(100%, 360px);
    height:auto;
    max-height: var(--project-image-max-height);
    max-width:100%;
    margin: 0 auto;
    opacity:1;
    z-index:auto;
    transform:translateZ(0);
    -webkit-transform:translateZ(0);
    transform-origin:center center;
    -webkit-transform-origin:center center;
    backface-visibility:visible;
    will-change:auto;
    transition:none;
    object-fit:contain;
    object-position: center center;
    align-self:center;
  }

  .habitat-inhabitado.info-open .page{
    overflow: hidden;
  }

  .habitat-inhabitado.info-open .project-info-toggle__close{
    display:inline;
    text-decoration: underline;
    text-underline-offset: 3px;
  }

  .habitat-inhabitado.info-open .project-info-toggle{
    text-decoration: none;
  }

  .habitat-inhabitado.info-open .project-info-toggle__label{
    display:none;
  }

  .mapoi-project{
    height: var(--project-viewport-height);
    overflow: hidden;
  }

  .mapoi-project .brand{
    z-index: 24;
  }

  .mapoi-project .project-info-toggle{
    display:block;
    position:fixed;
    right: var(--pad);
    bottom: var(--pad);
    z-index: 25;
    padding:12px 14px;
    border:0;
    background:transparent;
    color:var(--ink);
    font:inherit;
    cursor:pointer;
    text-decoration: underline;
    text-underline-offset: 3px;
  }

  .mapoi-project .project-info-toggle__close{
    display:none;
  }

  .mapoi-project .project-info-panel{
    position:fixed;
    inset:0;
    z-index: 18;
    padding: 104px 18px 32px 32px;
    background: rgba(255,255,255,.78);
    backdrop-filter: blur(8px);
    overflow-y:auto;
  }

  .mapoi-project .project-info-panel__inner{
    width:min(100%, 360px);
    margin-right:auto;
  }

  .mapoi-project .project-info-panel__text{
    margin:0 0 1.2rem;
    line-height:1.5;
  }

  .mapoi-project .page{
    padding: 82px 8px 172px;
    height: var(--project-viewport-height);
    overflow-y: auto;
    -webkit-overflow-scrolling: touch;
    scroll-behavior: smooth;
    scroll-snap-type: y mandatory;
    scroll-padding-top: var(--project-scroll-padding-top);
    scroll-padding-bottom: var(--project-scroll-padding-bottom);
  }

  .mapoi-project .grid{
    display:flex;
    flex-direction:column;
    width:min(100%, 430px);
    max-width:none;
    margin:0 auto;
    gap: 28px;
    align-items: stretch;
  }

  .mapoi-project .col--title,
  .mapoi-project .col--metaA,
  .mapoi-project .col--metaB{
    display:none;
  }

  .mapoi-project .col--image{
    order:1;
    width: min(100%, 380px);
    margin: 0 auto;
  }

  .mapoi-project .col--text{
    display:none;
  }

  .mapoi-project .carousel{
    width:100%;
    max-width: none;
    margin: 0;
  }

  .mapoi-project .carousel__track{
    aspect-ratio: auto;
    display:flex;
    flex-direction:column;
    gap: 0;
    overflow: visible;
  }

  .mapoi-project .stack-image{
    min-height: var(--project-stack-min-height);
    margin: 0;
    display:flex;
    align-items:center;
    justify-content:center;
    scroll-snap-align: center;
    scroll-snap-stop: always;
  }

  .mapoi-project .carousel__track img{
    position: static;
    inset: auto;
    display:block;
    width:min(100%, 360px);
    height:auto;
    max-height: var(--project-image-max-height);
    max-width:100%;
    margin: 0 auto;
    opacity:1;
    z-index:auto;
    transform:translateZ(0);
    -webkit-transform:translateZ(0);
    transform-origin:center center;
    -webkit-transform-origin:center center;
    backface-visibility:visible;
    will-change:auto;
    transition:none;
    object-fit:contain;
    object-position: center center;
    align-self:center;
  }

  .mapoi-project.info-open .page{
    overflow: hidden;
  }

  .mapoi-project.info-open .project-info-toggle__close{
    display:inline;
    text-decoration: underline;
    text-underline-offset: 3px;
  }

  .mapoi-project.info-open .project-info-toggle{
    text-decoration: none;
  }

  .mapoi-project.info-open .project-info-toggle__label{
    display:none;
  }

  .collectable-space-project{
    height: var(--project-viewport-height);
    overflow: hidden;
  }

  .collectable-space-project .brand{
    z-index: 24;
  }

  .collectable-space-project .project-info-toggle{
    display:block;
    position:fixed;
    right: var(--pad);
    bottom: var(--pad);
    z-index: 25;
    padding:12px 14px;
    border:0;
    background:transparent;
    color:var(--ink);
    font:inherit;
    cursor:pointer;
    text-decoration: underline;
    text-underline-offset: 3px;
  }

  .collectable-space-project .project-info-toggle__close{
    display:none;
  }

  .collectable-space-project .project-info-panel{
    position:fixed;
    inset:0;
    z-index: 18;
    padding: 104px 18px 32px 32px;
    background: rgba(255,255,255,.78);
    backdrop-filter: blur(8px);
    overflow-y:auto;
  }

  .collectable-space-project .project-info-panel__inner{
    width:min(100%, 360px);
    margin-right:auto;
  }

  .collectable-space-project .project-info-panel__text{
    margin:0 0 1.2rem;
    line-height:1.5;
  }

  .collectable-space-project .page{
    padding: 82px 8px 172px;
    height: var(--project-viewport-height);
    overflow-y: auto;
    -webkit-overflow-scrolling: touch;
    scroll-behavior: smooth;
    scroll-snap-type: y mandatory;
    scroll-padding-top: var(--project-scroll-padding-top);
    scroll-padding-bottom: var(--project-scroll-padding-bottom);
  }

  .collectable-space-project .grid{
    display:flex;
    flex-direction:column;
    width:min(100%, 430px);
    max-width:none;
    margin:0 auto;
    gap: 28px;
    align-items: stretch;
  }

  .collectable-space-project .col--title,
  .collectable-space-project .col--metaA,
  .collectable-space-project .col--metaB{
    display:none;
  }

  .collectable-space-project .col--image{
    order:1;
    width: min(100%, 340px);
    margin: 0 auto;
    justify-content: initial;
  }

  .collectable-space-project .col--text{
    display:none;
  }

  .collectable-space-project .carousel{
    width:100%;
    max-width: none;
    margin: 0;
  }

  .collectable-space-project .carousel__track{
    aspect-ratio: auto;
    display:flex;
    flex-direction:column;
    gap: 0;
    overflow: visible;
  }

  .collectable-space-project .stack-image{
    min-height: var(--project-stack-min-height);
    margin: 0;
    display:flex;
    align-items:center;
    justify-content:center;
    scroll-snap-align: center;
    scroll-snap-stop: always;
  }

  .collectable-space-project .carousel__track img{
    position: static;
    inset: auto;
    display:block;
    width:min(100%, 300px);
    height:auto;
    max-height: var(--project-image-max-height);
    max-width:100%;
    margin: 0 auto;
    opacity:1;
    z-index:auto;
    transform:translateZ(0);
    -webkit-transform:translateZ(0);
    transform-origin:center center;
    -webkit-transform-origin:center center;
    backface-visibility:visible;
    will-change:auto;
    transition:none;
    object-fit:contain;
    object-position: center center;
    align-self:center;
  }

  .collectable-space-project.info-open .page{
    overflow: hidden;
  }

  .collectable-space-project.info-open .project-info-toggle__close{
    display:inline;
    text-decoration: underline;
    text-underline-offset: 3px;
  }

  .collectable-space-project.info-open .project-info-toggle{
    text-decoration: none;
  }

  .collectable-space-project.info-open .project-info-toggle__label{
    display:none;
  }

  .novia-robot-project{
    height: var(--project-viewport-height);
    overflow: hidden;
  }

  .novia-robot-project .brand{
    z-index: 24;
  }

  .novia-robot-project .project-info-toggle{
    display:block;
    position:fixed;
    right: var(--pad);
    bottom: var(--pad);
    z-index: 25;
    padding:12px 14px;
    border:0;
    background:transparent;
    color:var(--ink);
    font:inherit;
    cursor:pointer;
    text-decoration: underline;
    text-underline-offset: 3px;
  }

  .novia-robot-project .project-info-toggle__close{
    display:none;
  }

  .novia-robot-project .project-info-panel{
    position:fixed;
    inset:0;
    z-index: 18;
    padding: 104px 18px 32px 32px;
    background: rgba(255,255,255,.78);
    backdrop-filter: blur(8px);
    overflow-y:auto;
  }

  .novia-robot-project .project-info-panel__inner{
    width:min(100%, 360px);
    margin-right:auto;
  }

  .novia-robot-project .project-info-panel__text{
    margin:0 0 1.2rem;
    line-height:1.5;
  }

  .novia-robot-project .page{
    padding: 82px 8px 172px;
    height: var(--project-viewport-height);
    overflow-y: auto;
    -webkit-overflow-scrolling: touch;
    scroll-behavior: smooth;
    scroll-snap-type: y mandatory;
    scroll-padding-top: var(--project-scroll-padding-top);
    scroll-padding-bottom: var(--project-scroll-padding-bottom);
  }

  .novia-robot-project .grid{
    display:flex;
    flex-direction:column;
    width:min(100%, 430px);
    max-width:none;
    margin:0 auto;
    gap: 28px;
    align-items: stretch;
  }

  .novia-robot-project .col--title,
  .novia-robot-project .col--metaA,
  .novia-robot-project .col--metaB{
    display:none;
  }

  .novia-robot-project .col--image{
    order:1;
    width: min(100%, 380px);
    margin: 0 auto;
  }

  .novia-robot-project .col--text{
    display:none;
  }

  .novia-robot-project .carousel{
    width:100%;
    max-width: none;
    margin: 0;
  }

  .novia-robot-project .carousel__track{
    aspect-ratio: auto;
    display:flex;
    flex-direction:column;
    gap: 0;
    overflow: visible;
  }

  .novia-robot-project .stack-image{
    min-height: var(--project-stack-min-height);
    margin: 0;
    display:flex;
    align-items:center;
    justify-content:center;
    scroll-snap-align: center;
    scroll-snap-stop: always;
  }

  .novia-robot-project .carousel__track img{
    position: static;
    inset: auto;
    display:block;
    width:min(100%, 360px);
    height:auto;
    max-height: var(--project-image-max-height);
    max-width:100%;
    margin: 0 auto;
    opacity:1;
    z-index:auto;
    transform:translateZ(0);
    -webkit-transform:translateZ(0);
    transform-origin:center center;
    -webkit-transform-origin:center center;
    backface-visibility:visible;
    will-change:auto;
    transition:none;
    object-fit:contain;
    object-position: center center;
    align-self:center;
  }

  .novia-robot-project.info-open .page{
    overflow: hidden;
  }

  .novia-robot-project.info-open .project-info-toggle__close{
    display:inline;
    text-decoration: underline;
    text-underline-offset: 3px;
  }

  .novia-robot-project.info-open .project-info-toggle{
    text-decoration: none;
  }

  .novia-robot-project.info-open .project-info-toggle__label{
    display:none;
  }

  .pudra-project,
  .patria-project{
    --project-viewport-height: var(--visual-viewport-height, 100svh);
    --project-stack-min-height: calc(var(--project-viewport-height) * 0.78);
    --project-image-max-height: calc(var(--project-viewport-height) * 0.62);
    --project-scroll-padding-top: calc(var(--project-viewport-height) * 0.14);
    --project-scroll-padding-bottom: calc(var(--project-viewport-height) * 0.18);
    height: var(--project-viewport-height);
    overflow: hidden;
  }

  .pudra-project .brand,
  .patria-project .brand{
    z-index: 24;
  }

  .pudra-project .menu,
  .patria-project .menu{
    left:0;
    right:0;
    bottom:0;
    width:auto;
    max-width:none;
    padding:16px 0 var(--pad);
    background:transparent;
    overflow:visible;
    isolation:isolate;
    pointer-events:none;
  }

  .pudra-project .menu::after,
  .patria-project .menu::after{
    content:"";
    position:absolute;
    left:0;
    right:0;
    top:-88px;
    bottom:0;
    background:rgba(255,255,255,.12);
    backdrop-filter:saturate(150%) blur(16px);
    -webkit-backdrop-filter:saturate(150%) blur(16px);
    -webkit-mask-image:linear-gradient(to bottom, transparent 0, rgba(0,0,0,.5) 36px, #000 88px, #000 100%);
    mask-image:linear-gradient(to bottom, transparent 0, rgba(0,0,0,.5) 36px, #000 88px, #000 100%);
    pointer-events:none;
    z-index:0;
  }

  .pudra-project .menu__nav,
  .patria-project .menu__nav{
    position:relative;
    z-index:1;
    width:fit-content;
    margin-left:var(--pad);
    pointer-events:auto;
  }

  .pudra-project .project-info-toggle,
  .patria-project .project-info-toggle{
    display:block;
    position:fixed;
    right: var(--pad);
    bottom: var(--pad);
    z-index: 25;
    padding:12px 14px;
    border:0;
    background:transparent;
    color:var(--ink);
    font:inherit;
    cursor:pointer;
    text-decoration: underline;
    text-underline-offset: 3px;
  }

  .pudra-project .project-info-toggle__close,
  .patria-project .project-info-toggle__close{
    display:none;
  }

  .pudra-project .project-info-panel,
  .patria-project .project-info-panel{
    position:fixed;
    inset:0;
    z-index: 18;
    padding: 104px 18px 32px 32px;
    background: rgba(255,255,255,.78);
    backdrop-filter: blur(8px);
    overflow-y:auto;
  }

  .pudra-project .project-info-panel__inner,
  .patria-project .project-info-panel__inner{
    width:min(100%, 360px);
    margin-right:auto;
  }

  .pudra-project .project-info-panel__text,
  .patria-project .project-info-panel__text{
    margin:0 0 1.2rem;
    line-height:1.5;
  }

  .pudra-project .page,
  .patria-project .page{
    padding: 82px 8px 172px;
    height: var(--project-viewport-height);
    overflow-y: auto;
    -webkit-overflow-scrolling: touch;
    scroll-behavior: smooth;
    scroll-snap-type: y mandatory;
    scroll-padding-top: var(--project-scroll-padding-top);
    scroll-padding-bottom: var(--project-scroll-padding-bottom);
  }

  .pudra-project .grid,
  .patria-project .grid{
    display:flex;
    flex-direction:column;
    width:min(100%, 430px);
    max-width:none;
    margin:0 auto;
    gap: 28px;
    align-items: stretch;
  }

  .pudra-project .col--title,
  .pudra-project .col--metaA,
  .pudra-project .col--metaB,
  .patria-project .col--title,
  .patria-project .col--metaA,
  .patria-project .col--metaB{
    display:none;
  }

  .pudra-project .col--image,
  .patria-project .col--image{
    order:1;
    width: min(100%, 380px);
    margin: 0 auto;
  }

  .pudra-project .col--text,
  .patria-project .col--text{
    display:none;
  }

  .pudra-project .carousel,
  .patria-project .carousel{
    width:100%;
    max-width: none;
    margin: 0;
  }

  .pudra-project .carousel__track,
  .patria-project .carousel__track{
    aspect-ratio: auto;
    display:flex;
    flex-direction:column;
    gap: 0;
    overflow: visible;
  }

  .pudra-project .stack-image,
  .patria-project .stack-image{
    min-height: var(--project-stack-min-height);
    margin: 0;
    display:flex;
    align-items:center;
    justify-content:center;
    scroll-snap-align: center;
    scroll-snap-stop: always;
  }

  .pudra-project .carousel__track img,
  .patria-project .carousel__track img{
    position: static;
    inset: auto;
    display:block;
    width:min(100%, 360px);
    height:auto;
    max-height: var(--project-image-max-height);
    max-width:100%;
    margin: 0 auto;
    opacity:1;
    z-index:auto;
    transform:translateZ(0);
    -webkit-transform:translateZ(0);
    transform-origin:center center;
    -webkit-transform-origin:center center;
    backface-visibility:visible;
    will-change:auto;
    transition:none;
    object-fit:contain;
    object-position: center center;
    align-self:center;
  }

  .pudra-project.info-open .page,
  .patria-project.info-open .page{
    overflow: hidden;
  }

  .pudra-project.info-open .project-info-toggle__close,
  .patria-project.info-open .project-info-toggle__close{
    display:inline;
    text-decoration: underline;
    text-underline-offset: 3px;
  }

  .pudra-project.info-open .project-info-toggle,
  .patria-project.info-open .project-info-toggle{
    text-decoration: none;
  }

  .pudra-project.info-open .project-info-toggle__label,
  .patria-project.info-open .project-info-toggle__label{
    display:none;
  }

  .pudra-project,
  .patria-project{
    --project-stack-min-height: var(--project-viewport-height);
    --project-image-max-height: 70svh;
    --project-scroll-padding-top: 0px;
    --project-scroll-padding-bottom: 0px;
  }

  .pudra-project .page,
  .patria-project .page{
    padding: 0;
  }

  .pudra-project .grid,
  .patria-project .grid{
    width:100%;
    gap:0;
  }

  .pudra-project .col--image,
  .patria-project .col--image{
    width:100%;
    display:flex;
    justify-content:center;
  }

  .pudra-project .carousel__track img,
  .patria-project .carousel__track img{
    width:min(92vw, 720px);
    max-height:var(--project-image-max-height);
  }

  .contact-page .page{
    padding: 82px 18px 172px;
    scroll-snap-type:none;
    scroll-padding:0;
    scroll-behavior:auto;
  }

  .contact-page .menu{
    left:0;
    right:0;
    bottom:0;
    width:auto;
    max-width:none;
    padding:16px 0 var(--pad);
    background:transparent;
    overflow:visible;
    isolation:isolate;
  }

  .contact-page .menu::after{
    content:"";
    position:absolute;
    left:0;
    right:0;
    top:-88px;
    bottom:0;
    background:rgba(255,255,255,.12);
    backdrop-filter:saturate(150%) blur(16px);
    -webkit-backdrop-filter:saturate(150%) blur(16px);
    -webkit-mask-image:linear-gradient(to bottom, transparent 0, rgba(0,0,0,.5) 36px, #000 88px, #000 100%);
    mask-image:linear-gradient(to bottom, transparent 0, rgba(0,0,0,.5) 36px, #000 88px, #000 100%);
    pointer-events:none;
    z-index:0;
  }

  .contact-page .menu__nav{
    position:relative;
    z-index:1;
    width:fit-content;
    margin-left:var(--pad);
    padding:12px 14px;
    background:transparent;
    border:0;
    border-radius:0;
    box-shadow:none;
    backdrop-filter:none;
  }

  .contact-page .grid{
    display:flex;
    flex-direction:column;
    width:min(100%, 420px);
    max-width:none;
    margin:0 auto;
    gap: 24px;
    align-items: stretch;
  }

  .contact-page .col--title,
  .contact-page .col--contact,
  .contact-page .col--text,
  .contact-page .col--info-image{
    width:100%;
    grid-column:auto;
    grid-row:auto;
  }

  .contact-page .col--title{
    order:1;
  }

  .contact-page .col--contact{
    order:3;
    display:block;
  }

  .contact-page .col--info-image{
    order:5;
  }

  .contact-page .col--text{
    order:4;
  }

  .contact-page .col__title{
    margin-bottom: .5rem;
  }

  .contact-page .col--contact .col__p{
    margin-bottom:0;
  }

  .contact-page .col--info-image{
    display:flex;
    justify-content:flex-start;
    width:min(100%, 136px);
  }

  .contact-page .menu__emblem-contact{
    display:none;
  }

  .contact-page .col--info-image img{
    width:100%;
    aspect-ratio:3 / 4;
    object-fit:cover;
    object-position:center 20%;
  }

  .not-found-page .page{
    padding:82px 18px 172px;
  }

  .not-found-page .menu{
    left:0;
    right:0;
    bottom:0;
    width:auto;
    max-width:none;
    padding:16px 0 var(--pad);
  }

  .not-found-page .menu__nav{
    width:fit-content;
    margin-left:var(--pad);
    padding:12px 14px;
  }

  .not-found{
    display:flex;
    flex-direction:column;
    justify-content:center;
    width:min(100%, 420px);
    min-height:calc(100svh - 254px);
    max-width:none;
    margin:0 auto;
    gap:1.2rem;
  }

  .not-found__code,
  .not-found__content{
    grid-column:auto;
    grid-row:auto;
  }

}

@media (max-width: 900px){

  .project-process-page .page{
    padding: 0 var(--pad);
  }

  .creative-process{
    width:100%;
  }
}

@media (max-width: 768px){

  .jw-a-show-project{
    --project-viewport-height: var(--visual-viewport-height, 100svh);
    --project-stack-min-height: calc(var(--project-viewport-height) * 0.78);
    --project-image-max-height: calc(var(--project-viewport-height) * 0.62);
    --project-scroll-padding-top: calc(var(--project-viewport-height) * 0.14);
    --project-scroll-padding-bottom: calc(var(--project-viewport-height) * 0.18);
    height: var(--project-viewport-height);
    overflow:hidden;
  }

  .jw-a-show-project .brand{
    z-index:24;
  }

  .jw-a-show-project .menu{
    left:0;
    right:0;
    bottom:0;
    width:auto;
    max-width:none;
    padding:16px 0 var(--pad);
    background:transparent;
    overflow:visible;
    isolation:isolate;
    pointer-events:none;
  }

  .jw-a-show-project .menu::after{
    content:"";
    position:absolute;
    left:0;
    right:0;
    top:-88px;
    bottom:0;
    background:rgba(255,255,255,.12);
    backdrop-filter:saturate(150%) blur(16px);
    -webkit-backdrop-filter:saturate(150%) blur(16px);
    -webkit-mask-image:linear-gradient(to bottom, transparent 0, rgba(0,0,0,.5) 36px, #000 88px, #000 100%);
    mask-image:linear-gradient(to bottom, transparent 0, rgba(0,0,0,.5) 36px, #000 88px, #000 100%);
    pointer-events:none;
    z-index:0;
  }

  .jw-a-show-project .menu__nav{
    position:relative;
    z-index:1;
    width:fit-content;
    margin-left:var(--pad);
    pointer-events:auto;
  }

  .jw-a-show-project .project-info-toggle{
    display:block;
    position:fixed;
    right: var(--pad);
    bottom: var(--pad);
    z-index:25;
    padding:12px 14px;
    border:0;
    background:transparent;
    color:var(--ink);
    font:inherit;
    cursor:pointer;
    text-decoration: underline;
    text-underline-offset: 3px;
  }

  .jw-a-show-project .project-info-toggle__close{
    display:none;
  }

  .jw-a-show-project .project-info-panel{
    position:fixed;
    inset:0;
    z-index:18;
    padding:104px 18px 32px 32px;
    background:rgba(255,255,255,.78);
    backdrop-filter:blur(8px);
    overflow-y:auto;
  }

  .jw-a-show-project .project-info-panel__inner{
    width:min(100%, 360px);
    margin-right:auto;
  }

  .jw-a-show-project .project-info-panel__text{
    margin:0 0 1.2rem;
    line-height:1.5;
  }

  .jw-a-show-project .page{
    padding:82px 8px 172px;
    height: var(--project-viewport-height);
    overflow-y:auto;
    -webkit-overflow-scrolling:touch;
    scroll-behavior:smooth;
    scroll-snap-type:y mandatory;
    scroll-padding-top: var(--project-scroll-padding-top);
    scroll-padding-bottom: var(--project-scroll-padding-bottom);
  }

  .jw-a-show-project .grid{
    display:flex;
    flex-direction:column;
    width:min(100%, 430px);
    max-width:none;
    margin:0 auto;
    gap:28px;
    align-items:stretch;
  }

  .jw-a-show-project .col--title,
  .jw-a-show-project .col--metaA,
  .jw-a-show-project .col--metaB{
    display:none;
  }

  .jw-a-show-project .col--image{
    order:1;
    width:min(100%, 380px);
    margin:0 auto;
  }

  .jw-a-show-project .col--text{
    display:none;
  }

  .jw-a-show-project .project-research-summary{
    display:none !important;
  }

  .jw-a-show-project .carousel{
    width:100%;
    max-width:none;
    margin:0;
  }

  .jw-a-show-project .carousel__track{
    aspect-ratio:auto;
    display:flex;
    flex-direction:column;
    gap:0;
    overflow:visible;
  }

  .jw-a-show-project .stack-image{
    min-height: var(--project-stack-min-height);
    margin:0;
    display:flex;
    align-items:center;
    justify-content:center;
    scroll-snap-align:center;
    scroll-snap-stop:always;
  }

  .jw-a-show-project .carousel__track img{
    position:static;
    inset:auto;
    display:block;
    width:min(100%, 360px);
    height:auto;
    max-height: var(--project-image-max-height);
    max-width:100%;
    margin:0 auto;
    opacity:1;
    z-index:auto;
    transform:translateZ(0);
    -webkit-transform:translateZ(0);
    transform-origin:center center;
    -webkit-transform-origin:center center;
    backface-visibility:visible;
    will-change:auto;
    transition:none;
    object-fit:contain;
    object-position:center center;
    align-self:center;
  }

  .jw-a-show-project .project-research-sheet{
    position:fixed;
    inset:0;
    z-index:26;
    padding:50px 18px 32px 32px;
    border-left:0;
    background:rgba(255,255,255,.9);
    box-shadow:none;
    transform:translateX(100%);
  }

  .jw-a-show-project .project-research-content{
    scroll-snap-type:y proximity;
  }

  .jw-a-show-project .project-research-chapter{
    position:relative;
    scroll-snap-stop:normal;
  }

  .jw-a-show-project .project-research-mobile-figure{
    --drag-x:0px;
    --drag-y:0px;
    display:block;
    width:167px;
    margin:0;
    touch-action:none;
    user-select:none;
    cursor:grab;
    position:absolute;
    top:36%;
    left:50%;
    transform:translate(calc(-50% + var(--drag-x)), var(--drag-y));
    z-index:2;
  }

  .jw-a-show-project .project-research-mobile-figure.is-dragging{
    cursor:grabbing;
    z-index:5;
  }

  .jw-a-show-project .project-research-mobile-figure__image{
    display:block;
    width:100%;
    height:117px;
    object-fit:cover;
    object-position:center center;
  }

  .jw-a-show-project .project-research-mobile-figure__image--lower-focus{
    object-position:center 72%;
  }

  .jw-a-show-project .project-research-mobile-figure__image--contain{
    height:auto;
    aspect-ratio:4 / 3;
    object-fit:contain;
  }

  .jw-a-show-project .project-research-mobile-figure__image--square{
    height:auto;
    aspect-ratio:1 / 1;
  }

  .jw-a-show-project .project-research-mobile-figure__image--portrait{
    width:109px;
    height:auto;
  }

  .jw-a-show-project .project-research-chapter__columns{
    grid-template-columns:1fr;
    row-gap:1.2rem;
  }

  .jw-a-show-project.research-open .project-research-sheet{
    transform:translateX(0);
  }

  .jw-a-show-project.info-open .page{
    overflow:hidden;
  }

  .jw-a-show-project.research-open .page{
    overflow:hidden;
  }

  .jw-a-show-project.info-open .project-info-toggle__close{
    display:inline;
    text-decoration: underline;
    text-underline-offset: 3px;
  }

  .jw-a-show-project.info-open .project-info-toggle{
    text-decoration:none;
  }

  .jw-a-show-project.info-open .project-info-toggle__label{
    display:none;
  }
}

.imagen-s2-project{
  --project-viewport-height: var(--visual-viewport-height, 100svh);
  --project-stack-min-height: var(--project-viewport-height);
  --project-image-max-height: 70svh;
  --project-scroll-padding-top: 0px;
  --project-scroll-padding-bottom: 0px;
  height: var(--project-viewport-height);
  overflow: hidden;
}

.imagen-s2-project .brand,
.imagen-s2-project .menu{
  z-index:60;
}

.project-image-counter{
  position:fixed;
  top:50%;
  right:var(--pad);
  z-index:60;
  color:var(--ink);
  font-family:"Newsreader", serif;
  font-size:.82rem;
  font-optical-sizing:auto;
  font-style:italic;
  font-weight:360;
  line-height:1;
  letter-spacing:.01em;
  opacity:.62;
  pointer-events:none;
  writing-mode:vertical-rl;
  text-orientation:mixed;
  transform:translateY(-50%);
  transition:
    opacity 360ms cubic-bezier(0.215, 0.61, 0.355, 1),
    visibility 0ms linear 0ms;
}

.imagen-s2-project.info-open .project-image-counter,
.imagen-s2-project.research-open .project-image-counter{
  opacity:0;
  visibility:hidden;
  transition:
    opacity 240ms cubic-bezier(0.215, 0.61, 0.355, 1),
    visibility 0ms linear 240ms;
}

@media (hover:hover) and (pointer:fine){
  .imagen-s2-project .carousel__track > .stack-image--video:first-child{
    cursor:none;
  }

  .imagen-s2-project .carousel__track > .stack-image--video:first-child > video{
    cursor:none;
  }

  .project-video-cursor{
    position:fixed;
    top:0;
    left:0;
    display:flex;
    align-items:baseline;
    gap:.32em;
    z-index:70;
    color:#fff;
    font-family:"Newsreader", serif;
    font-size:1rem;
    font-optical-sizing:auto;
    font-style:normal;
    font-weight:400;
    line-height:1;
    white-space:nowrap;
    opacity:0;
    pointer-events:none;
    mix-blend-mode:difference;
    transform:translate(14px, -50%);
    transition:opacity 120ms ease;
  }

  .project-video-cursor.is-visible{
    opacity:1;
  }

  .project-video-cursor__arrow{
    display:inline;
    line-height:inherit;
    transform:none;
  }
}

.imagen-s2-project .menu__item,
.imagen-s2-project .menu__subitem,
.imagen-s2-project .project-info-toggle,
.imagen-s2-project .project-info-panel__meta-item,
.imagen-s2-project .project-info-panel__text,
.imagen-s2-project .project-info-panel__action{
  font-family:"Newsreader", serif;
  font-optical-sizing:auto;
  font-weight:360;
  font-style:normal;
  line-height:1.25;
}

.imagen-s2-project .project-info-toggle{
  display:block;
  position:fixed;
  right: var(--pad);
  bottom: var(--pad);
  z-index:60;
  padding:0;
  border:0;
  background:transparent;
  color:var(--ink);
  font-size:1rem;
  cursor:pointer;
  text-decoration:underline;
  text-underline-offset:3px;
}

.imagen-s2-project .project-info-toggle__close{
  display:none;
}

.imagen-s2-project .project-info-panel{
  position:fixed;
  inset:0;
  z-index:18;
  padding:calc(var(--pad) * 2) var(--pad) var(--pad);
  background:rgba(255,255,255,.78);
  backdrop-filter:blur(8px);
  overflow-y:auto;
  opacity:0;
  visibility:hidden;
  pointer-events:none;
  transform:translateY(4px);
  transition:
    opacity 360ms cubic-bezier(0.215, 0.61, 0.355, 1),
    transform 360ms cubic-bezier(0.215, 0.61, 0.355, 1),
    visibility 0ms linear 360ms;
}

.imagen-s2-project.info-open .project-info-panel{
  opacity:1;
  visibility:visible;
  pointer-events:auto;
  transform:translateY(0);
  transition:
    opacity 360ms cubic-bezier(0.215, 0.61, 0.355, 1),
    transform 360ms cubic-bezier(0.215, 0.61, 0.355, 1),
    visibility 0ms linear 0ms;
}

.imagen-s2-project .project-info-panel__inner{
  width:min(100%, 420px);
  margin-right:auto;
}

.imagen-s2-project .project-info-panel__meta-item{
  font-size:1rem;
}

.imagen-s2-project .project-info-panel__meta-item em{
  font-style:italic;
}

.imagen-s2-project .project-info-panel__text{
  font-size:1rem;
  font-weight:340;
  margin:0 0 1.2rem;
  line-height:1.38;
}

.imagen-s2-project .page{
  height:var(--project-viewport-height);
  padding:0;
  overflow-y:auto;
  -webkit-overflow-scrolling:touch;
  scroll-behavior:smooth;
  scroll-snap-type:y mandatory;
  scroll-padding-top:var(--project-scroll-padding-top);
  scroll-padding-bottom:var(--project-scroll-padding-bottom);
}

.imagen-s2-project .grid{
  display:flex;
  flex-direction:column;
  width:100%;
  max-width:none;
  margin:0 auto;
  padding:0;
  gap:0;
  align-items:stretch;
}

.imagen-s2-project .grid__marker,
.imagen-s2-project .col--title,
.imagen-s2-project .col--text,
.imagen-s2-project .col--metaA,
.imagen-s2-project .col--metaB,
.imagen-s2-project .project-research-summary,
.imagen-s2-project .project-research-visual{
  display:none !important;
}

.imagen-s2-project .col--image{
  order:1;
  width:100%;
  margin:0 auto;
  display:flex;
  justify-content:center;
}

.imagen-s2-project .carousel{
  width:100%;
  max-width:none;
  margin:0;
}

.imagen-s2-project .carousel__track{
  aspect-ratio:auto;
  display:flex;
  flex-direction:column;
  gap:0;
  overflow:visible;
}

.imagen-s2-project .stack-image{
  min-height:var(--project-stack-min-height);
  margin:0;
  display:flex;
  align-items:center;
  justify-content:center;
  scroll-snap-align:center;
  scroll-snap-stop:always;
  cursor:default;
}

.imagen-s2-project .stack-image > img,
.imagen-s2-project .stack-image > video{
  cursor:pointer;
}

.imagen-s2-project .stack-image.is-last-project-slide > img,
.imagen-s2-project .stack-image.is-last-project-slide > video{
  cursor:default;
}

.imagen-s2-project .carousel__track img{
  position:static;
  inset:auto;
  display:block;
  width:min(92vw, 960px);
  height:auto;
  max-height:var(--project-image-max-height);
  max-width:100%;
  margin:0 auto;
  opacity:1;
  z-index:auto;
  transform:translateZ(0);
  -webkit-transform:translateZ(0);
  transform-origin:center center;
  -webkit-transform-origin:center center;
  backface-visibility:visible;
  will-change:auto;
  transition:none;
  object-fit:contain;
  object-position:center center;
  align-self:center;
}

.imagen-s2-project.info-open .page,
.imagen-s2-project.research-open .page{
  overflow:hidden;
}

.imagen-s2-project.info-open .project-info-toggle__close{
  display:inline;
  text-decoration:underline;
  text-underline-offset:3px;
}

.imagen-s2-project.info-open .project-info-toggle{
  text-decoration:none;
}

.imagen-s2-project.info-open .project-info-toggle__label{
  display:none;
}

.patria-project .project-info-toggle{
  color:#fff;
  mix-blend-mode:difference;
}

.patria-project.patria-over-video .menu,
.patria-project.patria-over-video .project-info-toggle{
  mix-blend-mode:difference;
}

.out-of-the-box-project .brand{
  color:#fff;
  mix-blend-mode:difference;
}

.out-of-the-box-project .brand__name,
.out-of-the-box-project .menu__item,
.out-of-the-box-project .menu__subitem{
  color:#fff;
}

.out-of-the-box-project .menu,
.out-of-the-box-project .project-info-toggle{
  color:#fff;
  mix-blend-mode:difference;
}

.out-of-the-box-project.out-of-the-box-over-video .menu,
.out-of-the-box-project.out-of-the-box-over-video .project-info-toggle{
  mix-blend-mode:difference;
}

@media (hover:hover) and (pointer:fine){
  .project-info-toggle:hover,
  .project-info-toggle:focus-visible{
    font-style:italic;
  }
}

@media (max-width: 768px){
  .project-image-counter{
    color:#fff;
    mix-blend-mode:difference;
  }

  .imagen-s2-project .menu{
    color:#fff;
    mix-blend-mode:difference;
    isolation:auto;
  }

  .imagen-s2-project .menu::after{
    content:none;
    display:none;
  }

  .imagen-s2-project .menu__item,
  .imagen-s2-project .menu__subitem{
    color:#fff;
  }

  .patria-project .menu{
    color:#fff;
    mix-blend-mode:difference;
  }

  .patria-project .menu::after{
    content:none;
    display:none;
  }

  .patria-project .menu__item,
  .patria-project .menu__subitem{
    color:#fff;
  }

  .patria-project.imagen-s2-project{
    --project-stack-min-height:var(--project-viewport-height);
    --project-scroll-padding-top:0px;
    --project-scroll-padding-bottom:0px;
  }

  .patria-project.imagen-s2-project .page{
    scroll-padding:0;
    overscroll-behavior-y:contain;
  }

  .patria-project.imagen-s2-project .stack-image{
    width:100%;
    height:var(--project-viewport-height);
    min-height:var(--project-viewport-height);
    flex:0 0 var(--project-viewport-height);
    overflow:hidden;
    scroll-snap-align:start;
  }

  .patria-project.imagen-s2-project .project-video{
    height:100%;
  }
}

@media (min-width: 769px){
  .jw-a-show-project.imagen-s2-project.research-open .page{
    padding:var(--pad);
    overflow:hidden;
    scroll-snap-type:none;
  }

  .jw-a-show-project.imagen-s2-project.research-open .grid{
    display:grid;
    grid-template-columns:repeat(12, 1fr);
    grid-template-rows:auto 1fr;
    column-gap:var(--gutter);
    row-gap:44px;
    width:100%;
    max-width:1600px;
    margin:0 auto;
    padding-top:100px;
    align-items:start;
  }

  .jw-a-show-project.imagen-s2-project.research-open .project-research-summary{
    display:block !important;
    grid-row:2;
    grid-column:1 / span 2;
    align-self:start;
    padding-right:1.4rem;
  }

  .jw-a-show-project.imagen-s2-project.research-open .project-research-summary__item:not(:first-child),
  .jw-a-show-project.imagen-s2-project.research-open .project-research-summary__index{
    display:none;
  }

  .jw-a-show-project.imagen-s2-project.research-open .col--title,
  .jw-a-show-project.imagen-s2-project.research-open .col--text,
  .jw-a-show-project.imagen-s2-project.research-open .col--metaA,
  .jw-a-show-project.imagen-s2-project.research-open .col--metaB{
    display:none !important;
  }

  .jw-a-show-project.imagen-s2-project.research-open .col--image{
    display:block;
    grid-row:2;
    grid-column:3 / span 3;
    order:initial;
    width:100%;
    margin:0;
    justify-self:stretch;
  }

  .jw-a-show-project.imagen-s2-project.research-open .carousel{
    width:100%;
    max-width:none;
    margin:0;
  }

  .jw-a-show-project.imagen-s2-project.research-open .carousel__track{
    position:relative;
    aspect-ratio:4 / 5;
    display:block;
    overflow:hidden;
  }

  .jw-a-show-project.imagen-s2-project.research-open .stack-image{
    min-height:0;
    margin:0;
    display:block;
    scroll-snap-align:none;
    scroll-snap-stop:normal;
    cursor:default;
  }

  .jw-a-show-project.imagen-s2-project.research-open .carousel__track img{
    position:absolute;
    inset:0;
    display:block;
    width:100%;
    height:auto;
    max-width:none;
    max-height:none;
    margin:0;
    opacity:0;
    z-index:0;
    transform:none;
    -webkit-transform:none;
    backface-visibility:hidden;
    will-change:opacity;
    transition:opacity 900ms ease-in-out;
    object-fit:contain;
    object-position:center center;
  }

  .jw-a-show-project.imagen-s2-project.research-open .carousel__track img.is-active{
    opacity:1;
    z-index:1;
  }

  .jw-a-show-project.imagen-s2-project .project-research-visual{
    display:grid !important;
  }

  .jw-a-show-project.imagen-s2-project.research-open .project-research-sheet{
    padding:var(--pad) 1.35rem 1.5rem;
    border-left:1px solid rgba(17,17,17,.08);
    background:rgba(255,255,255,.92);
    box-shadow:-18px 0 34px rgba(17,17,17,.06);
    backdrop-filter:blur(10px);
    opacity:1;
    visibility:visible;
    pointer-events:auto;
    transform:translateX(0);
    transition-delay:0ms;
  }
}