/* Ajustes derivados de Retro 1 */
.menu {
  left: auto;
  top: var(--header-height);
  right: 0;
  bottom: auto;
  width: min(440px, 88vw);
  height: calc(100svh - var(--header-height));
  padding: 2rem var(--pad);
  background: #e4e4e0;
  border-left: 1px solid rgba(14, 15, 14, 0.25);
  opacity: 1;
  transform: translateX(100%);
  transition: transform 0.55s cubic-bezier(.75, 0, .15, 1), visibility 0.55s;
}

.menu.open { transform: translateX(0); }
.menu-mark { width: 70%; right: -7%; top: 20%; }
.menu nav { margin: auto 0; }
.menu nav a,
.interior .menu nav a,
.home-only .menu nav a {
  gap: 0.8rem;
  font-size: clamp(2.5rem, 4.1vw, 4.2rem);
  line-height: 1.05;
}
.menu-foot { position: relative; z-index: 1; }
.interior .menu { top: var(--header-height); height: calc(100svh - var(--header-height)); }

.home-only .brand img { width: 60px; height: 60px; }
.home-only .brand { gap: 1rem; }

.retro-masthead { min-height: 54vh; }
.retro-masthead h1 { font-size: clamp(5rem, 11vw, 10rem); }
.retro-statement { display: grid; grid-template-columns: 1.2fr 1fr; gap: 8vw; align-items: start; margin-top: 3.5rem; }
.retro-statement h2 { margin: 0; font: 400 clamp(3rem, 5.7vw, 5.8rem)/.95 "Instrument Serif", serif; letter-spacing: -.035em; }
.retro-statement p { max-width: 620px; margin: 0; font-size: clamp(.88rem, 1.25vw, 1.12rem); line-height: 1.7; }
.services-register { margin-top: 3.5rem; }
.services-register article { display: grid; grid-template-columns: 60px 1fr 1fr; gap: 1.5rem; align-items: baseline; padding: 1.35rem 0; border-top: 1px solid currentColor; }
.services-register article:last-child { border-bottom: 1px solid currentColor; }
.services-register span,.service-process span { font-size: .54rem; letter-spacing: .08em; }
.services-register h2 { margin: 0; font: 400 clamp(2.7rem, 5vw, 5rem)/1 "Instrument Serif", serif; }
.services-register p { max-width: 540px; margin: 0; font-size: .75rem; line-height: 1.6; }
.service-process { display: grid; grid-template-columns: repeat(4,1fr); margin-top: 3.5rem; border-top: 1px solid currentColor; }
.service-process article { min-height: 260px; display: flex; flex-direction: column; padding: 1rem; border-right: 1px solid var(--i-line); }
.service-process article:first-child { padding-left: 0; }
.service-process article:last-child { border-right: 0; }
.service-process h3 { margin: auto 0 .7rem; font: 400 clamp(2rem,3.5vw,3.5rem)/1 "Instrument Serif",serif; }
.service-process p { margin: 0; font-size: .7rem; line-height: 1.5; }
.retro-cta { display: flex; justify-content: space-between; margin-top: 4rem; padding: 1.2rem 0; border-top: 1px solid currentColor; border-bottom: 1px solid currentColor; font-size: .65rem; letter-spacing: .08em; text-transform: uppercase; }
.retro-cta i { font-style: normal; }
.retro-projects-head { padding: 4rem var(--pad) 3rem; border-bottom: 1px solid var(--i-black); }
.retro-projects-title { display: grid; grid-template-columns: 1.5fr .55fr; gap: 5vw; align-items: end; margin-top: 2rem; }
.retro-projects-title h1 { margin: 0; font: 400 clamp(5rem,12vw,11rem)/.72 "Instrument Serif",serif; letter-spacing: -.05em; }
.retro-projects-title p { max-width: 420px; margin: 0 0 .5rem; font-size: .74rem; line-height: 1.6; }
.project-filters { display: flex; flex-wrap: wrap; gap: .45rem; margin-top: 3rem; }
.project-filters button { border: 1px solid var(--i-black); border-radius: 999px; padding: .45rem .8rem; background: transparent; font-size: .55rem; letter-spacing: .06em; text-transform: uppercase; cursor: pointer; }
.project-filters button.active,.project-filters button:hover { background: var(--i-black); color: var(--i-white); }
.projects-grid { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 5rem 1.2rem; padding: 4rem var(--pad) 9rem; }
.project-tile { min-width: 0; }
.project-tile[hidden] { display: none; }
.project-tile figure,.project-tile > .photo-placeholder { height: min(38vw,560px); margin: 0; overflow: hidden; }
.project-tile figure img { height: 100%; object-fit: cover; filter: grayscale(1); transition: transform .6s,filter .4s; }
.project-tile:hover figure img { transform: scale(1.015); filter: grayscale(1) contrast(1.05); }
.project-tile > div:last-child { display: grid; grid-template-columns: 30px 1fr auto; gap: .65rem; align-items: baseline; padding-top: .6rem; border-top: 1px solid var(--i-black); margin-top: .55rem; }
.project-tile h2 { grid-column: 2; margin: 0; font: 400 clamp(1.8rem,3vw,3.2rem)/1 "Instrument Serif",serif; }
.project-tile p { grid-column: 2; margin: 0; font-size: .58rem; }
.project-tile span,.project-tile i { font-size: .54rem; font-style: normal; }
.project-tile i { grid-column: 3; grid-row: 1; }
.project-tile--pending { color: #777873; }
.retro-project-detail { padding: 3.5rem var(--pad) 0; }
.retro-project-name { display: grid; grid-template-columns: 1.2fr 1fr; gap: 5vw; align-items: end; margin: 1.8rem 0 2.5rem; }
.retro-project-name h1 { margin: 0; font: 400 clamp(4.5rem,9vw,8rem)/.8 "Instrument Serif",serif; letter-spacing: -.045em; }
.retro-project-name dl { display: grid; grid-template-columns: 1fr 1fr; gap: 0 1.5rem; margin: 0; }
.retro-project-name dl div { display: flex; justify-content: space-between; gap: 1rem; padding: .65rem 0; border-top: 1px solid var(--i-line); font-size: .58rem; }
.retro-project-name dd { margin: 0; text-align: right; }
.retro-project-hero { height: min(68vw,820px); margin: 0; overflow: hidden; }
.retro-project-hero img { width: 100%; height: 100%; object-fit: cover; filter: grayscale(1); }
.retro-project-copy { display: grid; grid-template-columns: 1.2fr .8fr; gap: 8vw; margin-top: 3rem; }
.retro-project-copy h2 { margin: 0; font: 400 clamp(2.8rem,5.8vw,5.8rem)/.95 "Instrument Serif",serif; letter-spacing: -.035em; }
.retro-project-copy p { margin: 0 0 1.2rem; font-size: .78rem; line-height: 1.7; }
.retro-media-section { padding: 6rem var(--pad); border-bottom: 1px solid var(--i-line); }
.retro-media-section--gray { background: var(--i-soft); }
.retro-render-grid { display: grid; grid-template-columns: 1.25fr .75fr; gap: 1.2rem; margin-top: 2.5rem; }
.retro-render-grid figure,.retro-interior-grid figure { margin: 0; }
.retro-render-grid figure:first-child { grid-row: span 2; }
.retro-render-grid img { height: 100%; min-height: 310px; object-fit: cover; filter: grayscale(1); }
.retro-render-grid figure:first-child img { min-height: 640px; }
.retro-render-grid button,.retro-interior-grid button { width: 100%; height: 100%; border: 0; padding: 0; background: none; text-align: left; cursor: zoom-in; }
.retro-render-grid span,.retro-interior-grid span { display: block; padding-top: .55rem; border-top: 1px solid currentColor; margin-top: .5rem; font-size: .54rem; letter-spacing: .08em; text-transform: uppercase; }
.retro-graphics-grid { display: grid; grid-template-columns: 1.3fr 1fr 1fr; gap: 1.2rem; margin-top: 2.5rem; }
.retro-graphics-grid .photo-placeholder { min-height: 430px; }
.retro-interior-grid { display: grid; grid-template-columns: repeat(2,1fr); gap: 5rem 1.2rem; margin-top: 2.5rem; }
.retro-interior-grid figure:nth-child(3) { grid-column: 1 / -1; }
.retro-interior-grid img { width: 100%; height: min(46vw,650px); object-fit: cover; filter: grayscale(1); }

@media (max-width: 820px) {
  .menu { top: var(--header-height); height: calc(100svh - var(--header-height)); width: min(390px, 92vw); }
  .home-only .site-header { height: var(--header-height); }
  .home-only .brand img { width: 60px; height: 60px; }
  .home-only .brand span { font-size: 1.2rem; }
  .retro-masthead { min-height: 48vh; }
  .retro-statement { grid-template-columns: 1fr; gap: 2rem; }
  .services-register article { grid-template-columns: 35px 1fr; }
  .services-register p { grid-column: 2; }
  .service-process { grid-template-columns: 1fr 1fr; }
  .service-process article { min-height: 190px; border-bottom: 1px solid var(--i-line); }
  .service-process article:nth-child(2) { border-right: 0; }
  .service-process article:nth-child(3) { padding-left: 0; }
  .retro-projects-head { padding-top: 3rem; }
  .retro-projects-title { grid-template-columns: 1fr; gap: 1.5rem; }
  .retro-projects-title h1 { font-size: 25vw; }
  .projects-grid { grid-template-columns: 1fr; gap: 4rem; }
  .project-tile figure,.project-tile > .photo-placeholder { height: 95vw; max-height: 620px; }
  .retro-project-name,.retro-project-copy { grid-template-columns: 1fr; gap: 2rem; }
  .retro-project-name dl { grid-template-columns: 1fr; }
  .retro-project-hero { height: 67vw; }
  .retro-render-grid,.retro-graphics-grid,.retro-interior-grid { grid-template-columns: 1fr; }
  .retro-render-grid figure:first-child { grid-row: auto; }
  .retro-render-grid figure:first-child img,.retro-render-grid img { min-height: 0; height: 70vw; }
  .retro-interior-grid figure:nth-child(3) { grid-column: auto; }
  .retro-interior-grid img { height: 70vw; }
  .retro-graphics-grid .photo-placeholder { min-height: 70vw; }
}
