.milan-residence {
  --surface: var(--color-ivory-50);
  --link: var(--color-ink-900);
  background: var(--surface);
}
.mr-opening { position: relative; }
.mr-opening-title {
  position: absolute;
  z-index: 1;
  inset: var(--space-5) 0 auto;
  pointer-events: none;
}
.mr-opening-title h1 { font-size: 5rem; max-width: 9ch; }
.mr-opening-title h1 span { display: block; }
.mr-opening-title .meta-row { margin-top: var(--space-3); flex-direction: column; gap: var(--space-1); color: var(--color-ink-900); }
.mr-status { font-size: var(--fs-micro); }
.mr-opening-media { width: min(100%, 1680px); margin: 0 auto; }
.mr-figure { margin: 0; min-width: 0; }
.mr-figure img { width: 100%; height: auto; }
.mr-foreword {
  padding-top: var(--space-5);
  padding-bottom: var(--space-6);
  border-bottom: 1px solid var(--line);
}
.mr-foreword .lead { max-width: 54ch; }
.mr-section { padding: var(--section-space) 0 0; }
.mr-section h2 { font-size: 3.8rem; max-width: 16ch; line-height: 1.05; }
.mr-heading { margin-bottom: var(--space-5); }
.mr-introduction {
  display: grid;
  grid-template-columns: minmax(0, 0.8fr) minmax(0, 1.2fr);
  align-items: start;
  gap: var(--space-7);
}
.mr-introduction .stack { padding-top: var(--space-4); }
.mr-introduction h2 { max-width: 13ch; }
.mr-facts { padding-top: var(--space-7); }
.mr-facts dl {
  display: grid;
  grid-template-columns: 1fr 1fr 0.9fr 2.1fr 0.8fr;
  gap: var(--space-4);
  padding: var(--space-4) 0;
  margin: 0;
  border-top: 1px solid var(--line);
  border-bottom: 1px solid var(--line);
}
.mr-facts dl > div { min-width: 0; }
.mr-facts dt { color: var(--label); font-size: var(--fs-micro); text-transform: uppercase; }
.mr-facts dd { margin: var(--space-2) 0 0; font-size: var(--fs-small); color: var(--body); }
.mr-spatial-planning { display: grid; grid-template-columns: minmax(0, 1fr); gap: var(--space-5); align-items: start; padding-top: var(--space-7); }
.mr-spatial-planning > .stack { max-width: 76ch; }
.mr-spatial-planning .kicker { font-family: var(--font-body); font-size: var(--fs-micro); font-weight: 400; line-height: 1.5; }
.mr-spatial-planning .mr-technical-plan { width: 100%; }
.mr-sequence { display: grid; gap: var(--space-6); }
.mr-material-story {
  display: grid;
  grid-template-columns: minmax(0, 1.35fr) minmax(0, 1fr);
  gap: var(--space-7);
  align-items: start;
}
.mr-material-context { grid-column: 1 / -1; width: 90%; }
.mr-bedroom-copy { width: min(72%, 820px); margin: var(--space-6) 0 var(--space-7) auto; }
.mr-supporting-image { width: 84%; margin-left: auto; }
.mr-room-pair { display: grid; grid-template-columns: minmax(0, 0.9fr) minmax(0, 1.1fr); gap: var(--space-6); align-items: center; margin-top: var(--space-7); }
.mr-room-transition { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: var(--space-6); align-items: end; padding: var(--space-8) 0 var(--space-5); }
.mr-room-transition h3 { font-size: 2.6rem; max-width: 20ch; }
.mr-study-support { width: 82%; margin-top: var(--space-6); }
.mr-study-copy { width: min(72%, 820px); margin: var(--space-5) 0 0 auto; }
.mr-tailored { display: grid; grid-template-columns: minmax(0, 0.8fr) minmax(0, 1.2fr); gap: var(--space-7); align-items: start; }
.mr-bath-intro { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 0.7fr); gap: var(--space-7); align-items: end; margin-bottom: var(--space-5); }
.mr-bath-lead { width: min(74%, 920px); margin: 0 auto; }
.mr-bath-support { width: min(78%, 940px); margin: var(--space-6) 0 0 auto; }
.mr-development { padding-bottom: var(--section-space); }
.mr-development-inner { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 0.8fr); gap: var(--space-7); align-items: start; border-top: 1px solid var(--line); padding-top: var(--space-6); }
.mr-development-inner h2 { font-size: 2.8rem; max-width: 21ch; }
.mr-icon-sprite { position: absolute; width: 0; height: 0; overflow: hidden; }
.mr-technical { position: relative; margin: 0; min-width: 0; }
.mr-technical-scroll { overflow-x: auto; overscroll-behavior-x: contain; }
.mr-technical-link { display: block; cursor: zoom-in; }
.mr-technical img { display: block; width: 100%; height: auto; }
.mr-technical figcaption {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  align-items: baseline;
  gap: var(--space-2);
  padding-top: var(--space-2);
  color: var(--label);
  font-size: var(--fs-micro);
  line-height: 1.5;
}
.mr-technical figcaption > :first-child { font-family: var(--font-display); font-size: 1.45rem; color: var(--body); }
.mr-technical figcaption > :last-child { text-align: right; }
.mr-technical-expand { position: absolute; top: var(--space-2); right: var(--space-2); display: grid; place-items: center; width: 44px; height: 44px; color: var(--body); background: var(--surface); }
.mr-technical-expand svg { width: 20px; height: 20px; fill: none; stroke: currentColor; stroke-width: 1.5; stroke-linecap: round; stroke-linejoin: round; }
.mr-technical-tooltip { position: absolute; top: 60px; right: var(--space-2); z-index: 1; max-width: calc(100% - 32px); padding: var(--space-1) var(--space-2); background: var(--color-ink-900); color: var(--surface); font-size: var(--fs-micro); line-height: 1.5; opacity: 0; visibility: hidden; transition: opacity var(--duration-ui) ease; pointer-events: none; }
.mr-technical-expand:hover + .mr-technical-tooltip, .mr-technical-link:focus-visible .mr-technical-tooltip { opacity: 1; visibility: visible; }
.mr-technical-living { width: min(92%, 1220px); margin: var(--space-6) 0 0 auto; }
.mr-technical-kitchen { grid-column: 1 / -1; width: min(92%, 1220px); justify-self: end; }
.mr-technical-study { width: min(92%, 1220px); margin: var(--space-6) 0 0 auto; }
.mr-technical-bath { width: min(88%, 1160px); margin: var(--space-6) 0 0; }
.mr-technical-hallway { grid-column: 1 / -1; width: min(92%, 1220px); justify-self: end; }
.mr-drawing-open { overflow: hidden; }
.mr-drawing-viewer { position: fixed; inset: 0; width: 100%; height: 100dvh; max-width: none; max-height: none; margin: 0; padding: 0; border: 0; background: var(--surface); color: var(--body); overflow: hidden; box-shadow: none; }
.mr-drawing-viewer[open] { display: grid; grid-template-rows: auto minmax(0, 1fr); }
.mr-viewer-header { display: flex; align-items: center; justify-content: space-between; gap: var(--space-2); min-height: 80px; padding: var(--space-2) var(--space-4); border-bottom: 1px solid var(--line); }
.mr-viewer-header p { margin: 0; min-width: 0; font-family: var(--font-display); font-size: 1.6rem; line-height: 1.1; }
.mr-viewer-controls { display: flex; gap: var(--space-1); flex: 0 0 auto; }
.mr-viewer-button { position: relative; display: grid; place-items: center; width: 44px; height: 44px; padding: 0; border: 0; border-radius: 0; background: transparent; color: var(--body); cursor: pointer; }
.mr-viewer-button:hover, .mr-viewer-button[aria-pressed="true"] { background: var(--color-ivory-100); }
.mr-viewer-button svg { width: 22px; height: 22px; fill: none; stroke: currentColor; stroke-width: 1.5; stroke-linecap: round; stroke-linejoin: round; }
.mr-viewer-button .mr-technical-tooltip { top: 48px; right: 0; max-width: none; white-space: nowrap; }
.mr-viewer-button:hover .mr-technical-tooltip, .mr-viewer-button:focus-visible .mr-technical-tooltip { opacity: 1; visibility: visible; }
.mr-viewer-stage { display: grid; grid-template-columns: minmax(0, 1fr); grid-template-rows: minmax(0, 1fr); place-items: center; height: 100%; min-height: 0; padding: var(--space-4); overflow: auto; }
.mr-viewer-image { width: auto; height: auto; max-width: 100%; max-height: 100%; }
.mr-drawing-viewer.is-actual-size .mr-viewer-stage { display: block; }
.mr-drawing-viewer.is-actual-size .mr-viewer-image { max-width: none; max-height: none; margin: 0 auto; }
.mr-closing { padding-bottom: var(--space-6); }
.mr-closing-caption { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: var(--space-5); padding-top: var(--space-5); align-items: center; }
.mr-closing-caption h2 { font-size: 3.4rem; }
.mr-closing-caption .meta-row { margin-top: var(--space-2); }
.mr-next { display: flex; flex-direction: column; align-items: flex-end; gap: var(--space-1); color: var(--color-ink-900); padding: var(--space-2) 0; border-bottom: 1px solid var(--line); }
.mr-next span { font-size: var(--fs-micro); color: var(--label); }
.mr-next strong { display: flex; gap: var(--space-4); align-items: center; font-family: var(--font-display); font-size: 2.4rem; font-weight: 400; line-height: 1.15; }
.mr-next strong span { color: inherit; font-size: inherit; transition: transform var(--duration-ui) ease; }
.mr-next:hover strong span { transform: translateX(4px); }

@media (max-width: 1200px) {
  .mr-opening-title h1 { font-size: 4.2rem; }
  .mr-section h2 { font-size: 3.25rem; }
  .mr-introduction, .mr-spatial-planning, .mr-material-story, .mr-tailored, .mr-development-inner { gap: var(--space-5); }
  .mr-development-inner h2 { font-size: 2.8rem; }
}
@media (max-width: 980px) {
  .mr-opening-title { inset-block-start: var(--space-4); }
  .mr-opening-title h1 { font-size: 3.4rem; }
  .mr-opening-title .meta-row { margin-top: var(--space-2); font-size: var(--fs-micro); }
  .mr-introduction { grid-template-columns: minmax(0, 1fr); gap: var(--space-5); }
  .mr-introduction .stack { max-width: 680px; padding-top: 0; }
  .mr-introduction h2 { max-width: 18ch; }
  .mr-facts dl { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .mr-facts dl > :nth-child(4) { grid-column: span 2; }
  .mr-spatial-planning { grid-template-columns: minmax(0, 1fr); gap: var(--space-4); }
  .mr-material-story, .mr-tailored, .mr-development-inner { grid-template-columns: minmax(0, 1fr); gap: var(--space-4); }
  .mr-room-pair { grid-template-columns: minmax(0, 1fr); gap: var(--space-6); }
  .mr-room-pair > :first-child { width: 84%; }
  .mr-room-pair > :last-child { width: 92%; justify-self: end; }
  .mr-bedroom-copy, .mr-study-copy { width: 86%; }
}
@media (max-width: 680px) {
  .mr-opening-title { position: static; padding-top: var(--space-4); padding-bottom: var(--space-3); }
  .mr-opening-title h1 { font-size: 3.5rem; max-width: none; }
  .mr-opening-title h1 span { display: inline; }
  .mr-opening-title .meta-row { flex-direction: row; font-size: var(--fs-micro); margin-top: var(--space-2); gap: var(--space-1) var(--space-2); }
  .mr-foreword { padding-top: var(--space-4); padding-bottom: var(--space-5); }
  .mr-section h2 { font-size: 2.65rem; }
  .mr-heading { margin-bottom: var(--space-4); }
  .mr-facts { padding-top: var(--space-5); }
  .mr-facts dl { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--space-3) var(--space-2); }
  .mr-facts dl > :nth-child(4) { grid-column: 1 / -1; grid-row: 3; }
  .mr-facts dl > :last-child { grid-column: 2; grid-row: 2; }
  .mr-sequence { gap: var(--space-4); }
  .mr-bedroom-copy { width: 100%; margin-top: var(--space-4); margin-bottom: var(--space-5); }
  .mr-study-copy { width: 100%; margin-top: var(--space-4); }
  .mr-spatial-planning { padding-top: var(--space-5); }
  .mr-spatial-planning .mr-technical-plan { width: 100%; }
  .mr-supporting-image, .mr-material-context, .mr-study-support, .mr-room-pair > :first-child, .mr-room-pair > :last-child { width: 100%; }
  .mr-room-pair { gap: var(--space-5); margin-top: var(--space-5); }
  .mr-room-transition { grid-template-columns: minmax(0, 1fr); gap: var(--space-2); padding: var(--space-6) 0 var(--space-4); }
  .mr-room-transition h3 { font-size: 2rem; }
  .mr-study-support { margin-top: var(--space-5); }
  .mr-tailored { grid-template-columns: minmax(0, 1fr); gap: var(--space-4); }
  .mr-bath-intro { grid-template-columns: minmax(0, 1fr); gap: var(--space-3); margin-bottom: var(--space-4); }
  .mr-bath-lead { width: 100%; }
  .mr-bath-support { width: 100%; margin-top: var(--space-5); }
  .mr-development-inner { padding-top: var(--space-4); gap: var(--space-4); }
  .mr-development-inner h2 { font-size: 2.25rem; }
  .mr-technical-living, .mr-technical-kitchen, .mr-technical-study, .mr-technical-bath, .mr-technical-hallway { width: 100%; }
  .mr-technical-link { min-width: 1000px; }
  .mr-technical-plan .mr-technical-link { min-width: 1100px; }
  .mr-technical-living, .mr-technical-study, .mr-technical-bath { margin-top: var(--space-5); }
  .mr-technical figcaption { grid-template-columns: minmax(0, 1fr); gap: var(--space-1); }
  .mr-technical figcaption > :last-child { text-align: left; }
  .mr-technical-expand { top: var(--space-1); right: var(--space-1); }
  .mr-viewer-header { padding-inline: var(--space-2); }
  .mr-viewer-header p { font-size: 1.3rem; }
  .mr-viewer-stage { padding: var(--space-2); }
  .mr-closing { padding-bottom: var(--space-5); }
  .mr-closing-caption { grid-template-columns: minmax(0, 1fr); gap: var(--space-4); padding-top: var(--space-4); }
  .mr-closing-caption h2 { font-size: 2.65rem; }
  .mr-next { align-items: flex-start; width: 100%; }
  .mr-next strong { width: 100%; justify-content: space-between; font-size: 2rem; }
}
@media (max-width: 400px) {
  .mr-opening-title h1 { font-size: 3rem; }
  .mr-section h2 { font-size: 2.4rem; }
  .mr-development-inner h2 { font-size: 2.25rem; }
}
