:root {
  --ink: #151817;
  --paper: #f4efe4;
  --muted: #655f56;
  --line: rgba(21, 24, 23, 0.14);
  --white: #fffaf2;
  --gold: #b48a4e;
  --green: #24483f;
  --blue: #243f5c;
  --red: #884238;
  --plum: #4c3447;
  --sage: #dce4dc;
  --copper: #aa663f;
  --shadow: 0 24px 80px rgba(17, 20, 19, 0.16);
  --soft-shadow: 0 16px 48px rgba(17, 20, 19, 0.12);
}

* {
  box-sizing: border-box;
}

html {
  scroll-behavior: smooth;
}

body {
  margin: 0;
  color: var(--ink);
  font-family: Arial, Helvetica, sans-serif;
  line-height: 1.5;
  background: var(--paper);
  text-rendering: geometricPrecision;
}

img {
  display: block;
  width: 100%;
  height: auto;
}

a {
  color: inherit;
}

h1,
h2,
h3,
p {
  margin-top: 0;
}

h1,
h2 {
  letter-spacing: 0;
  line-height: 0.95;
}

h1 {
  margin-bottom: 24px;
  font-family: Georgia, "Times New Roman", serif;
  font-size: 92px;
  font-weight: 400;
}

h2 {
  margin-bottom: 22px;
  font-family: Georgia, "Times New Roman", serif;
  font-size: 64px;
  font-weight: 400;
}

.kicker {
  margin-bottom: 14px;
  color: var(--accent, var(--gold));
  font-size: 12px;
  font-weight: 800;
  letter-spacing: 0;
  text-transform: uppercase;
}

.wordmark {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  text-decoration: none;
  text-transform: uppercase;
}

.wordmark span {
  display: grid;
  width: 34px;
  height: 34px;
  place-items: center;
  border: 1px solid currentColor;
  background: color-mix(in srgb, var(--ink) 94%, var(--gold));
  color: var(--paper);
  font-family: Georgia, "Times New Roman", serif;
  font-size: 21px;
  line-height: 1;
}

.wordmark strong {
  font-size: 13px;
  letter-spacing: 0;
}

.hub-header,
.site-top {
  position: sticky;
  top: 0;
  z-index: 10;
  display: grid;
  grid-template-columns: auto 1fr auto;
  gap: 24px;
  align-items: center;
  min-height: 72px;
  padding: 14px clamp(18px, 4vw, 44px);
  border-bottom: 1px solid var(--line);
  background: color-mix(in srgb, var(--paper) 88%, white);
  backdrop-filter: blur(18px);
  box-shadow: 0 10px 30px rgba(17, 20, 19, 0.04);
}

.hub-nav,
.site-top nav {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 8px;
}

.hub-nav a,
.site-top nav a,
.top-cta {
  min-height: 36px;
  padding: 9px 12px;
  border: 1px solid transparent;
  text-decoration: none;
  font-size: 12px;
  font-weight: 800;
  letter-spacing: 0;
  text-transform: uppercase;
  transition: background 220ms ease, border-color 220ms ease, color 220ms ease;
}

.site-top nav a[aria-current="page"],
.hub-nav a:hover,
.hub-nav a:focus-visible,
.site-top nav a:hover,
.site-top nav a:focus-visible,
.top-cta {
  border-color: currentColor;
}

.top-cta:hover,
.top-cta:focus-visible {
  background: var(--ink);
  color: var(--paper);
}

.hub-page {
  --accent: var(--copper);
  background:
    linear-gradient(180deg, #f4efe4 0%, #edf1ec 54%, #f6efe5 100%);
}

.hub-hero {
  display: grid;
  grid-template-columns: minmax(320px, 0.86fr) minmax(480px, 1.14fr);
  gap: clamp(28px, 5vw, 76px);
  align-items: center;
  min-height: calc(100svh - 72px);
  padding: clamp(32px, 6vw, 84px);
}

.hub-hero-copy {
  max-width: 760px;
}

.hub-hero-copy h1 {
  max-width: 760px;
  margin-bottom: 22px;
  font-size: 86px;
  line-height: 0.96;
}

.hub-hero-copy p:not(.kicker) {
  max-width: 620px;
  color: var(--muted);
  font-size: 21px;
}

.hub-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  margin: 30px 0 34px;
}

.primary-action,
.secondary-action {
  display: inline-flex;
  min-height: 44px;
  align-items: center;
  justify-content: center;
  padding: 11px 16px;
  border: 1px solid var(--ink);
  text-decoration: none;
  font-size: 13px;
  font-weight: 800;
  transition: background 220ms ease, color 220ms ease, transform 220ms ease;
}

.primary-action {
  background: var(--ink);
  color: var(--paper);
}

.secondary-action {
  background: rgba(255, 250, 242, 0.48);
}

.primary-action:hover,
.secondary-action:hover,
.primary-action:focus-visible,
.secondary-action:focus-visible {
  transform: translateY(-2px);
}

.secondary-action:hover,
.secondary-action:focus-visible {
  background: var(--white);
}

.hub-stat-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 1px;
  max-width: 640px;
  margin: 0;
  padding: 1px;
  background: var(--line);
}

.hub-stat-grid div {
  min-height: 112px;
  padding: 16px;
  background: rgba(255, 250, 242, 0.74);
}

.hub-stat-grid dt {
  margin-bottom: 20px;
  color: var(--muted);
  font-size: 12px;
  font-weight: 800;
  text-transform: uppercase;
}

.hub-stat-grid dd {
  margin: 0;
  color: var(--ink);
  font-family: Georgia, "Times New Roman", serif;
  font-size: 28px;
  line-height: 1;
}

.hub-selector {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(240px, 0.52fr);
  gap: 12px;
  min-height: 610px;
}

.selector-visual {
  position: relative;
  min-height: 610px;
  margin: 0;
  overflow: hidden;
  border: 1px solid rgba(21, 24, 23, 0.12);
  border-radius: 8px;
  background: var(--ink);
  box-shadow: var(--shadow);
}

.selector-visual::after {
  position: absolute;
  inset: 0;
  content: "";
  background: linear-gradient(180deg, rgba(21, 24, 23, 0.04), rgba(21, 24, 23, 0.62));
}

.selector-visual img {
  height: 100%;
  object-fit: cover;
}

.selector-visual figcaption {
  position: absolute;
  left: 18px;
  right: 18px;
  bottom: 18px;
  z-index: 2;
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.selector-list {
  display: grid;
  gap: 8px;
}

.selector-list a {
  display: grid;
  grid-template-columns: 44px 1fr;
  gap: 14px;
  align-items: start;
  min-height: 146px;
  padding: 18px;
  border: 1px solid rgba(21, 24, 23, 0.14);
  border-radius: 8px;
  background: rgba(255, 250, 242, 0.8);
  text-decoration: none;
  transition: background 220ms ease, border-color 220ms ease, transform 220ms ease;
}

.selector-list a:hover,
.selector-list a:focus-visible {
  border-color: rgba(21, 24, 23, 0.3);
  background: var(--white);
  transform: translateX(4px);
}

.selector-number {
  display: grid;
  width: 40px;
  height: 40px;
  place-items: center;
  border: 1px solid var(--line);
  background: var(--sage);
  color: var(--ink);
  font-family: Georgia, "Times New Roman", serif;
  font-size: 18px;
  line-height: 1;
}

.selector-list strong,
.selector-list small {
  display: block;
}

.selector-list strong {
  margin-bottom: 8px;
  font-family: Georgia, "Times New Roman", serif;
  font-size: 25px;
  font-weight: 400;
  line-height: 1.04;
}

.selector-list small {
  color: var(--muted);
  font-size: 13px;
  line-height: 1.35;
}

.template-library {
  scroll-margin-top: 84px;
  padding: clamp(52px, 7vw, 104px) clamp(18px, 4vw, 44px);
  background: #151817;
  color: var(--white);
}

.section-heading {
  display: grid;
  grid-template-columns: minmax(280px, 0.72fr) minmax(280px, 0.5fr);
  gap: clamp(24px, 5vw, 72px);
  align-items: end;
  max-width: 1400px;
  margin: 0 auto clamp(26px, 4vw, 52px);
}

.section-heading .kicker {
  grid-column: 1 / -1;
  margin-bottom: -8px;
}

.section-heading h2 {
  margin-bottom: 0;
  font-size: 64px;
}

.section-heading p:not(.kicker) {
  margin-bottom: 0;
  color: rgba(255, 250, 242, 0.7);
  font-size: 18px;
}

.template-cards {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 14px;
  max-width: 1400px;
  margin: 0 auto;
}

.template-card {
  position: relative;
  display: flex;
  min-height: 600px;
  align-items: flex-end;
  overflow: hidden;
  padding: 0;
  border-radius: 8px;
  color: white;
  text-decoration: none;
  background: #222;
  box-shadow: 0 22px 60px rgba(0, 0, 0, 0.22);
  isolation: isolate;
}

.template-card::before {
  position: absolute;
  inset: 0;
  z-index: 1;
  content: "";
  background: linear-gradient(180deg, rgba(10, 12, 12, 0.06) 0%, rgba(10, 12, 12, 0.26) 38%, rgba(10, 12, 12, 0.88) 100%);
}

.template-card img {
  position: absolute;
  inset: 0;
  height: 100%;
  object-fit: cover;
  transition: transform 500ms ease;
}

.template-card:hover img {
  transform: scale(1.04);
}

.template-number,
.template-card-body,
.template-card strong,
.template-card p {
  position: relative;
  z-index: 2;
}

.template-number {
  position: absolute;
  top: 18px;
  left: 18px;
  display: grid;
  width: 42px;
  height: 42px;
  place-items: center;
  border: 1px solid rgba(255, 250, 242, 0.36);
  background: rgba(21, 24, 23, 0.42);
  color: var(--white);
  backdrop-filter: blur(12px);
  font-family: Georgia, "Times New Roman", serif;
  font-size: 18px;
}

.template-card-body {
  width: 100%;
  padding: 22px;
}

.template-meta {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-bottom: 18px;
}

.meta-chip {
  display: inline-flex;
  min-height: 30px;
  align-items: center;
  gap: 8px;
  padding: 6px 9px;
  border: 1px solid rgba(255, 250, 242, 0.34);
  border-radius: 4px;
  background: rgba(21, 24, 23, 0.4);
  color: var(--white);
  font-size: 12px;
  font-weight: 800;
  letter-spacing: 0;
  line-height: 1;
  backdrop-filter: blur(12px);
}

.chip-icon {
  position: relative;
  display: inline-block;
  width: 14px;
  height: 14px;
  flex: 0 0 14px;
}

.chip-icon::before,
.chip-icon::after {
  position: absolute;
  content: "";
}

.icon-address::before {
  inset: 2px 3px 1px;
  border: 2px solid currentColor;
  border-top-width: 4px;
}

.icon-floor::before {
  inset: 2px;
  border: 2px solid currentColor;
}

.icon-floor::after {
  left: 2px;
  right: 2px;
  top: 6px;
  border-top: 2px solid currentColor;
}

.icon-rating::before {
  inset: 2px;
  border: 2px solid currentColor;
  transform: rotate(45deg);
}

.icon-editorial::before {
  inset: 1px 3px 1px 2px;
  border: 2px solid currentColor;
  border-right: 0;
}

.icon-editorial::after {
  right: 2px;
  top: 3px;
  bottom: 3px;
  border-left: 2px solid currentColor;
}

.icon-client::before {
  left: 1px;
  top: 2px;
  width: 12px;
  height: 8px;
  border: 2px solid currentColor;
}

.icon-client::after {
  left: 5px;
  bottom: 1px;
  width: 4px;
  border-top: 2px solid currentColor;
}

.icon-grid::before {
  inset: 2px;
  background:
    linear-gradient(currentColor 0 0) left top / 5px 5px no-repeat,
    linear-gradient(currentColor 0 0) right top / 5px 5px no-repeat,
    linear-gradient(currentColor 0 0) left bottom / 5px 5px no-repeat,
    linear-gradient(currentColor 0 0) right bottom / 5px 5px no-repeat;
}

.icon-lens::before {
  left: 1px;
  top: 1px;
  width: 8px;
  height: 8px;
  border: 2px solid currentColor;
  border-radius: 50%;
}

.icon-lens::after {
  right: 1px;
  bottom: 2px;
  width: 6px;
  border-top: 2px solid currentColor;
  transform: rotate(45deg);
}

.template-card strong {
  display: block;
  margin-bottom: 12px;
  font-family: Georgia, "Times New Roman", serif;
  font-size: 32px;
  font-weight: 400;
  line-height: 1.02;
}

.template-card p {
  max-width: 320px;
  margin-bottom: 0;
  color: rgba(255, 250, 242, 0.78);
}

.card-heritage .selector-number,
.card-heritage .template-number {
  background: color-mix(in srgb, var(--copper) 78%, black);
}

.card-workspace .template-number {
  background: color-mix(in srgb, var(--green) 82%, black);
}

.card-gallery .template-number {
  background: color-mix(in srgb, var(--red) 82%, black);
}

.card-location .template-number {
  background: color-mix(in srgb, var(--blue) 82%, black);
}

.template-page {
  --accent: var(--gold);
}

.template-page main {
  overflow: hidden;
}

.chapter,
.floor-editorial,
.location-roll,
.occupier-section,
.spec-table,
.gallery-spec,
.brochure-panels,
.gallery-map,
.amenity-atlas,
.atlas-workplace {
  padding: clamp(48px, 7vw, 108px) clamp(20px, 6vw, 88px);
}

.heritage-page {
  --paper: #efe7da;
  --accent: #9b5d31;
  --ink: #201a16;
}

.heritage-hero {
  position: relative;
  min-height: calc(100vh - 70px);
  overflow: hidden;
  color: #fff8e8;
  background: var(--ink);
}

.heritage-hero figure {
  position: relative;
  z-index: 0;
  margin: 0;
}

.heritage-hero::before {
  position: absolute;
  inset: 0;
  z-index: 1;
  pointer-events: none;
  content: "";
  background:
    linear-gradient(
      90deg,
      rgba(15, 13, 12, 0.82) 0%,
      rgba(15, 13, 12, 0.68) 34%,
      rgba(15, 13, 12, 0.32) 52%,
      rgba(15, 13, 12, 0) 74%
    );
}

.heritage-hero img {
  width: 100%;
  height: calc(100vh - 70px);
  min-height: 680px;
  object-fit: cover;
  opacity: 0.72;
}

.heritage-title {
  position: absolute;
  z-index: 2;
  left: clamp(24px, 7vw, 96px);
  right: clamp(24px, 18vw, 220px);
  bottom: clamp(32px, 7vw, 96px);
  text-shadow: 0 2px 18px rgba(0, 0, 0, 0.36);
}

.heritage-title p:not(.kicker) {
  max-width: 680px;
  font-size: clamp(18px, 2vw, 24px);
}

.chapter-split {
  display: grid;
  grid-template-columns: minmax(260px, 0.78fr) 1fr;
  gap: clamp(24px, 7vw, 100px);
  align-items: center;
}

.stacked-media {
  display: grid;
  grid-template-columns: 1fr 0.68fr;
  gap: 14px;
}

.stacked-media img {
  height: 620px;
  object-fit: cover;
}

.stacked-media img:nth-child(2) {
  height: 460px;
  align-self: end;
}

.heritage-statement {
  padding: clamp(60px, 10vw, 150px) clamp(24px, 12vw, 170px);
  background: var(--green);
  color: #f8f0dd;
}

.heritage-statement p {
  max-width: 1120px;
  margin: 0 auto;
  font-family: Georgia, "Times New Roman", serif;
  font-size: clamp(36px, 5.4vw, 82px);
  line-height: 1.05;
}

.heritage-editorial-statement {
  background: #fbfaf6;
  color: #4a2b18;
}

.heritage-editorial-copy {
  display: grid;
  justify-items: center;
  padding: clamp(86px, 13vw, 188px) clamp(24px, 8vw, 120px) clamp(68px, 9vw, 128px);
  text-align: center;
}

.heritage-editorial-copy h2 {
  max-width: 940px;
  margin: 0;
  color: #4b2b18;
  font-family: "Playfair Display", Georgia, "Times New Roman", serif;
  font-size: clamp(48px, 6.4vw, 108px);
  font-weight: 800;
  letter-spacing: 0;
  line-height: 0.94;
  text-transform: uppercase;
}

.heritage-editorial-copy p {
  max-width: 710px;
  margin: clamp(30px, 4vw, 48px) 0 0;
  color: #6f6854;
  font-size: clamp(18px, 1.5vw, 23px);
  line-height: 1.45;
}

.heritage-editorial-copy span {
  width: 54px;
  height: 1px;
  margin-top: clamp(34px, 4vw, 52px);
  background: #4b2b18;
}

.heritage-editorial-statement figure {
  margin: 0;
}

.heritage-editorial-statement img {
  width: 100%;
  height: min(52vw, 720px);
  min-height: 420px;
  object-fit: cover;
  object-position: center;
}

.image-timeline,
.full-image-gallery,
.workspace-media-wall,
.wide-facade,
.atlas-images {
  display: grid;
  gap: 10px;
}

.image-timeline {
  grid-template-columns: 0.8fr 1.1fr 0.9fr;
  padding: 10px;
  background: var(--ink);
}

.image-timeline img {
  height: min(56vw, 620px);
  object-fit: cover;
}

.details-chapter {
  display: grid;
  grid-template-columns: minmax(280px, 0.62fr) 1fr;
  gap: clamp(28px, 5vw, 80px);
  border-bottom: 1px solid var(--line);
}

.spec-mosaic {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 1px;
  margin: 0;
  padding: 1px;
  list-style: none;
  background: var(--line);
}

.spec-mosaic li {
  min-height: 94px;
  padding: 18px;
  background: #fbf4e9;
  color: #5d5046;
  font-size: 15px;
}

.floor-editorial {
  display: grid;
  grid-template-columns: minmax(280px, 0.65fr) 1fr;
  gap: clamp(28px, 6vw, 90px);
  align-items: center;
}

.floor-copy p:not(.kicker) {
  max-width: 540px;
  color: var(--muted);
  font-size: 18px;
}

.floor-diagram,
.technical-plan {
  position: relative;
  min-height: 500px;
  border: 2px solid var(--ink);
  background:
    linear-gradient(90deg, transparent 49%, var(--line) 50%, transparent 51%) 0 0 / 58px 58px,
    linear-gradient(0deg, transparent 49%, var(--line) 50%, transparent 51%) 0 0 / 58px 58px,
    #fff8ec;
}

.zone,
.technical-plan span {
  position: absolute;
  display: grid;
  place-items: center;
  padding: 12px;
  border: 1px solid var(--ink);
  background: #fffdf8;
  font-size: 12px;
  font-weight: 800;
  letter-spacing: 0;
  text-align: center;
  text-transform: uppercase;
}

.zone.open {
  inset: 52px 40px 170px 40px;
}

.zone.board {
  left: 40px;
  bottom: 42px;
  width: 38%;
  height: 90px;
}

.zone.meet {
  right: 40px;
  top: 70px;
  width: 28%;
  height: 100px;
}

.zone.tea {
  right: 40px;
  bottom: 42px;
  width: 36%;
  height: 90px;
}

.location-roll {
  background: #fbf4e9;
}

.roll-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 1px;
  margin-top: 36px;
  background: var(--line);
}

.roll-grid p {
  min-height: 180px;
  margin: 0;
  padding: 22px;
  background: var(--paper);
  color: var(--muted);
}

.roll-grid strong {
  display: block;
  margin-bottom: 10px;
  color: var(--ink);
  text-transform: uppercase;
  letter-spacing: 0;
}

.connection-strip {
  display: grid;
  grid-template-columns: repeat(6, minmax(120px, 1fr));
  gap: 1px;
  padding: 1px;
  background: rgba(255, 255, 255, 0.24);
}

.connection-strip div {
  min-height: 160px;
  padding: 22px;
  background: var(--ink);
  color: #f8f0dd;
}

.connection-strip strong {
  display: block;
  margin-bottom: 12px;
  color: var(--gold);
  font-family: Georgia, "Times New Roman", serif;
  font-size: 46px;
  font-weight: 400;
}

.connection-strip span {
  font-size: 12px;
  font-weight: 800;
  letter-spacing: 0;
  text-transform: uppercase;
}

.full-image-gallery {
  grid-template-columns: repeat(3, minmax(0, 1fr));
  padding: 10px;
  background: var(--ink);
}

.full-image-gallery img {
  height: min(42vw, 500px);
  object-fit: cover;
}

.workspace-page {
  --paper: #f4efe7;
  --accent: #252a1b;
  --ink: #252a1b;
}

.workspace-hero {
  display: grid;
  grid-template-columns: minmax(520px, 0.72fr) minmax(520px, 0.9fr);
  gap: clamp(24px, 5vw, 80px);
  align-items: end;
  min-height: calc(100vh - 70px);
  padding: clamp(32px, 6vw, 86px);
  background: #e7ece8;
}

.workspace-hero p:not(.kicker) {
  max-width: 560px;
  color: #52605c;
  font-size: clamp(18px, 2vw, 24px);
}

.workspace-hero h1 {
  max-width: 700px;
  font-size: clamp(54px, 7vw, 98px);
}

.workspace-hero img {
  height: min(70vh, 720px);
  object-fit: cover;
  box-shadow: var(--shadow);
}

.availability-board {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 1px;
  padding: 1px;
  background: var(--ink);
}

.availability-board div {
  min-height: 220px;
  padding: 24px;
  background: #fbfdfb;
}

.availability-board span,
.availability-board small {
  display: block;
  color: #596764;
  font-size: 12px;
  font-weight: 800;
  letter-spacing: 0;
  text-transform: uppercase;
}

.availability-board strong {
  display: block;
  margin: 34px 0 12px;
  color: var(--accent);
  font-family: Georgia, "Times New Roman", serif;
  font-size: clamp(42px, 6vw, 92px);
  font-weight: 400;
  line-height: 0.9;
}

.workspace-arrival-editorial {
  display: grid;
  grid-template-columns: minmax(260px, 0.78fr) minmax(360px, 0.9fr);
  gap: clamp(34px, 8vw, 128px);
  padding: clamp(72px, 10vw, 148px) clamp(22px, 6vw, 88px) clamp(44px, 7vw, 86px);
  background: #ebe7e1;
  color: #251b15;
}

.workspace-arrival-heading {
  align-self: start;
}

.workspace-arrival-heading h2 {
  max-width: 520px;
  margin: clamp(34px, 5vw, 58px) 0 0;
  color: #4b2b18;
  font-family: "Playfair Display", Georgia, "Times New Roman", serif;
  font-size: clamp(48px, 5.9vw, 92px);
  font-weight: 800;
  letter-spacing: 0;
  line-height: 1;
  text-transform: uppercase;
}

.workspace-arrival-copy {
  display: grid;
  gap: 26px;
  max-width: 680px;
  align-self: start;
}

.workspace-arrival-copy span {
  width: 54px;
  height: 2px;
  margin-bottom: 2px;
  background: #251b15;
}

.workspace-arrival-copy p {
  margin: 0;
  color: #191511;
  font-size: clamp(18px, 1.55vw, 23px);
  line-height: 1.48;
}

.workspace-arrival-images {
  grid-column: 1 / -1;
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: clamp(12px, 1.4vw, 18px);
  margin-top: clamp(18px, 3vw, 34px);
}

.workspace-arrival-images figure {
  margin: 0;
  overflow: hidden;
}

.workspace-arrival-images img {
  width: 100%;
  height: clamp(280px, 28vw, 430px);
  object-fit: cover;
  transition: transform 600ms ease;
}

.workspace-arrival-images figure:hover img {
  transform: scale(1.025);
}

.workspace-arrival-mobile-cta {
  display: none;
}

.workspace-grid {
  display: grid;
  grid-template-columns: minmax(280px, 0.6fr) 1fr;
  gap: clamp(28px, 6vw, 84px);
  align-items: center;
  padding: clamp(48px, 7vw, 108px) clamp(20px, 6vw, 88px);
}

.technical-plan .desk-bank {
  inset: 46px 42px 210px 42px;
}

.technical-plan .boardroom {
  left: 42px;
  bottom: 42px;
  width: 30%;
  height: 120px;
}

.technical-plan .meeting {
  left: 36%;
  bottom: 42px;
  width: 24%;
  height: 120px;
}

.technical-plan .booths {
  right: 42px;
  top: 66px;
  width: 24%;
  height: 118px;
}

.technical-plan .tea {
  right: 42px;
  bottom: 42px;
  width: 22%;
  height: 120px;
}

.technical-plan .support {
  left: 42px;
  top: 46px;
  width: 24%;
  height: 90px;
}

.spec-table {
  display: grid;
  grid-template-columns: minmax(280px, 0.68fr) 1fr;
  gap: clamp(24px, 6vw, 90px);
  background: #101b1c;
  color: #eff7f3;
}

.spec-table .kicker {
  color: #7fc0b5;
}

.rows {
  display: grid;
  gap: 1px;
  background: rgba(255, 255, 255, 0.16);
}

.rows p {
  margin: 0;
  padding: 22px;
  background: #101b1c;
  color: rgba(239, 247, 243, 0.76);
}

.rows span {
  display: block;
  margin-bottom: 8px;
  color: #eff7f3;
  font-weight: 800;
  text-transform: uppercase;
  letter-spacing: 0;
}

.workspace-media-wall {
  grid-template-columns: repeat(6, minmax(0, 1fr));
  padding: 10px;
  background: #101b1c;
}

.workspace-media-wall img {
  height: 360px;
  object-fit: cover;
}

.workspace-media-wall img:nth-child(1),
.workspace-media-wall img:nth-child(2) {
  grid-column: span 2;
}

.workspace-media-wall img:nth-child(3),
.workspace-media-wall img:nth-child(4),
.workspace-media-wall img:nth-child(5),
.workspace-media-wall img:nth-child(6) {
  grid-column: span 1;
}

.occupier-section {
  display: grid;
  grid-template-columns: minmax(280px, 0.62fr) 1fr;
  gap: clamp(28px, 6vw, 90px);
}

.occupier-section dl {
  display: grid;
  gap: 1px;
  margin: 0;
  background: var(--line);
}

.occupier-section div div,
.occupier-section dl > div {
  padding: 22px;
  background: #fbfdfb;
}

.occupier-section dt {
  margin-bottom: 8px;
  font-weight: 800;
  letter-spacing: 0;
  text-transform: uppercase;
}

.occupier-section dd {
  margin: 0;
  color: #596764;
}

.commute-table {
  padding: clamp(48px, 7vw, 108px) clamp(20px, 6vw, 88px);
  background: #d9e3df;
}

.commute-table div {
  display: grid;
  grid-template-columns: 1fr auto 1.1fr;
  gap: 24px;
  align-items: baseline;
  padding: 18px 0;
  border-top: 1px solid rgba(17, 29, 29, 0.2);
}

.commute-table strong {
  color: var(--accent);
  font-family: Georgia, "Times New Roman", serif;
  font-size: 38px;
  font-weight: 400;
}

.commute-table em {
  color: #596764;
  font-style: normal;
}

.wide-facade {
  grid-template-columns: 1fr 0.65fr;
  padding: 10px;
  background: #101b1c;
}

.wide-facade img {
  height: 580px;
  object-fit: cover;
}

.gallery-page {
  --paper: #f4efe7;
  --accent: #8e3f32;
  --ink: #201716;
  --muted: #6b625b;
  --gallery-cream: #fffaf2;
  --gallery-green: #20473d;
  --gallery-blue: #213f5d;
  --gallery-brass: #b8874a;
  background:
    linear-gradient(180deg, rgba(255, 250, 242, 0.68), rgba(244, 239, 231, 0) 28rem),
    var(--paper);
}

.gallery-page main {
  overflow: visible;
}

.gallery-page .site-top {
  border-bottom-color: rgba(32, 23, 22, 0.12);
  background: rgba(255, 250, 242, 0.86);
}

.gallery-page .top-cta {
  background: var(--ink);
  color: var(--gallery-cream);
}

.gallery-cover {
  position: relative;
  isolation: isolate;
  display: grid;
  min-height: calc(100svh - 70px);
  overflow: hidden;
  align-items: end;
  background: var(--ink);
  color: var(--gallery-cream);
}

.gallery-cover::after {
  position: absolute;
  inset: 0;
  z-index: -1;
  content: "";
  background:
    linear-gradient(90deg, rgba(32, 23, 22, 0.9) 0%, rgba(32, 23, 22, 0.48) 46%, rgba(32, 23, 22, 0.08) 100%),
    linear-gradient(0deg, rgba(32, 23, 22, 0.92) 0%, rgba(32, 23, 22, 0.14) 58%, rgba(32, 23, 22, 0.32) 100%);
}

.gallery-cover__media {
  position: absolute;
  inset: 0;
  z-index: -2;
  overflow: hidden;
}

.gallery-cover__media img {
  width: 100%;
  height: calc(100% + 12vh);
  object-fit: cover;
  opacity: 0.82;
  transform: translate3d(0, var(--gallery-y, 0), 0) scale(1.04);
  transform-origin: center top;
}

.gallery-cover__content {
  width: min(1180px, 100%);
  padding: clamp(88px, 12vw, 164px) clamp(22px, 7vw, 104px) clamp(42px, 7vw, 92px);
}

.gallery-cover h1 {
  max-width: 1040px;
  margin-bottom: clamp(24px, 5vw, 54px);
  text-wrap: balance;
}

.gallery-cover .kicker {
  color: #f0b39f;
}

.gallery-cover__markers {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
}

.gallery-cover__markers span,
.gallery-scroll-cue {
  display: inline-flex;
  min-height: 42px;
  align-items: center;
  gap: 10px;
  padding: 10px 14px;
  border: 1px solid rgba(255, 250, 242, 0.24);
  background: rgba(255, 250, 242, 0.08);
  color: rgba(255, 250, 242, 0.86);
  font-size: 11px;
  font-weight: 800;
  letter-spacing: 0;
  text-decoration: none;
  text-transform: uppercase;
  backdrop-filter: blur(16px);
}

.gallery-cover__markers strong {
  color: #f0b39f;
  font-family: Georgia, "Times New Roman", serif;
  font-size: 18px;
  font-weight: 400;
  letter-spacing: 0;
}

.gallery-scroll-cue {
  position: absolute;
  right: clamp(22px, 5vw, 72px);
  bottom: clamp(24px, 5vw, 64px);
  z-index: 2;
}

.gallery-scroll-cue::before {
  width: 8px;
  height: 8px;
  content: "";
  border-right: 2px solid currentColor;
  border-bottom: 2px solid currentColor;
  transform: rotate(45deg) translateY(-2px);
}

.magazine-intro {
  display: grid;
  grid-template-columns: minmax(300px, 1fr) minmax(240px, 360px);
  gap: clamp(28px, 7vw, 110px);
  align-items: end;
  padding: clamp(62px, 10vw, 146px) clamp(24px, 10vw, 152px);
}

.magazine-intro > p {
  margin: 0;
  font-family: Georgia, "Times New Roman", serif;
  font-size: clamp(30px, 4.2vw, 68px);
  line-height: 1.08;
  text-wrap: pretty;
}

.intro-card {
  position: relative;
  padding: 22px 0 0 22px;
  border-top: 2px solid var(--ink);
  border-left: 1px solid rgba(32, 23, 22, 0.18);
}

.intro-card::before {
  position: absolute;
  left: -7px;
  top: -7px;
  width: 13px;
  height: 13px;
  content: "";
  background: var(--accent);
}

.intro-card strong {
  display: block;
  color: var(--gallery-green);
  font-family: Georgia, "Times New Roman", serif;
  font-size: clamp(42px, 5vw, 58px);
  font-weight: 400;
  line-height: 0.95;
}

.intro-card span,
.intro-card small {
  display: block;
}

.intro-card span {
  margin-top: 12px;
  color: var(--ink);
  font-weight: 800;
  letter-spacing: 0;
  text-transform: uppercase;
}

.intro-card small {
  margin-top: 22px;
  color: var(--muted);
  font-size: 15px;
}

.gallery-scroll-story {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(320px, 0.74fr);
  gap: clamp(24px, 6vw, 92px);
  align-items: start;
  padding: 0 clamp(20px, 6vw, 88px) clamp(72px, 10vw, 140px);
}

.story-media {
  position: sticky;
  top: 96px;
  min-height: min(78vh, 760px);
  overflow: hidden;
  background: var(--ink);
  box-shadow: 0 30px 90px rgba(32, 23, 22, 0.22);
}

.story-media figure {
  position: absolute;
  inset: 0;
  margin: 0;
  opacity: 0;
  transform: scale(1.035);
  transition: opacity 700ms ease, transform 1200ms ease;
}

.story-media figure.is-active {
  opacity: 1;
  transform: scale(1);
}

.story-media img {
  height: 100%;
  object-fit: cover;
}

.story-media figcaption {
  position: absolute;
  left: 18px;
  bottom: 18px;
  display: inline-flex;
  max-width: calc(100% - 36px);
  min-height: 42px;
  align-items: center;
  gap: 10px;
  padding: 10px 14px;
  background: rgba(32, 23, 22, 0.72);
  color: var(--gallery-cream);
  font-size: 11px;
  font-weight: 800;
  letter-spacing: 0;
  text-transform: uppercase;
  backdrop-filter: blur(14px);
}

.story-media figcaption span {
  color: #f0b39f;
  font-family: Georgia, "Times New Roman", serif;
  font-size: 18px;
  font-weight: 400;
  letter-spacing: 0;
}

.story-copy {
  display: grid;
  gap: clamp(28px, 8vh, 92px);
  padding-top: clamp(14px, 6vh, 60px);
}

.story-copy article {
  min-height: 48vh;
  padding: clamp(28px, 5vw, 56px);
  border: 1px solid rgba(32, 23, 22, 0.14);
  background: rgba(255, 250, 242, 0.72);
}

.story-copy article.is-active {
  border-color: rgba(142, 63, 50, 0.42);
  box-shadow: inset 4px 0 0 var(--accent);
}

.story-copy h2 {
  font-size: clamp(36px, 5vw, 72px);
}

.story-copy p:not(.kicker) {
  max-width: 560px;
  color: var(--muted);
  font-size: 18px;
}

.editorial-gallery {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 12px;
  padding: 12px;
  background: var(--ink);
}

.editorial-gallery figure {
  position: relative;
  margin: 0;
  overflow: hidden;
  background: var(--gallery-cream);
}

.editorial-gallery figure::before {
  position: absolute;
  left: 16px;
  top: 16px;
  z-index: 1;
  width: 11px;
  height: 11px;
  content: "";
  background: var(--gallery-brass);
  box-shadow: 14px 0 0 var(--accent), 28px 0 0 var(--gallery-green);
}

.editorial-gallery img {
  height: 420px;
  object-fit: cover;
  transition: transform 700ms ease, filter 700ms ease;
}

.editorial-gallery figure:hover img {
  filter: saturate(1.04) contrast(1.02);
  transform: scale(1.035);
}

.editorial-gallery .large {
  grid-column: span 2;
  grid-row: span 2;
}

.editorial-gallery .large img {
  height: 884px;
}

.editorial-gallery .wide {
  grid-column: span 2;
}

.editorial-gallery figcaption {
  display: flex;
  min-height: 60px;
  align-items: center;
  padding: 15px 16px 15px 44px;
  color: #67564f;
  font-size: 12px;
  font-weight: 800;
  letter-spacing: 0;
  text-transform: uppercase;
}

.editorial-gallery figcaption::before {
  width: 16px;
  height: 1px;
  margin-right: 12px;
  content: "";
  background: var(--accent);
}

.gallery-spec {
  display: grid;
  grid-template-columns: minmax(300px, 0.7fr) 1fr;
  gap: clamp(28px, 6vw, 96px);
  align-items: start;
  background:
    linear-gradient(90deg, rgba(184, 135, 74, 0.14), transparent 34%),
    #ebe4da;
}

.gallery-spec__intro {
  position: sticky;
  top: 102px;
}

.gallery-spec__intro p:not(.kicker) {
  max-width: 460px;
  color: var(--muted);
  font-size: 18px;
}

.gallery-spec-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 1px;
  align-content: start;
  background: rgba(32, 23, 22, 0.18);
}

.gallery-spec-grid span {
  display: grid;
  min-height: 144px;
  align-content: space-between;
  padding: 20px;
  background: var(--gallery-cream);
  color: var(--ink);
  font-weight: 800;
  letter-spacing: 0;
  text-transform: uppercase;
  transition: background 260ms ease, color 260ms ease, transform 260ms ease;
}

.gallery-spec-grid span:hover {
  background: var(--gallery-green);
  color: var(--gallery-cream);
  transform: translateY(-3px);
}

.gallery-spec-grid small {
  color: var(--accent);
  font-family: Georgia, "Times New Roman", serif;
  font-size: 28px;
  font-weight: 400;
  letter-spacing: 0;
}

.gallery-spec-grid span:hover small {
  color: #f1c39b;
}

.brochure-panels {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 1px;
  background: rgba(32, 23, 22, 0.16);
}

.brochure-panels article {
  position: relative;
  display: grid;
  grid-template-rows: 1fr auto auto;
  gap: 28px;
  min-height: 520px;
  overflow: hidden;
  padding: clamp(30px, 5vw, 64px);
  background:
    linear-gradient(135deg, rgba(184, 137, 77, 0.18), transparent 52%),
    var(--gallery-cream);
}

.brochure-panels article::after {
  position: absolute;
  left: 0;
  right: auto;
  top: 0;
  bottom: 0;
  width: 10px;
  height: auto;
  content: "";
  background: linear-gradient(180deg, var(--accent) 0 34%, var(--gallery-green) 34% 68%, var(--gallery-blue) 68% 100%);
}

.brochure-panels article:nth-child(2) {
  background:
    linear-gradient(135deg, rgba(32, 71, 61, 0.14), transparent 54%),
    #f3f6f0;
}

.brochure-panels p:not(.kicker) {
  max-width: 580px;
  color: var(--muted);
  font-size: 18px;
}

.brochure-panel dl,
.brochure-panel ul {
  display: grid;
  gap: 1px;
  margin: 0;
  padding: 0;
  background: rgba(32, 23, 22, 0.12);
}

.brochure-panel dl {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}

.brochure-panel dl div,
.brochure-panel li {
  min-height: 84px;
  padding: 16px;
  background: rgba(255, 253, 248, 0.72);
}

.brochure-panel dt,
.brochure-panel dd {
  margin: 0;
}

.brochure-panel dt {
  margin-bottom: 8px;
  color: var(--accent);
  font-size: 12px;
  font-weight: 900;
  text-transform: uppercase;
}

.brochure-panel dd {
  color: var(--ink);
  font-family: Georgia, "Times New Roman", serif;
  font-size: 26px;
  line-height: 1;
}

.brochure-panel ul {
  list-style: none;
}

.brochure-panel li {
  color: var(--ink);
  font-size: 14px;
  font-weight: 900;
  line-height: 1.25;
  text-transform: uppercase;
}

.gallery-map {
  display: grid;
  grid-template-columns: minmax(300px, 0.58fr) minmax(0, 1fr);
  gap: clamp(28px, 6vw, 90px);
  align-items: stretch;
  background:
    linear-gradient(90deg, rgba(143, 71, 59, 0.13), transparent 44%),
    #f7f1e8;
}

.gallery-map p:not(.kicker) {
  max-width: 520px;
  color: var(--muted);
  font-size: 18px;
}

.gallery-map__copy {
  align-self: center;
}

.gallery-map-points {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 1px;
  max-width: 520px;
  margin-top: 28px;
  background: rgba(32, 23, 22, 0.16);
}

.gallery-map-points span {
  display: grid;
  min-height: 92px;
  align-content: center;
  gap: 8px;
  padding: 16px;
  background: #fffdf8;
  color: var(--ink);
  font-size: 12px;
  font-weight: 900;
  line-height: 1.2;
  text-transform: uppercase;
}

.gallery-map-points strong {
  color: var(--accent);
  font-family: Georgia, "Times New Roman", serif;
  font-size: 32px;
  font-weight: 400;
  line-height: 1;
}

.gallery-map__live {
  --map-ink: #121614;
  --map-ivory: #fffaf0;
  --map-oxide: #8f473b;
  min-height: 620px;
  border-color: rgba(32, 23, 22, 0.14);
  border-radius: 0;
  box-shadow: 0 24px 70px rgba(32, 23, 22, 0.16);
}

.abstract-map,
.atlas-map {
  position: relative;
  min-height: 560px;
  overflow: hidden;
  border: 1px solid var(--line);
  background:
    linear-gradient(90deg, transparent 49%, rgba(33, 23, 21, 0.12) 50%, transparent 51%) 0 0 / 96px 96px,
    linear-gradient(0deg, transparent 49%, rgba(33, 23, 21, 0.12) 50%, transparent 51%) 0 0 / 96px 96px,
    #fff7ef;
}

.abstract-map::before {
  position: absolute;
  inset: 18px;
  content: "";
  border: 1px solid rgba(32, 23, 22, 0.14);
}

.map-route {
  position: absolute;
  left: 50%;
  top: 50%;
  width: 34%;
  height: 2px;
  background: var(--gallery-brass);
  transform-origin: left center;
}

.route-one {
  transform: rotate(-146deg);
}

.route-two {
  width: 30%;
  transform: rotate(38deg);
}

.route-three {
  width: 24%;
  transform: rotate(-28deg);
}

.node,
.map-label {
  position: absolute;
  display: grid;
  min-width: 90px;
  min-height: 44px;
  place-items: center;
  padding: 10px 14px;
  border: 1px solid var(--ink);
  background: #fffdf8;
  font-size: 12px;
  font-weight: 800;
  letter-spacing: 0;
  text-align: center;
  text-transform: uppercase;
}

.node small {
  display: block;
  margin-bottom: 4px;
  color: var(--accent);
  font-family: Georgia, "Times New Roman", serif;
  font-size: 18px;
  font-weight: 400;
  letter-spacing: 0;
  text-transform: none;
}

.node.savoy {
  left: 45%;
  top: 46%;
  width: 76px;
  height: 76px;
  border-radius: 50%;
  background: var(--accent);
  color: white;
  font-size: 32px;
}

.node.garden {
  left: 11%;
  top: 20%;
}

.node.river {
  right: 10%;
  bottom: 16%;
}

.node.strand {
  right: 17%;
  top: 26%;
}

.gallery-page .contact-footer {
  border-top: 0;
  background:
    linear-gradient(90deg, rgba(32, 71, 61, 0.16), transparent 42%),
    var(--ink);
  color: var(--gallery-cream);
}

.gallery-page .contact-footer .kicker {
  color: #f0b39f;
}

.gallery-page .contact-footer p:not(.kicker) {
  max-width: 520px;
  color: rgba(255, 250, 242, 0.66);
  font-size: 18px;
}

.gallery-page .contact-footer address {
  min-width: min(100%, 360px);
}

.gallery-page .contact-footer a {
  display: grid;
  gap: 2px;
  border-bottom-color: rgba(255, 250, 242, 0.18);
  color: var(--gallery-cream);
}

.gallery-page .contact-footer a:hover {
  color: #f0b39f;
}

.gallery-page .contact-footer small {
  color: rgba(255, 250, 242, 0.52);
  font-size: 11px;
  font-weight: 800;
  letter-spacing: 0;
  text-transform: uppercase;
}

.gallery-js [data-gallery-reveal] {
  opacity: 0;
  transform: translateY(34px);
  transition: opacity 700ms ease, transform 700ms ease;
}

.gallery-js [data-gallery-reveal].is-visible {
  opacity: 1;
  transform: translateY(0);
}

@supports (animation-timeline: view()) {
  .gallery-page .editorial-gallery figure,
  .gallery-page .gallery-spec-grid span,
  .gallery-page .brochure-panels article {
    animation: gallery-rise both;
    animation-range: entry 8% cover 32%;
    animation-timeline: view();
  }

  .gallery-cover__media img {
    animation: gallery-hero-drift both linear;
    animation-range: 0 72vh;
    animation-timeline: scroll(root);
  }
}

@keyframes gallery-rise {
  from {
    opacity: 0.46;
    transform: translateY(38px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

@keyframes gallery-hero-drift {
  to {
    transform: translate3d(0, 7vh, 0) scale(1.08);
  }
}

.location-page {
  --paper: #edf1ed;
  --accent: #285270;
  --ink: #132026;
}

.atlas-hero {
  display: grid;
  grid-template-columns: minmax(360px, 0.9fr) 1fr;
  gap: clamp(28px, 6vw, 90px);
  align-items: center;
  min-height: calc(100vh - 70px);
  padding: clamp(32px, 6vw, 86px);
}

.atlas-hero p:not(.kicker) {
  max-width: 620px;
  color: #536568;
  font-size: clamp(18px, 2vw, 24px);
}

.atlas-map {
  background:
    linear-gradient(90deg, transparent 49%, rgba(19, 32, 38, 0.11) 50%, transparent 51%) 0 0 / 112px 112px,
    linear-gradient(0deg, transparent 49%, rgba(19, 32, 38, 0.11) 50%, transparent 51%) 0 0 / 112px 112px,
    #fbfff8;
  box-shadow: var(--shadow);
}

.map-line {
  position: absolute;
  height: 4px;
  background: var(--accent);
  transform-origin: left center;
}

.line-one {
  left: 18%;
  top: 35%;
  width: 360px;
  transform: rotate(14deg);
}

.line-two {
  left: 28%;
  top: 62%;
  width: 310px;
  transform: rotate(-22deg);
}

.line-three {
  left: 43%;
  top: 18%;
  width: 420px;
  transform: rotate(78deg);
}

.map-label.savoy {
  left: 43%;
  top: 43%;
  background: var(--accent);
  color: white;
}

.map-label.covent {
  left: 14%;
  top: 20%;
}

.map-label.embankment {
  right: 10%;
  bottom: 20%;
}

.map-label.charing {
  left: 12%;
  bottom: 26%;
}

.map-label.strand {
  right: 12%;
  top: 24%;
}

.place-cards {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 1px;
  padding: 1px;
  background: var(--ink);
}

.place-cards article {
  background: #fbfff8;
}

.place-cards img {
  height: 420px;
  object-fit: cover;
}

.place-cards span,
.place-cards h2 {
  display: block;
  padding-inline: 24px;
}

.place-cards span {
  padding-top: 24px;
  color: var(--accent);
  font-size: 12px;
  font-weight: 800;
  letter-spacing: 0;
  text-transform: uppercase;
}

.place-cards h2 {
  padding-bottom: 28px;
  font-size: clamp(30px, 3vw, 48px);
}

.amenity-atlas {
  display: grid;
  grid-template-columns: minmax(280px, 0.65fr) 1fr;
  gap: clamp(28px, 6vw, 90px);
}

.amenity-list {
  display: grid;
  gap: 1px;
  background: var(--line);
}

.amenity-list p {
  margin: 0;
  padding: 22px;
  background: #fbfff8;
  color: #536568;
}

.amenity-list span {
  display: block;
  margin-bottom: 8px;
  color: var(--ink);
  font-weight: 800;
  letter-spacing: 0;
  text-transform: uppercase;
}

.journey-board {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 1px;
  padding: clamp(48px, 7vw, 108px) clamp(20px, 6vw, 88px);
  background: var(--ink);
}

.journey-board h2 {
  grid-column: span 4;
  color: #f3f7eb;
}

.journey-board div {
  min-height: 190px;
  padding: 22px;
  background: #20343c;
  color: #f3f7eb;
}

.journey-board strong {
  display: block;
  color: #9cc6d6;
  font-family: Georgia, "Times New Roman", serif;
  font-size: 70px;
  font-weight: 400;
  line-height: 0.9;
}

.journey-board span {
  display: block;
  margin-top: 14px;
  font-weight: 800;
  letter-spacing: 0;
  text-transform: uppercase;
}

.atlas-workplace {
  display: grid;
  grid-template-columns: minmax(280px, 0.58fr) 1fr;
  gap: clamp(28px, 6vw, 90px);
  align-items: start;
}

.atlas-workplace p:not(.kicker) {
  color: #536568;
  font-size: 18px;
}

.atlas-images {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}

.atlas-images img {
  height: 260px;
  object-fit: cover;
}

.atlas-images img:nth-child(3) {
  grid-column: span 2;
}

.location-specs {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 1px;
  padding: 1px;
  background: var(--ink);
}

.location-specs span {
  min-height: 116px;
  padding: 22px;
  background: #fbfff8;
  font-weight: 800;
  letter-spacing: 0;
  text-transform: uppercase;
}

.contact-footer {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(260px, 420px);
  gap: clamp(28px, 7vw, 104px);
  align-items: end;
  padding: clamp(48px, 7vw, 100px) clamp(20px, 6vw, 88px);
  border-top: 0;
  background: var(--ink);
  color: var(--white);
}

.contact-footer .kicker {
  color: color-mix(in srgb, var(--accent) 78%, var(--white));
}

.contact-footer h2 {
  max-width: 820px;
  margin-bottom: 0;
}

.contact-footer p:not(.kicker) {
  max-width: 620px;
  margin: 18px 0 0;
  color: rgba(255, 250, 242, 0.68);
  font-size: 18px;
}

.contact-footer address {
  display: grid;
  gap: 0;
  align-self: stretch;
  border-top: 1px solid rgba(255, 250, 242, 0.22);
  font-style: normal;
}

.contact-footer a {
  display: flex;
  justify-content: space-between;
  gap: 20px;
  align-items: center;
  min-height: 58px;
  padding: 16px 0;
  border-bottom: 1px solid rgba(255, 250, 242, 0.18);
  color: var(--white);
  text-decoration: none;
  font-weight: 800;
  transition: color 220ms ease, transform 220ms ease;
}

.contact-footer a::after {
  content: "Email";
  color: rgba(255, 250, 242, 0.52);
  font-size: 12px;
  font-weight: 800;
}

.contact-footer a:hover,
.contact-footer a:focus-visible {
  color: color-mix(in srgb, var(--accent) 72%, var(--white));
  transform: translateX(4px);
}

@media (max-width: 1120px) {
  .template-cards,
  .availability-board,
  .journey-board,
  .location-specs {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .journey-board h2 {
    grid-column: span 2;
  }

  .roll-grid,
  .editorial-gallery,
  .gallery-spec-grid,
  .workspace-arrival-images {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .workspace-media-wall {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .workspace-media-wall img,
  .workspace-media-wall img:nth-child(n) {
    grid-column: span 1;
  }
}

@media (max-width: 860px) {
  h1 {
    font-size: 64px;
  }

  h2 {
    font-size: 48px;
  }

  .hub-header,
  .site-top {
    position: static;
    grid-template-columns: 1fr;
  }

  .hub-nav,
  .site-top nav {
    justify-content: flex-start;
    overflow-x: visible;
    flex-wrap: nowrap;
    padding-bottom: 4px;
  }

  .top-cta {
    width: max-content;
  }

  .hub-hero,
  .workspace-hero,
  .atlas-hero,
  .chapter-split,
  .details-chapter,
  .floor-editorial,
  .spec-table,
  .occupier-section,
  .gallery-spec,
  .gallery-map,
  .amenity-atlas,
  .atlas-workplace,
  .magazine-intro,
  .workspace-arrival-editorial,
  .hub-selector,
  .section-heading,
  .contact-footer {
    grid-template-columns: 1fr;
  }

  .hub-hero,
  .workspace-hero,
  .atlas-hero {
    min-height: auto;
  }

  .stacked-media,
  .image-timeline,
  .full-image-gallery,
  .wide-facade,
  .place-cards,
  .atlas-images,
  .brochure-panels {
    grid-template-columns: 1fr;
  }

  .workspace-hero img,
  .heritage-hero img,
  .heritage-editorial-statement img,
  .stacked-media img,
  .stacked-media img:nth-child(2),
  .image-timeline img,
  .full-image-gallery img,
  .wide-facade img {
    height: auto;
    min-height: 0;
  }

  .hub-hero {
    padding-top: 44px;
  }

  .hub-hero-copy h1,
  .section-heading h2 {
    font-size: 58px;
  }

  .hub-selector,
  .selector-visual {
    min-height: 0;
  }

  .selector-visual img {
    height: 480px;
  }

  .template-card {
    min-height: 460px;
  }

  .heritage-title {
    position: relative;
    z-index: 2;
    padding: 28px;
    color: #fff8e8;
  }

  .heritage-hero {
    min-height: auto;
  }

  .floor-diagram,
  .technical-plan,
  .abstract-map,
  .atlas-map {
    min-height: 430px;
  }

  .brochure-panel dl,
  .gallery-map-points {
    grid-template-columns: 1fr;
  }

  .gallery-map__live {
    min-height: 460px;
  }

  .commute-table div {
    grid-template-columns: 1fr;
    gap: 6px;
  }
}

@media (max-width: 620px) {
  .hub-nav,
  .site-top nav {
    flex-wrap: wrap;
  }

  h1 {
    font-size: 48px;
  }

  .gallery-cover h1 {
    font-size: 44px;
    line-height: 1;
  }

  .template-cards,
  .hub-stat-grid,
  .availability-board,
  .journey-board,
  .location-specs,
  .roll-grid,
  .editorial-gallery,
  .gallery-spec-grid,
  .workspace-media-wall,
  .workspace-arrival-images {
    grid-template-columns: 1fr;
  }

  .hub-header,
  .site-top {
    gap: 14px;
  }

  .hub-nav a,
  .site-top nav a,
  .top-cta {
    min-height: 34px;
    padding: 8px 9px;
    font-size: 11px;
  }

  .hub-hero {
    padding-inline: 18px;
  }

  .hub-hero-copy h1 {
    font-size: 46px;
  }

  .hub-hero-copy p:not(.kicker) {
    font-size: 18px;
  }

  .hub-actions a {
    width: 100%;
  }

  .selector-visual img {
    height: 360px;
  }

  .selector-list a {
    min-height: auto;
  }

  .template-library {
    padding-inline: 14px;
  }

  .section-heading h2 {
    font-size: 42px;
  }

  .heritage-editorial-copy {
    padding: 64px 20px 48px;
  }

  .heritage-editorial-copy h2,
  .workspace-arrival-heading h2 {
    font-size: clamp(40px, 14vw, 58px);
  }

  .workspace-arrival-editorial {
    padding: 58px 18px 40px;
  }

  .workspace-arrival-images img {
    height: 330px;
  }

  .journey-board h2,
  .editorial-gallery .large,
  .editorial-gallery .wide {
    grid-column: span 1;
  }

  .editorial-gallery .large img {
    height: 420px;
  }

  .spec-mosaic {
    grid-template-columns: 1fr;
  }

  .connection-strip {
    grid-template-columns: 1fr 1fr;
  }

  .connection-strip div,
  .availability-board div,
  .journey-board div {
    min-height: 150px;
  }
}

@media (max-width: 900px) {
  .gallery-scroll-story {
    grid-template-columns: 1fr;
    padding-inline: clamp(16px, 5vw, 28px);
  }

  .story-media {
    position: relative;
    top: auto;
    display: grid;
    gap: 12px;
    min-height: 0;
    background: transparent;
    box-shadow: none;
  }

  .story-media figure,
  .story-media figure.is-active {
    position: relative;
    opacity: 1;
    transform: none;
  }

  .story-media img {
    height: clamp(320px, 62vw, 520px);
  }

  .story-copy {
    gap: 14px;
    padding-top: 0;
  }

  .story-copy article {
    min-height: auto;
  }

  .gallery-spec__intro {
    position: static;
  }
}

@media (max-width: 860px) {
  .gallery-page .site-top nav {
    overflow-x: auto;
  }

  .gallery-cover {
    min-height: 720px;
  }

  .gallery-cover__content {
    padding: 86px 24px 112px;
  }

  .gallery-scroll-cue {
    right: auto;
    left: 24px;
    bottom: 32px;
  }

  .gallery-spec,
  .gallery-map {
    align-items: stretch;
  }
}

@media (max-width: 620px) {
  .gallery-cover {
    min-height: 680px;
  }

  .gallery-cover__markers,
  .gallery-scroll-cue {
    width: calc(100% - 48px);
  }

  .gallery-cover__markers span,
  .gallery-scroll-cue {
    justify-content: space-between;
  }

  .story-media img,
  .editorial-gallery img,
  .editorial-gallery .large img {
    height: 340px;
  }

  .editorial-gallery figcaption {
    padding-left: 18px;
  }

  .editorial-gallery figcaption::before {
    display: none;
  }

  .gallery-spec-grid span {
    min-height: 112px;
  }

  .brochure-panels article {
    min-height: 380px;
  }

  .brochure-panel dl div,
  .brochure-panel li,
  .gallery-map-points span {
    min-height: 72px;
  }

  .gallery-map__live {
    min-height: 380px;
  }

  .abstract-map {
    min-height: 380px;
  }

  .map-route {
    display: none;
  }

  .node {
    min-width: 86px;
    padding: 8px 10px;
    font-size: 10px;
  }

  .node.savoy {
    left: 40%;
    top: 44%;
  }

  .node.garden {
    left: 7%;
  }

  .node.river {
    right: 6%;
  }

  .node.strand {
    right: 7%;
    top: 24%;
  }
}

/* Cinematic location template */
.location-cinema {
  --paper: #f4efe7;
  --ink: #fffaf2;
  --accent: #b8874a;
  --champagne: #d0a35d;
  --ivory: #fffaf2;
  --oxblood: #8e3f32;
  --deep-green: #20473d;
  --river-blue: #213f5d;
  --slate: #27343a;
  --obsidian: #171211;
  --soft-line: rgba(255, 250, 242, 0.16);
  --soft-glow: 0 24px 70px rgba(23, 18, 17, 0.32);
  background: var(--obsidian);
  color: var(--ivory);
  font-family: Inter, Arial, Helvetica, sans-serif;
}

.location-cinema::before {
  position: fixed;
  inset: 0;
  z-index: 60;
  pointer-events: none;
  content: "";
  opacity: 0.035;
  background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 300 300' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.78' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='300' height='300' filter='url(%23n)' opacity='.75'/%3E%3C/svg%3E");
}

.location-cinema main {
  overflow: hidden;
}

.location-cinema h1,
.location-cinema h2 {
  font-family: Inter, Arial, Helvetica, sans-serif;
  font-weight: 900;
  letter-spacing: 0;
}

.location-cinema h1 {
  max-width: 980px;
  margin-bottom: 24px;
  font-size: clamp(64px, 11vw, 156px);
  line-height: 0.86;
}

.location-cinema h1 span,
.location-cinema h1 em,
.location-cinema h2 em {
  display: block;
}

.location-cinema h1 em,
.location-cinema h2 em {
  color: var(--champagne);
  font-family: "Playfair Display", Georgia, serif;
  font-style: italic;
  font-weight: 400;
}

.location-cinema h2 {
  font-size: clamp(42px, 7vw, 96px);
  line-height: 0.92;
}

.location-kicker {
  margin: 0 0 16px;
  color: var(--champagne);
  font-family: "JetBrains Mono", monospace;
  font-size: 12px;
  font-weight: 700;
  letter-spacing: 0;
  text-transform: uppercase;
}

.location-island {
  position: fixed;
  top: 18px;
  left: 50%;
  z-index: 50;
  display: grid;
  grid-template-columns: auto 1fr auto;
  gap: 22px;
  align-items: center;
  width: min(1120px, calc(100% - 32px));
  min-height: 64px;
  padding: 10px 12px 10px 18px;
  border: 1px solid rgba(255, 250, 242, 0.2);
  border-radius: 999px;
  background: rgba(23, 18, 17, 0.44);
  color: var(--ivory);
  backdrop-filter: blur(22px);
  transform: translateX(-50%);
  transition: background 300ms ease, border-color 300ms ease, box-shadow 300ms ease;
}

.location-island.is-scrolled {
  border-color: rgba(184, 135, 74, 0.38);
  background: rgba(23, 18, 17, 0.86);
  box-shadow: 0 16px 60px rgba(23, 18, 17, 0.34);
}

.location-logo {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  text-decoration: none;
  font-size: 12px;
  font-weight: 900;
  letter-spacing: 0;
  text-transform: uppercase;
}

.location-logo span {
  display: grid;
  width: 36px;
  height: 36px;
  place-items: center;
  border-radius: 50%;
  background: var(--champagne);
  color: var(--obsidian);
  font-family: "Playfair Display", Georgia, serif;
  font-size: 24px;
  font-style: italic;
  font-weight: 400;
  letter-spacing: 0;
}

.location-island nav {
  display: flex;
  justify-content: center;
  gap: 4px;
}

.location-island nav a {
  padding: 10px 12px;
  border-radius: 999px;
  color: rgba(255, 250, 242, 0.72);
  text-decoration: none;
  font-size: 11px;
  font-weight: 800;
  letter-spacing: 0;
  text-transform: uppercase;
  transition: transform 260ms ease, color 260ms ease, background 260ms ease;
}

.location-island nav a:hover,
.location-island nav a[aria-current="page"] {
  background: rgba(255, 250, 242, 0.11);
  color: var(--ivory);
  transform: translateY(-1px);
}

.magnetic-btn {
  position: relative;
  display: inline-flex;
  min-height: 54px;
  align-items: center;
  justify-content: center;
  overflow: hidden;
  padding: 0 24px;
  border: 1px solid rgba(184, 135, 74, 0.62);
  border-radius: 999px;
  background: var(--champagne);
  color: var(--obsidian);
  text-decoration: none;
  font-size: 12px;
  font-weight: 900;
  letter-spacing: 0;
  text-transform: uppercase;
  transition: transform 360ms cubic-bezier(0.25, 0.46, 0.45, 0.94), color 360ms ease;
}

.magnetic-btn span {
  position: absolute;
  inset: 0;
  background: #f3e4cc;
  transform: translateX(-102%);
  transition: transform 360ms cubic-bezier(0.25, 0.46, 0.45, 0.94);
}

.magnetic-btn:hover {
  color: var(--obsidian);
  transform: scale(1.03);
}

.magnetic-btn:hover span {
  transform: translateX(0);
}

.magnetic-btn::after {
  position: relative;
  content: attr(data-label);
}

.magnetic-btn.small {
  min-height: 40px;
  padding-inline: 18px;
  font-size: 11px;
}

.magnetic-btn {
  isolation: isolate;
}

.magnetic-btn:not([data-label]) {
  gap: 0;
}

.magnetic-btn > span + * {
  position: relative;
  z-index: 1;
}

.location-opening {
  position: relative;
  display: flex;
  min-height: 100dvh;
  align-items: flex-end;
  padding: clamp(118px, 15vh, 180px) clamp(22px, 7vw, 104px) clamp(48px, 9vh, 96px);
  background: var(--obsidian);
}

.location-opening > img,
.location-opening__shade {
  position: absolute;
  inset: 0;
}

.location-opening > img {
  height: 100%;
  object-fit: cover;
  opacity: 0.72;
}

.location-opening__shade {
  background:
    linear-gradient(90deg, rgba(23, 18, 17, 0.96) 0%, rgba(23, 18, 17, 0.62) 44%, rgba(33, 63, 93, 0.18) 100%),
    linear-gradient(0deg, rgba(23, 18, 17, 0.96) 0%, rgba(23, 18, 17, 0.42) 48%, rgba(32, 71, 61, 0.24) 100%);
}

.location-opening__content {
  position: relative;
  z-index: 1;
  max-width: 1040px;
}

.location-opening__content p:not(.location-kicker) {
  max-width: 680px;
  margin-bottom: 32px;
  color: rgba(255, 250, 242, 0.78);
  font-size: clamp(18px, 2vw, 24px);
}

.hero-status {
  position: absolute;
  right: clamp(22px, 5vw, 72px);
  bottom: clamp(28px, 6vh, 76px);
  z-index: 2;
  display: flex;
  gap: 10px;
  align-items: center;
  padding: 14px 18px;
  border: 1px solid rgba(255, 250, 242, 0.18);
  border-radius: 999px;
  background: rgba(23, 18, 17, 0.56);
  backdrop-filter: blur(16px);
  font-family: "JetBrains Mono", monospace;
  font-size: 11px;
  letter-spacing: 0;
  text-transform: uppercase;
}

.hero-status span {
  width: 9px;
  height: 9px;
  border-radius: 50%;
  background: #48d36d;
  box-shadow: 0 0 0 8px rgba(72, 211, 109, 0.12);
  animation: pulse-dot 1.8s ease-in-out infinite;
}

.feed-card .micro-head i {
  position: relative;
  display: inline-block;
  width: 18px;
  height: 18px;
  border: 1px solid var(--champagne);
  border-radius: 50%;
  background: transparent;
}

.feed-card .micro-head i::after {
  position: absolute;
  inset: 6px;
  content: "";
  border-radius: 50%;
  background: var(--champagne);
}

.section-intro {
  display: grid;
  grid-template-columns: minmax(420px, 1fr) minmax(280px, 0.48fr);
  gap: clamp(24px, 6vw, 90px);
  align-items: end;
  margin-bottom: clamp(26px, 5vw, 58px);
}

.section-intro .location-kicker {
  grid-column: 1 / -1;
  margin-bottom: -8px;
}

.section-intro p:last-child {
  color: rgba(255, 250, 242, 0.64);
  font-size: 18px;
}

.amenity-engine .section-intro {
  align-items: start;
}

.location-intel,
.amenity-engine,
.location-start {
  padding: clamp(60px, 10vw, 144px) clamp(20px, 6vw, 88px);
}

.intel-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: clamp(18px, 2.4vw, 30px);
}

.micro-card,
.address-protocol article,
.amenity-columns article,
.location-start,
.location-footer {
  border: 1px solid var(--soft-line);
  border-radius: 10px;
  background: rgba(255, 250, 242, 0.065);
  box-shadow: var(--soft-glow);
}

.micro-card {
  min-height: 460px;
  padding: clamp(26px, 3vw, 38px);
}

.micro-head {
  display: flex;
  justify-content: space-between;
  gap: 18px;
  align-items: center;
  margin-bottom: 34px;
  font-size: 12px;
  font-weight: 800;
  letter-spacing: 0;
  text-transform: uppercase;
}

.micro-head span {
  color: var(--champagne);
}

.micro-head strong {
  display: inline-flex;
  gap: 10px;
  align-items: center;
}

.micro-head .icon-pin,
.micro-head .icon-grid,
.micro-head .icon-rail {
  position: relative;
  display: inline-block;
  flex: 0 0 auto;
  width: 18px;
  height: 18px;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
  animation: none;
}

.micro-head .icon-pin::before {
  position: absolute;
  left: 5px;
  top: 2px;
  width: 8px;
  height: 8px;
  content: "";
  border: 2px solid var(--champagne);
  border-radius: 50% 50% 50% 0;
  transform: rotate(-45deg);
}

.micro-head .icon-pin::after {
  position: absolute;
  left: 8px;
  bottom: 1px;
  width: 2px;
  height: 6px;
  content: "";
  background: var(--champagne);
}

.micro-head .icon-grid {
  background:
    linear-gradient(var(--champagne), var(--champagne)) 0 0 / 7px 7px no-repeat,
    linear-gradient(var(--champagne), var(--champagne)) 11px 0 / 7px 7px no-repeat,
    linear-gradient(var(--champagne), var(--champagne)) 0 11px / 7px 7px no-repeat,
    linear-gradient(var(--champagne), var(--champagne)) 11px 11px / 7px 7px no-repeat;
}

.micro-head .icon-rail::before,
.micro-head .icon-rail::after {
  position: absolute;
  content: "";
  border-radius: 999px;
  background: var(--champagne);
}

.micro-head .icon-rail::before {
  left: 1px;
  right: 1px;
  top: 5px;
  height: 3px;
  box-shadow: 0 6px 0 var(--champagne);
}

.micro-head .icon-rail::after {
  left: 4px;
  top: 1px;
  width: 3px;
  height: 16px;
  box-shadow: 8px 0 0 var(--champagne);
  opacity: 0.82;
}

.arrival-map {
  position: relative;
  height: 216px;
  margin-bottom: 34px;
  overflow: hidden;
  border: 1px solid rgba(255, 250, 242, 0.16);
  border-radius: 8px;
  background: #221b1a;
  isolation: isolate;
}

.arrival-map img,
.arrival-map::after,
.arrival-map svg {
  position: absolute;
  inset: 0;
}

.arrival-map img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  opacity: 0.38;
  filter: saturate(0.82) contrast(1.14);
  transform: scale(1.06);
  animation: arrival-image-drift 12s ease-in-out infinite alternate;
}

.arrival-map::after {
  z-index: 1;
  content: "";
  background:
    radial-gradient(circle at 26% 68%, rgba(202, 154, 99, 0.34), transparent 24%),
    linear-gradient(120deg, rgba(23, 18, 17, 0.82) 0%, rgba(23, 18, 17, 0.42) 48%, rgba(21, 45, 51, 0.62) 100%);
}

.arrival-map svg {
  z-index: 2;
  width: 100%;
  height: 100%;
  overflow: visible;
}

.arrival-route {
  fill: none;
  stroke-linecap: round;
  stroke-width: 4;
}

.arrival-route--soft {
  stroke: rgba(255, 250, 242, 0.22);
}

.arrival-route--live {
  stroke: var(--champagne);
  stroke-dasharray: 76 220;
  animation: arrival-route-draw 4.8s ease-in-out infinite;
}

.arrival-pin {
  position: absolute;
  z-index: 3;
  display: inline-flex;
  max-width: min(176px, 46%);
  min-width: 0;
  align-items: center;
  gap: 8px;
  padding: 8px 10px;
  border: 1px solid rgba(255, 250, 242, 0.2);
  border-radius: 999px;
  background: rgba(23, 18, 17, 0.74);
  color: rgba(255, 250, 242, 0.9);
  font-family: "JetBrains Mono", monospace;
  font-size: 10px;
  font-weight: 700;
  line-height: 1.2;
  text-transform: uppercase;
  white-space: normal;
  overflow-wrap: anywhere;
  backdrop-filter: blur(12px);
  box-shadow: 0 16px 30px rgba(0, 0, 0, 0.22);
  transition: opacity 420ms ease, transform 420ms ease, background 420ms ease, color 420ms ease;
}

.arrival-pin::before {
  flex: 0 0 auto;
  width: 7px;
  height: 7px;
  content: "";
  border-radius: 50%;
  background: currentColor;
  box-shadow: 0 0 0 6px rgba(202, 154, 99, 0.14);
}

.arrival-pin--building {
  left: 11%;
  bottom: 18%;
  background: var(--champagne);
  color: var(--obsidian);
}

.arrival-pin--embankment {
  left: 45%;
  top: 45%;
}

.arrival-pin--charing {
  right: 9%;
  top: 17%;
}

.arrival-pin--covent {
  right: 12%;
  bottom: 16%;
}

.arrival-pin.is-active {
  background: var(--champagne);
  color: var(--obsidian);
  transform: translateY(-4px);
}

.arrival-pin:not(.is-active):not(.arrival-pin--building) {
  opacity: 0.68;
}

.shuffle-stack {
  position: relative;
  height: 216px;
  margin-bottom: 34px;
}

.shuffle-stack div {
  position: absolute;
  inset: 0;
  display: grid;
  place-items: center;
  border: 1px solid rgba(255, 250, 242, 0.16);
  border-radius: 8px;
  background: #221b1a;
  color: var(--ivory);
  font-family: "Playfair Display", Georgia, serif;
  font-size: clamp(22px, 2.6vw, 34px);
  font-weight: 400;
  text-align: center;
  transition: transform 620ms cubic-bezier(0.34, 1.56, 0.64, 1), opacity 420ms ease;
}

.shuffle-stack div:nth-child(1) {
  transform: translateY(0) scale(1);
}

.shuffle-stack div:nth-child(2) {
  opacity: 0.76;
  transform: translateY(22px) scale(0.94);
}

.shuffle-stack div:nth-child(3) {
  opacity: 0.48;
  transform: translateY(44px) scale(0.88);
}

.micro-card p {
  color: rgba(255, 250, 242, 0.68);
  font-size: 17px;
}

.telemetry {
  display: grid;
  gap: 14px;
  min-height: 216px;
  margin-bottom: 34px;
  padding: 24px;
  border: 1px solid rgba(255, 250, 242, 0.14);
  border-radius: 8px;
  background: #1d1717;
  color: var(--ivory);
  font-size: 17px;
  line-height: 1.45;
}

.amenity-notes span {
  display: grid;
  gap: 4px;
  padding-bottom: 14px;
  border-bottom: 1px solid rgba(255, 250, 242, 0.1);
}

.amenity-notes span:last-child {
  padding-bottom: 0;
  border-bottom: 0;
}

.amenity-notes strong {
  color: var(--champagne);
  font-family: "Playfair Display", Georgia, serif;
  font-size: 30px;
  font-style: italic;
  font-weight: 400;
  line-height: 1;
}

.week-grid {
  position: relative;
  display: grid;
  grid-template-columns: repeat(5, 1fr);
  gap: 10px;
  margin-bottom: 34px;
  padding: 20px;
  overflow: hidden;
  border: 1px solid rgba(255, 250, 242, 0.14);
  border-radius: 8px;
  background: #1b191a;
}

.week-grid::before {
  position: absolute;
  inset: 0;
  content: "";
  background: linear-gradient(90deg, transparent 0%, rgba(202, 154, 99, 0.14) 42%, transparent 72%);
  opacity: 0.72;
  transform: translateX(-100%);
  animation: week-scan 4.8s ease-in-out infinite;
}

.week-grid span,
.week-grid button {
  position: relative;
  z-index: 1;
  min-width: 0;
  min-height: 54px;
  border: 1px solid rgba(255, 250, 242, 0.12);
  border-radius: 6px;
  background: rgba(255, 250, 242, 0.055);
  color: var(--ivory);
  font-weight: 700;
  overflow-wrap: anywhere;
}

.week-grid span {
  display: grid;
  place-items: center;
  color: rgba(255, 250, 242, 0.52);
  font-size: 12px;
}

.week-grid button {
  transition: background 320ms ease, border-color 320ms ease, color 320ms ease, transform 320ms ease, box-shadow 320ms ease;
}

.week-grid button.is-active {
  border-color: rgba(202, 154, 99, 0.66);
  background: var(--champagne);
  color: var(--obsidian);
  box-shadow: 0 12px 24px rgba(0, 0, 0, 0.22);
  transform: translateY(-3px);
}

.week-grid svg {
  position: absolute;
  z-index: 2;
  top: 45%;
  left: 12%;
  width: 40px;
  fill: var(--ivory);
  opacity: 0.66;
  filter: drop-shadow(0 10px 18px rgba(0, 0, 0, 0.28));
  animation: week-cursor 6s cubic-bezier(0.42, 0, 0.2, 1) infinite;
}

.location-manifesto {
  position: relative;
  display: grid;
  min-height: 78vh;
  place-items: center;
  padding: clamp(64px, 12vw, 160px) clamp(22px, 10vw, 150px);
  overflow: hidden;
  background: #181312;
}

.location-manifesto img {
  position: absolute;
  inset: 0;
  height: 120%;
  object-fit: cover;
  opacity: 0.22;
  filter: grayscale(0.25) contrast(1.1);
  animation: slow-drift 18s ease-in-out infinite alternate;
}

.location-manifesto div {
  position: relative;
  z-index: 1;
  max-width: 1060px;
}

.location-manifesto p {
  color: rgba(255, 250, 242, 0.62);
  font-size: clamp(22px, 3vw, 38px);
}

.address-protocol {
  display: grid;
  gap: 22px;
  padding: clamp(60px, 10vw, 140px) clamp(20px, 6vw, 88px);
  background:
    linear-gradient(180deg, #171211 0%, #1e2d28 48%, #172535 100%);
}

.address-protocol article {
  position: sticky;
  top: 104px;
  display: grid;
  grid-template-columns: minmax(280px, 0.72fr) 1fr;
  gap: clamp(24px, 6vw, 86px);
  align-items: center;
  min-height: 72vh;
  padding: clamp(26px, 5vw, 64px);
}

.address-protocol article:nth-child(2) {
  top: 122px;
}

.address-protocol article:nth-child(3) {
  top: 140px;
}

.address-protocol article > p:last-child {
  grid-column: 2;
  max-width: 640px;
  color: rgba(255, 250, 242, 0.68);
  font-size: 18px;
}

.protocol-visual {
  position: relative;
  grid-row: 1 / 4;
  min-height: 360px;
  overflow: hidden;
  border: 1px solid rgba(255, 250, 242, 0.14);
  border-radius: 10px;
  background:
    linear-gradient(90deg, transparent 49%, rgba(255, 250, 242, 0.06) 50%, transparent 51%) 0 0 / 42px 42px,
    linear-gradient(0deg, transparent 49%, rgba(255, 250, 242, 0.06) 50%, transparent 51%) 0 0 / 42px 42px,
    #1c1716;
}

.orbit span {
  position: absolute;
  inset: 25%;
  border: 1px solid rgba(184, 135, 74, 0.62);
  border-radius: 48% 52% 44% 56%;
  animation: orbit-spin 10s linear infinite;
}

.orbit span:nth-child(2) {
  inset: 34% 18%;
  animation-duration: 14s;
  animation-direction: reverse;
}

.orbit span:nth-child(3) {
  inset: 18% 36%;
  animation-duration: 18s;
}

.scan::after {
  position: absolute;
  inset: 14%;
  content: "";
  border-radius: 8px;
  background-image: radial-gradient(circle, rgba(255, 250, 242, 0.32) 2px, transparent 2px);
  background-size: 24px 24px;
}

.scan span {
  position: absolute;
  left: 10%;
  right: 10%;
  top: 20%;
  z-index: 2;
  height: 3px;
  background: var(--champagne);
  box-shadow: 0 0 24px rgba(184, 135, 74, 0.82);
  animation: scan-line 3.4s ease-in-out infinite;
}

.wave {
  display: grid;
  place-items: center;
}

.wave svg {
  width: 82%;
}

.wave path {
  fill: none;
  stroke: var(--champagne);
  stroke-width: 5;
  stroke-linecap: round;
  stroke-dasharray: 520;
  animation: wave-draw 2.8s ease-in-out infinite;
}

.amenity-engine {
  background: var(--paper);
  color: #201716;
}

.amenity-engine .section-intro p:last-child {
  color: rgba(32, 23, 22, 0.64);
}

.amenity-columns {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: clamp(18px, 2.4vw, 30px);
}

.amenity-columns article {
  position: relative;
  min-height: 360px;
  padding: clamp(28px, 3vw, 40px);
  background: #fffaf2;
  color: #201716;
  box-shadow: 0 18px 46px rgba(32, 23, 22, 0.08);
}

.amenity-columns i {
  display: block;
  width: 34px;
  height: 34px;
  margin-bottom: 32px;
  border: 1px solid rgba(32, 23, 22, 0.28);
  background:
    linear-gradient(90deg, transparent 48%, currentColor 49% 51%, transparent 52%),
    linear-gradient(0deg, transparent 48%, currentColor 49% 51%, transparent 52%);
  color: var(--accent);
}

.amenity-columns article:nth-child(2) i {
  color: var(--oxblood);
  transform: rotate(45deg);
}

.amenity-columns article:nth-child(3) i {
  color: var(--deep-green);
}

.amenity-columns article:nth-child(4) i {
  color: var(--river-blue);
}

.amenity-columns span {
  display: block;
  margin-bottom: 26px;
  color: var(--oxblood);
  font-family: "JetBrains Mono", monospace;
  font-size: 12px;
  font-weight: 700;
  letter-spacing: 0;
  text-transform: uppercase;
}

.amenity-columns p {
  color: rgba(32, 23, 22, 0.68);
  font-size: 16px;
}

.journey-matrix {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 12px;
  padding: clamp(58px, 10vw, 132px) clamp(20px, 6vw, 88px);
  background: #171211;
}

.journey-matrix h2 {
  grid-column: span 4;
  margin-bottom: 30px;
}

.journey-matrix div {
  min-height: 230px;
  padding: 24px;
  border: 1px solid rgba(255, 250, 242, 0.1);
  border-radius: 8px;
  background: rgba(255, 250, 242, 0.055);
}

.journey-matrix small {
  display: block;
  margin-bottom: 22px;
  color: rgba(255, 250, 242, 0.52);
  font-family: "JetBrains Mono", monospace;
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0;
  text-transform: uppercase;
}

.journey-matrix strong {
  display: block;
  color: var(--champagne);
  font-family: "Playfair Display", Georgia, serif;
  font-size: clamp(70px, 8vw, 116px);
  font-style: italic;
  font-weight: 400;
  line-height: 0.9;
}

.journey-matrix span {
  display: block;
  margin-top: 26px;
  font-family: "JetBrains Mono", monospace;
  font-size: 12px;
  font-weight: 700;
  letter-spacing: 0;
  text-transform: uppercase;
}

.location-archive {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 12px;
  padding: 12px;
  background: #171211;
}

.location-archive figure {
  position: relative;
  min-height: 380px;
  margin: 0;
  overflow: hidden;
  border-radius: 8px;
  background: #211a19;
}

.location-archive .archive-large {
  grid-column: span 2;
  grid-row: span 2;
}

.location-archive img {
  height: 100%;
  object-fit: cover;
  transition: transform 600ms ease;
}

.location-archive figure:hover img {
  transform: scale(1.04);
}

.location-archive figcaption {
  position: absolute;
  left: 18px;
  right: 18px;
  bottom: 18px;
  padding: 14px 16px;
  border: 1px solid rgba(255, 250, 242, 0.16);
  border-radius: 999px;
  background: rgba(23, 18, 17, 0.64);
  backdrop-filter: blur(14px);
  font-family: "JetBrains Mono", monospace;
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0;
  text-transform: uppercase;
}

.location-start {
  display: grid;
  grid-template-columns: minmax(260px, 0.9fr) auto;
  gap: 28px;
  align-items: end;
  margin: clamp(56px, 8vw, 100px) clamp(20px, 6vw, 88px);
  padding: clamp(34px, 6vw, 72px);
}

.location-start p:not(.location-kicker) {
  max-width: 640px;
  color: rgba(255, 250, 242, 0.68);
  font-size: 18px;
}

.location-footer {
  display: grid;
  grid-template-columns: 1fr minmax(240px, 360px);
  gap: 32px;
  align-items: end;
  margin-top: clamp(44px, 8vw, 100px);
  padding: clamp(48px, 7vw, 96px) clamp(20px, 6vw, 88px);
  border-right: 0;
  border-bottom: 0;
  border-left: 0;
  border-radius: 0;
  background:
    linear-gradient(90deg, rgba(32, 71, 61, 0.28), transparent 40%),
    #120f0e;
}

.location-footer p:not(.location-kicker) {
  max-width: 520px;
  color: rgba(255, 250, 242, 0.64);
}

.location-footer address {
  display: grid;
  gap: 10px;
  font-style: normal;
}

.location-footer a {
  display: grid;
  gap: 3px;
  padding: 16px 0;
  border-bottom: 1px solid var(--soft-line);
  color: var(--ivory);
  text-decoration: none;
  font-weight: 800;
  transition: color 260ms ease, transform 260ms ease;
}

.location-footer a:hover {
  color: var(--champagne);
  transform: translateY(-1px);
}

.location-footer small {
  color: rgba(255, 250, 242, 0.52);
  font-family: "JetBrains Mono", monospace;
  font-size: 11px;
  letter-spacing: 0;
  text-transform: uppercase;
}

@keyframes pulse-dot {
  50% {
    box-shadow: 0 0 0 12px rgba(72, 211, 109, 0);
  }
}

@keyframes blink {
  50% {
    opacity: 0;
  }
}

@keyframes cursor-route {
  0%, 100% {
    transform: translate(-24px, -30px) scale(1);
  }
  38% {
    transform: translate(34px, 36px) scale(1);
  }
  46% {
    transform: translate(34px, 36px) scale(0.9);
  }
  70% {
    transform: translate(110px, 36px) scale(1);
  }
}

@keyframes arrival-image-drift {
  from {
    transform: scale(1.06) translate3d(-1.5%, -1%, 0);
  }
  to {
    transform: scale(1.13) translate3d(1.5%, 1%, 0);
  }
}

@keyframes arrival-route-draw {
  0% {
    stroke-dashoffset: 282;
  }
  52% {
    stroke-dashoffset: 0;
  }
  100% {
    stroke-dashoffset: -282;
  }
}

@keyframes week-scan {
  0%, 12% {
    transform: translateX(-100%);
  }
  70%, 100% {
    transform: translateX(100%);
  }
}

@keyframes week-cursor {
  0%, 12% {
    transform: translate(0, -14px) rotate(-7deg);
  }
  28% {
    transform: translate(56px, 48px) rotate(-3deg);
  }
  44% {
    transform: translate(118px, 48px) rotate(2deg);
  }
  60% {
    transform: translate(178px, 48px) rotate(-4deg);
  }
  76%, 100% {
    transform: translate(238px, 48px) rotate(3deg);
  }
}

@keyframes slow-drift {
  from {
    transform: translateY(-6%);
  }
  to {
    transform: translateY(0);
  }
}

@keyframes orbit-spin {
  to {
    transform: rotate(360deg);
  }
}

@keyframes scan-line {
  0%, 100% {
    top: 18%;
  }
  50% {
    top: 82%;
  }
}

@keyframes wave-draw {
  from {
    stroke-dashoffset: 520;
  }
  to {
    stroke-dashoffset: -520;
  }
}

@media (max-width: 1080px) {
  .intel-grid,
  .amenity-columns,
  .journey-matrix,
  .location-archive {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .journey-matrix h2 {
    grid-column: span 2;
  }
}

@media (max-width: 820px) {
  .location-island {
    position: absolute;
    grid-template-columns: 1fr;
    border-radius: 30px;
  }

  .location-island nav {
    justify-content: flex-start;
    flex-wrap: wrap;
  }

  .location-island .magnetic-btn {
    width: max-content;
  }

  .location-cinema h1 {
    font-size: clamp(56px, 16vw, 86px);
  }

  .location-cinema h2 {
    font-size: clamp(40px, 12vw, 64px);
  }

  .hero-status {
    position: relative;
    right: auto;
    bottom: auto;
    width: max-content;
    margin-top: 24px;
  }

  .section-intro,
  .address-protocol article,
  .location-start,
  .location-footer {
    grid-template-columns: 1fr;
  }

  .section-intro .location-kicker,
  .address-protocol article > p:last-child {
    grid-column: auto;
  }

  .address-protocol article {
    position: relative;
    top: auto;
    min-height: auto;
  }

  .protocol-visual {
    grid-row: auto;
    min-height: 280px;
  }
}

@media (max-width: 620px) {
  .location-opening {
    padding-top: 244px;
  }

  .intel-grid,
  .amenity-columns,
  .journey-matrix,
  .location-archive {
    grid-template-columns: 1fr;
  }

  .journey-matrix h2,
  .location-archive .archive-large {
    grid-column: span 1;
  }

  .location-archive .archive-large {
    grid-row: span 1;
  }

  .micro-card {
    min-height: auto;
  }

  .arrival-pin {
    max-width: 58%;
    font-size: 9px;
  }

  .journey-matrix div {
    min-height: 170px;
  }

  .location-archive figure {
    min-height: 320px;
  }
}

/* Final integration polish */
h1 {
  font-size: clamp(3.75rem, 9vw, 7.75rem);
}

h2 {
  font-size: clamp(2.75rem, 6vw, 5.25rem);
}

.heritage-ledger,
.workspace-chip-row,
.editorial-markers,
.statement-details,
.floor-chips,
.plan-benefits {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.heritage-ledger {
  max-width: 720px;
  margin: 30px 0 0;
  padding: 1px;
  background: rgba(255, 248, 232, 0.24);
}

.heritage-ledger div {
  min-width: 150px;
  flex: 1;
  padding: 14px 16px;
  background: rgba(32, 26, 22, 0.48);
  backdrop-filter: blur(12px);
}

.heritage-ledger dt,
.heritage-ledger dd {
  margin: 0;
}

.heritage-ledger dt {
  margin-bottom: 10px;
  color: rgba(255, 248, 232, 0.62);
  font-size: 11px;
  font-weight: 800;
  text-transform: uppercase;
}

.heritage-ledger dd {
  color: #fff8e8;
  font-family: Georgia, "Times New Roman", serif;
  font-size: 24px;
  line-height: 1;
}

.chapter-copy p:not(.kicker),
.location-roll > p:not(.kicker),
.workspace-copy-panel p:not(.kicker),
.table-heading p:not(.kicker),
.occupier-section > div > p {
  max-width: 620px;
  color: var(--muted);
  font-size: 18px;
}

.editorial-markers {
  margin: 28px 0 0;
  padding: 0;
  list-style: none;
}

.editorial-markers li,
.statement-details span,
.floor-chips span,
.workspace-chip-row span,
.plan-benefits span {
  min-height: 34px;
  padding: 8px 11px;
  border: 1px solid color-mix(in srgb, var(--accent) 42%, var(--line));
  background: color-mix(in srgb, var(--paper) 82%, white);
  color: color-mix(in srgb, var(--ink) 82%, var(--accent));
  font-size: 12px;
  font-weight: 800;
  line-height: 1.2;
  text-transform: uppercase;
}

.stacked-media figure,
.image-timeline figure,
.workspace-media-wall figure {
  position: relative;
  min-width: 0;
  margin: 0;
  overflow: hidden;
  background: var(--ink);
}

.stacked-media figure:nth-child(2) {
  align-self: end;
}

.stacked-media figure:nth-child(2) img {
  height: 460px;
}

.stacked-media figcaption,
.image-timeline figcaption,
.workspace-media-wall figcaption {
  position: absolute;
  left: 14px;
  right: 14px;
  bottom: 14px;
  z-index: 1;
  padding: 10px 12px;
  background: rgba(21, 24, 23, 0.72);
  color: var(--white);
  font-size: 11px;
  font-weight: 800;
  line-height: 1.2;
  text-transform: uppercase;
  backdrop-filter: blur(12px);
}

.image-timeline figure::before,
.workspace-media-wall figure::before {
  position: absolute;
  left: 14px;
  top: 14px;
  z-index: 1;
  width: 10px;
  height: 10px;
  content: "";
  background: var(--accent);
  box-shadow: 13px 0 0 var(--gold);
}

.statement-details {
  max-width: 1120px;
  margin: 34px auto 0;
}

.statement-details span {
  border-color: rgba(248, 240, 221, 0.26);
  background: rgba(248, 240, 221, 0.08);
  color: #f8f0dd;
}

.spec-mosaic li {
  display: grid;
  gap: 10px;
  align-content: space-between;
}

.spec-symbols li {
  position: relative;
  min-height: 128px;
  padding-top: 58px;
}

.spec-symbols li::before {
  position: absolute;
  left: 18px;
  top: 18px;
  display: grid;
  width: 34px;
  height: 34px;
  place-items: center;
  border: 1px solid color-mix(in srgb, var(--accent) 42%, var(--line));
  background: color-mix(in srgb, var(--paper) 72%, white);
  color: var(--accent);
  content: attr(data-symbol);
  font-size: 10px;
  font-weight: 900;
  line-height: 1;
  text-transform: uppercase;
}

.spec-mosaic li span {
  color: var(--accent);
  font-size: 11px;
  font-weight: 800;
  text-transform: uppercase;
}

.spec-mosaic li strong {
  color: var(--ink);
  font-size: 16px;
  line-height: 1.25;
}

.lombard-spec-section {
  align-items: start;
  background:
    linear-gradient(135deg, rgba(143, 73, 61, 0.09), transparent 42%),
    var(--surface-strong, #fff8ec);
}

.lombard-spec-section .chapter-copy {
  position: sticky;
  top: 112px;
}

.lombard-spec-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: clamp(10px, 1.6vw, 16px);
  margin: 0;
  padding: 0;
  list-style: none;
}

.lombard-spec-grid li {
  display: grid;
  grid-template-columns: 56px minmax(0, 1fr);
  grid-template-rows: auto auto 1fr;
  gap: 6px 16px;
  min-height: 156px;
  padding: clamp(16px, 2vw, 22px);
  border: 1px solid var(--line, rgba(36, 27, 23, 0.14));
  border-radius: 8px;
  background:
    linear-gradient(145deg, rgba(255, 248, 236, 0.86), rgba(232, 224, 211, 0.78)),
    var(--surface, var(--paper));
  color: var(--ink);
  box-shadow: 0 18px 42px rgba(36, 27, 23, 0.08);
}

.lombard-spec-grid .spec-icon {
  display: grid;
  grid-row: 1 / 4;
  width: 56px;
  height: 56px;
  place-items: center;
  border: 1px solid color-mix(in srgb, var(--accent) 38%, var(--line));
  border-radius: 8px;
  background: var(--ink);
  color: var(--ivory);
}

.lombard-spec-grid svg {
  width: 30px;
  height: 30px;
  fill: none;
  stroke: currentColor;
  stroke-linecap: round;
  stroke-linejoin: round;
  stroke-width: 1.7;
}

.lombard-spec-grid li > span:not(.spec-icon) {
  color: var(--accent);
  font-size: 11px;
  font-weight: 900;
  line-height: 1.1;
  text-transform: uppercase;
}

.lombard-spec-grid strong {
  color: var(--ink);
  font-size: clamp(17px, 1.5vw, 21px);
  line-height: 1.12;
}

.lombard-spec-grid small {
  max-width: 24ch;
  align-self: end;
  color: var(--muted);
  font-size: 0.86rem;
  line-height: 1.35;
}

.floor-chips {
  max-width: 560px;
  margin-top: 26px;
}

.zone strong {
  display: block;
  margin-bottom: 4px;
  color: var(--accent);
  font-family: Georgia, "Times New Roman", serif;
  font-size: 28px;
  font-weight: 400;
  line-height: 1;
}

.roll-grid article {
  min-height: 180px;
  margin: 0;
  padding: 22px;
  background: var(--paper);
  color: var(--muted);
}

.roll-grid article strong {
  display: block;
  margin-bottom: 10px;
  color: var(--ink);
  text-transform: uppercase;
}

.workspace-hero {
  grid-template-columns: minmax(0, 0.78fr) minmax(0, 0.95fr);
}

.workspace-hero-card {
  position: relative;
  margin: 0;
  overflow: hidden;
  background: var(--ink);
  box-shadow: var(--shadow);
}

.workspace-hero-card img {
  box-shadow: none;
}

.workspace-hero-card figcaption {
  position: absolute;
  left: 18px;
  right: 18px;
  bottom: 18px;
  padding: 12px 14px;
  background: rgba(17, 29, 29, 0.74);
  color: #eff7f3;
  font-size: 12px;
  font-weight: 800;
  text-transform: uppercase;
  backdrop-filter: blur(14px);
}

.workspace-chip-row {
  max-width: 620px;
  margin-top: 30px;
}

.workspace-chip-row span,
.plan-benefits span {
  border-color: rgba(23, 97, 106, 0.26);
  background: rgba(255, 255, 255, 0.64);
  color: #154f55;
}

.availability-board div {
  position: relative;
  overflow: hidden;
}

.availability-board div::before {
  position: absolute;
  right: 18px;
  top: 18px;
  display: grid;
  width: 42px;
  height: 42px;
  place-items: center;
  border: 1px solid rgba(23, 97, 106, 0.22);
  color: rgba(23, 97, 106, 0.56);
  content: attr(data-icon);
  font-family: Georgia, "Times New Roman", serif;
  font-size: 20px;
}

.plan-benefits {
  margin-top: 28px;
}

.rows p {
  position: relative;
  padding-left: 72px;
}

.rows p::before {
  position: absolute;
  left: 22px;
  top: 24px;
  display: grid;
  width: 32px;
  height: 32px;
  place-items: center;
  border: 1px solid rgba(127, 192, 181, 0.32);
  color: #7fc0b5;
  content: attr(data-icon);
  font-size: 11px;
  font-weight: 800;
}

.workspace-media-wall figure {
  min-height: 360px;
}

.workspace-media-wall figure:nth-child(1),
.workspace-media-wall figure:nth-child(2) {
  grid-column: span 2;
}

.workspace-media-wall figure:nth-child(3),
.workspace-media-wall figure:nth-child(4),
.workspace-media-wall figure:nth-child(5),
.workspace-media-wall figure:nth-child(6) {
  grid-column: span 1;
}

.workspace-media-wall figure img {
  height: 100%;
  object-fit: cover;
  transition: transform 520ms ease;
}

.workspace-media-wall figure:hover img {
  transform: scale(1.035);
}

.occupier-section dl > div {
  position: relative;
  padding-left: 76px;
}

.occupier-section dl > div::before {
  position: absolute;
  left: 22px;
  top: 22px;
  display: grid;
  width: 34px;
  height: 34px;
  place-items: center;
  border: 1px solid rgba(23, 97, 106, 0.24);
  color: var(--accent);
  content: attr(data-icon);
  font-size: 11px;
  font-weight: 800;
}

.commute-heading {
  margin-bottom: 28px;
}

.commute-heading h2 {
  margin-bottom: 0;
}

.gallery-page .contact-footer a::after {
  content: none;
}

.location-cinema {
  --paper: #121715;
  --ink: #fffaf2;
  --accent: #b48a4e;
  --champagne: #b48a4e;
  --ivory: #fffaf2;
  --obsidian: #101514;
  --slate: #24302c;
  --soft-line: rgba(255, 250, 242, 0.16);
  background:
    linear-gradient(180deg, #101514 0%, #151b18 44%, #0f1312 100%);
}

.location-opening__shade {
  background:
    linear-gradient(90deg, rgba(16, 21, 20, 0.9), rgba(16, 21, 20, 0.44) 52%, rgba(16, 21, 20, 0.1)),
    linear-gradient(0deg, rgba(16, 21, 20, 0.97) 0%, rgba(16, 21, 20, 0.48) 54%, rgba(16, 21, 20, 0.18) 100%);
}

.location-island,
.micro-card,
.address-protocol article,
.location-start,
.location-footer {
  border-radius: 8px;
}

.location-logo span {
  border-radius: 0;
  background: var(--champagne);
  color: #101514;
}

.magnetic-btn {
  border-radius: 4px;
}

.micro-head .icon-pin,
.micro-head .icon-grid {
  position: relative;
  width: 16px;
  height: 16px;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
  animation: none;
}

.micro-head .icon-pin::before {
  position: absolute;
  inset: 2px 4px 5px;
  content: "";
  border: 2px solid currentColor;
  border-radius: 50% 50% 50% 0;
  transform: rotate(-45deg);
}

.micro-head .icon-grid::before {
  position: absolute;
  inset: 2px;
  content: "";
  background:
    linear-gradient(currentColor 0 0) left top / 5px 5px no-repeat,
    linear-gradient(currentColor 0 0) right top / 5px 5px no-repeat,
    linear-gradient(currentColor 0 0) left bottom / 5px 5px no-repeat,
    linear-gradient(currentColor 0 0) right bottom / 5px 5px no-repeat;
}

.amenity-columns article {
  position: relative;
  border-radius: 8px;
}

.amenity-columns article i {
  display: block;
  width: 34px;
  height: 34px;
  margin-bottom: 28px;
  border: 1px solid rgba(180, 138, 78, 0.34);
  background:
    linear-gradient(90deg, transparent 46%, rgba(180, 138, 78, 0.82) 46% 54%, transparent 54%),
    linear-gradient(0deg, transparent 46%, rgba(180, 138, 78, 0.82) 46% 54%, transparent 54%);
}

.amenity-columns span {
  margin-bottom: 34px;
}

.journey-matrix small {
  display: block;
  margin-bottom: 22px;
  color: rgba(255, 250, 242, 0.5);
  font-family: "JetBrains Mono", monospace;
  font-size: 11px;
  font-weight: 700;
  text-transform: uppercase;
}

.location-footer a {
  display: grid;
  gap: 3px;
}

.location-footer a span,
.location-footer a small {
  display: block;
}

.location-footer a small {
  color: rgba(255, 250, 242, 0.52);
  font-size: 11px;
  font-weight: 800;
  text-transform: uppercase;
}

@media (max-width: 980px) {
  .hub-hero,
  .workspace-hero,
  .gallery-scroll-story {
    grid-template-columns: 1fr;
  }

  .hub-selector {
    grid-template-columns: 1fr;
    min-height: 0;
  }

  .selector-visual {
    min-height: 460px;
  }

  .story-media {
    position: relative;
    top: auto;
    min-height: 520px;
  }

  .workspace-media-wall figure:nth-child(n) {
    grid-column: span 1;
  }
}

@media (max-width: 720px) {
  h1 {
    font-size: 3.25rem;
  }

  h2 {
    font-size: 2.5rem;
  }

  .hub-stat-grid,
  .heritage-ledger,
  .section-heading,
  .gallery-spec,
  .gallery-map {
    grid-template-columns: 1fr;
  }

  .story-media {
    min-height: 380px;
  }

  .gallery-page .story-media {
    height: 380px;
    min-height: 380px;
  }

  .gallery-page .story-media figure,
  .gallery-page .story-media figure.is-active {
    position: absolute;
    inset: 0;
  }

  .gallery-page .story-media img {
    height: 100%;
    object-fit: cover;
  }

  .story-copy article {
    min-height: auto;
  }

  .rows p,
  .occupier-section dl > div {
    padding-left: 22px;
  }

  .rows p::before,
  .occupier-section dl > div::before {
    position: static;
    margin-bottom: 14px;
  }

  .stacked-media figure:nth-child(2) img,
  .stacked-media img,
  .workspace-media-wall figure,
  .workspace-media-wall figure img {
    height: auto;
    min-height: 0;
  }

  .contact-footer a {
    align-items: flex-start;
    flex-direction: column;
    gap: 4px;
  }

  .location-opening {
    display: grid;
    align-content: end;
  }

  .location-opening__content {
    max-width: 100%;
  }

.hero-status {
    justify-self: start;
    width: min(100%, 260px);
    max-width: 100%;
    white-space: normal;
  }
}

.gallery-page .story-media figure {
  z-index: 1;
  opacity: 0 !important;
  transition: transform 900ms ease;
}

.gallery-page .story-media figure.is-active {
  z-index: 2;
  opacity: 1 !important;
  transform: scale(1);
}

.gallery-js .story-copy article.is-active {
  opacity: 1;
  transform: translateY(0);
}

/* Gallery-specific contact sheet scroll */
.gallery-page .gallery-scroll-story {
  grid-template-columns: minmax(0, 1.02fr) minmax(300px, 0.58fr);
  position: relative;
}

.gallery-page .story-media {
  min-height: min(82vh, 780px);
  border: 1px solid rgba(32, 23, 22, 0.18);
  background:
    linear-gradient(90deg, rgba(142, 63, 50, 0.16), transparent 32%),
    #201716;
  box-shadow: 0 34px 110px rgba(32, 23, 22, 0.26);
  isolation: isolate;
}

.gallery-page .story-media::before {
  position: absolute;
  inset: 18px;
  z-index: 30;
  pointer-events: none;
  content: "";
  border: 1px solid rgba(255, 250, 242, 0.24);
}

.gallery-page .story-media::after {
  position: absolute;
  left: 18px;
  top: 18px;
  z-index: 31;
  width: 76px;
  height: 10px;
  pointer-events: none;
  content: "";
  background:
    linear-gradient(90deg, #b8874a 0 30%, #8e3f32 30% 64%, #20473d 64% 100%);
}

.gallery-page .story-media figure {
  z-index: 1;
  background-position: center;
  background-size: cover;
  opacity: var(--story-opacity, 0.18) !important;
  clip-path: inset(12% 10% 12% 10%);
  filter: grayscale(0.16) saturate(0.78) brightness(0.72);
  transform:
    translate3d(var(--story-x, 0), var(--story-y, 0), 0)
    scale(var(--story-scale, 0.9))
    rotate(var(--story-rotate, 0));
  transform-origin: center;
  transition:
    opacity 620ms ease,
    clip-path 760ms cubic-bezier(0.22, 1, 0.36, 1),
    filter 760ms ease,
    transform 860ms cubic-bezier(0.22, 1, 0.36, 1);
}

.gallery-page .story-media figure:nth-child(1) {
  background-image: url("assets/images/exterior-800.webp");
}

.gallery-page .story-media figure:nth-child(2) {
  background-image: url("assets/images/reception-800.webp");
}

.gallery-page .story-media figure:nth-child(3) {
  background-image: url("assets/images/open-plan-800.webp");
}

.gallery-page .story-media figure:nth-child(4) {
  background-image: url("assets/images/top-floor-800.webp");
}

.gallery-page .story-media figure.is-active {
  opacity: 1 !important;
  clip-path: inset(0);
  filter: none;
  transform: translate3d(0, -8px, 0) scale(1) rotate(0);
}

.gallery-page .story-media figure.is-before {
  transform:
    translate3d(calc(var(--story-x, 0) - 36px), calc(var(--story-y, 0) - 16px), 0)
    scale(var(--story-scale, 0.86))
    rotate(var(--story-rotate, 0));
}

.gallery-page .story-media figure.is-after {
  transform:
    translate3d(calc(var(--story-x, 0) + 36px), calc(var(--story-y, 0) + 16px), 0)
    scale(var(--story-scale, 0.86))
    rotate(var(--story-rotate, 0));
}

.gallery-page .story-media figcaption {
  left: auto;
  right: 18px;
  top: 18px;
  bottom: auto;
  z-index: 32;
  background: rgba(32, 23, 22, 0.76);
}

.gallery-page .story-copy {
  gap: 0;
  padding-top: clamp(28px, 8vh, 80px);
}

.gallery-page .story-copy article {
  position: relative;
  min-height: 42vh;
  padding: clamp(28px, 4vw, 52px) 0 clamp(34px, 6vw, 78px) clamp(26px, 4vw, 58px);
  border: 0;
  border-left: 1px solid rgba(32, 23, 22, 0.18);
  background: transparent;
  opacity: var(--story-copy-opacity, 0.34);
  transform: translateX(var(--story-copy-x, 24px));
  transition: opacity 520ms ease, transform 680ms cubic-bezier(0.22, 1, 0.36, 1), border-color 520ms ease;
}

.gallery-page .story-copy article::before {
  position: absolute;
  left: -7px;
  top: clamp(34px, 4vw, 58px);
  width: 13px;
  height: 13px;
  content: "";
  background: var(--accent);
  box-shadow: 0 0 0 8px rgba(142, 63, 50, 0.12);
}

.gallery-page .story-copy article::after {
  position: absolute;
  left: 0;
  top: clamp(40px, 4vw, 64px);
  width: clamp(16px, 3vw, 44px);
  content: "";
  border-top: 1px solid rgba(32, 23, 22, 0.32);
}

.gallery-page .story-copy article.is-active {
  border-left-color: rgba(142, 63, 50, 0.62);
  box-shadow: none;
  opacity: 1;
  transform: translateX(0);
}

.gallery-page .story-copy article.is-active::before {
  background: var(--gallery-brass);
}

.gallery-page .story-copy article.is-before {
  transform: translateX(-8px);
}

@media (max-width: 900px) {
  .gallery-page .gallery-scroll-story {
    grid-template-columns: 1fr;
  }

  .gallery-page .story-media {
    position: relative;
    top: auto;
    display: grid;
    gap: 12px;
    min-height: 0;
    border: 0;
    background: transparent;
    box-shadow: none;
  }

  .gallery-page .story-media::before,
  .gallery-page .story-media::after {
    display: none;
  }

  .gallery-page .story-media figure,
  .gallery-page .story-media figure.is-active,
  .gallery-page .story-media figure.is-before,
  .gallery-page .story-media figure.is-after {
    position: relative;
    inset: auto;
    opacity: 1 !important;
    clip-path: none;
    filter: none;
    transform: none;
  }

  .gallery-page .story-media img {
    height: clamp(320px, 62vw, 520px);
    object-fit: cover;
  }

  .gallery-page .story-media figcaption {
    left: 14px;
    right: 14px;
    top: auto;
    bottom: 14px;
  }

  .gallery-page .story-copy {
    gap: 14px;
    padding-top: 0;
  }

  .gallery-page .story-copy article,
  .gallery-page .story-copy article.is-active,
  .gallery-page .story-copy article.is-before,
  .gallery-page .story-copy article.is-after {
    min-height: auto;
    padding: 24px;
    border: 1px solid rgba(32, 23, 22, 0.14);
    background: rgba(255, 250, 242, 0.72);
    opacity: 1;
    transform: none;
  }

  .gallery-page .story-copy article::before,
  .gallery-page .story-copy article::after {
    display: none;
  }
}

/* Gallery cinematic reel scroll */
.gallery-page .gallery-scroll-story {
  display: block;
  position: relative;
  min-height: 400svh;
  padding: 0;
  overflow: clip;
  background: #201716;
  color: var(--gallery-cream);
}

.gallery-page .story-media {
  position: sticky;
  top: 0;
  width: 100%;
  height: 100svh;
  min-height: 680px;
  overflow: hidden;
  border: 0;
  background: #201716;
  box-shadow: none;
  isolation: isolate;
}

.gallery-page .story-media::before {
  position: absolute;
  inset: 0;
  z-index: 30;
  pointer-events: none;
  content: "";
  border: 0;
  background:
    linear-gradient(90deg, rgba(32, 23, 22, 0.88) 0%, rgba(32, 23, 22, 0.46) 42%, rgba(32, 23, 22, 0.08) 100%),
    linear-gradient(0deg, rgba(32, 23, 22, 0.9) 0%, rgba(32, 23, 22, 0.12) 48%, rgba(32, 23, 22, 0.36) 100%);
}

.gallery-page .story-media::after {
  position: absolute;
  left: clamp(22px, 7vw, 104px);
  right: auto;
  top: auto;
  bottom: clamp(26px, 6vw, 72px);
  z-index: 34;
  width: 280px;
  height: 3px;
  pointer-events: none;
  content: "";
  background: linear-gradient(90deg, var(--gallery-brass), var(--accent), var(--gallery-green));
  transform: scaleX(var(--story-progress, 0.02));
  transform-origin: left center;
}

.gallery-page .story-media figure,
.gallery-page .story-media figure.is-before,
.gallery-page .story-media figure.is-after {
  position: absolute;
  inset: 0;
  z-index: 1;
  margin: 0;
  opacity: 0 !important;
  clip-path: inset(100% 0 0 0);
  filter: none;
  transform: scale(1.015);
  transition:
    opacity 760ms ease,
    clip-path 960ms cubic-bezier(0.22, 1, 0.36, 1),
    transform 1200ms cubic-bezier(0.22, 1, 0.36, 1);
}

.gallery-page .story-media figure.is-before {
  clip-path: inset(0 0 100% 0);
}

.gallery-page .story-media figure.is-active {
  z-index: 2;
  opacity: 1 !important;
  clip-path: inset(0);
  transform: scale(1);
}

.gallery-page .story-media img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.gallery-page .story-media figcaption {
  left: auto;
  right: clamp(18px, 5vw, 72px);
  top: auto;
  bottom: clamp(24px, 5vw, 64px);
  z-index: 35;
  border: 1px solid rgba(255, 250, 242, 0.22);
  background: rgba(32, 23, 22, 0.68);
  color: var(--gallery-cream);
}

.gallery-page .story-copy {
  position: relative;
  z-index: 36;
  display: block;
  margin-top: -100svh;
  padding: 0;
  pointer-events: none;
}

.gallery-page .story-copy article,
.gallery-page .story-copy article.is-before,
.gallery-page .story-copy article.is-after {
  display: flex;
  min-height: 100svh;
  flex-direction: column;
  justify-content: flex-end;
  max-width: min(760px, 100%);
  padding: clamp(112px, 14vw, 180px) clamp(22px, 7vw, 104px) clamp(96px, 12vw, 150px);
  border: 0;
  background: transparent;
  color: var(--gallery-cream);
  opacity: 0.32;
  transform: translateY(18px);
  transition: opacity 520ms ease, transform 680ms cubic-bezier(0.22, 1, 0.36, 1);
}

.gallery-page .story-copy article::before,
.gallery-page .story-copy article::after {
  display: none;
}

.gallery-page .story-copy article.is-active {
  box-shadow: none;
  opacity: 1;
  transform: translateY(0);
}

.gallery-page .story-copy .kicker {
  color: #f0b39f;
}

.gallery-page .story-copy h2 {
  max-width: 720px;
  margin-bottom: 20px;
  color: var(--gallery-cream);
  font-size: clamp(48px, 7vw, 104px);
  line-height: 0.9;
  text-wrap: balance;
}

.gallery-page .story-copy p:not(.kicker) {
  max-width: 560px;
  color: rgba(255, 250, 242, 0.74);
  font-size: 18px;
}

@media (max-width: 900px) {
  .gallery-page .gallery-scroll-story {
    min-height: 400svh;
  }

  .gallery-page .story-media {
    position: sticky;
    top: 0;
    display: block;
    height: 100svh;
    min-height: 620px;
    background: #201716;
  }

  .gallery-page .story-media::before,
  .gallery-page .story-media::after {
    display: block;
  }

  .gallery-page .story-media figure,
  .gallery-page .story-media figure.is-active,
  .gallery-page .story-media figure.is-before,
  .gallery-page .story-media figure.is-after {
    position: absolute;
    inset: 0;
  }

  .gallery-page .story-copy {
    margin-top: -100svh;
  }

  .gallery-page .story-copy article,
  .gallery-page .story-copy article.is-active,
  .gallery-page .story-copy article.is-before,
  .gallery-page .story-copy article.is-after {
    min-height: 100svh;
    padding: 112px 22px 92px;
    border: 0;
    background: transparent;
  }

  .gallery-page .story-copy h2 {
    font-size: clamp(40px, 12vw, 66px);
  }

  .gallery-page .story-media figcaption {
    left: 22px;
    right: 22px;
    top: auto;
    bottom: 22px;
  }
}

@media (prefers-reduced-motion: reduce) {
  .arrival-map img,
  .arrival-route--live,
  .week-grid::before,
  .week-grid svg {
    animation: none;
  }

  .gallery-page .story-media figure,
  .gallery-page .story-copy article {
    transition: opacity 180ms ease;
    transform: none;
  }
}

/* Workspace luxury re-imagining */
.workspace-page {
  --paper: #e3e0cc;
  --ink: #252a1b;
  --muted: #686957;
  --accent: #252a1b;
  --gold: #a88f5e;
  --workspace-green: #252a1b;
  --workspace-mist: #d7d6c5;
  --workspace-ivory: #f4f0df;
  --workspace-clay: #384432;
  --workspace-obsidian: #151a13;
  --surface: #d7d6c5;
  --surface-strong: #ece8d8;
  --surface-muted: #d7d6c5;
  background:
    linear-gradient(180deg, var(--paper) 0%, var(--surface) 46%, var(--surface-strong) 100%);
}

.workspace-page main {
  overflow: visible;
}

.workspace-page .site-top {
  border-bottom-color: rgba(19, 32, 31, 0.12);
  background: rgba(243, 240, 232, 0.9);
}

.workspace-page .top-cta {
  background: var(--ink);
  color: var(--paper);
}

.workspace-hero {
  position: relative;
  display: grid;
  grid-template-columns: minmax(0, 0.82fr) minmax(0, 1.18fr);
  gap: clamp(44px, 8vw, 138px);
  min-height: calc(100svh - 72px);
  align-items: center;
  padding: clamp(68px, 9vw, 150px) clamp(24px, 8vw, 118px) clamp(62px, 7vw, 116px);
  background:
    linear-gradient(90deg, rgba(255, 250, 240, 0.86), rgba(255, 250, 240, 0.2) 48%, transparent),
    linear-gradient(180deg, #eef3ed 0%, #f3f0e8 100%);
  isolation: isolate;
}

.workspace-hero::before {
  position: absolute;
  left: clamp(24px, 8vw, 118px);
  top: clamp(48px, 7vw, 110px);
  bottom: clamp(48px, 7vw, 110px);
  width: 1px;
  content: "";
  background: linear-gradient(180deg, transparent, rgba(19, 32, 31, 0.22), transparent);
}

  .workspace-hero-copy {
  position: relative;
  z-index: 2;
  max-width: 740px;
  padding-left: clamp(18px, 2vw, 34px);
}

/* Root landing page */
.home-page {
  --home-ink: #121614;
  --home-paper: #f7f0e4;
  --home-ivory: #fffaf0;
  --home-muted: #756e63;
  --home-gold: #b8894d;
  --home-oxide: #8f473b;
  --home-green: #15362f;
  --home-blue: #1e455b;
  --home-line: rgba(18, 22, 20, 0.14);
  --home-light-line: rgba(255, 250, 240, 0.2);
  background: var(--home-paper);
  color: var(--home-ink);
}

.home-page h1,
.home-page h2,
.home-page h3 {
  font-family: "Arial Black", Arial, Helvetica, sans-serif;
  font-weight: 900;
  letter-spacing: 0;
  text-transform: uppercase;
}

.home-page h1 {
  max-width: 980px;
  margin-bottom: 22px;
  font-size: clamp(5.4rem, 8vw, 7.5rem);
  line-height: 0.82;
}

.home-page h2 {
  margin-bottom: 26px;
  font-size: clamp(3.4rem, 5.9vw, 4.75rem);
  line-height: 0.86;
}

.home-kicker {
  margin: 0 0 18px;
  color: var(--home-gold);
  font-size: 0.75rem;
  font-weight: 900;
  letter-spacing: 0;
  text-transform: uppercase;
}

.home-top {
  position: sticky;
  top: 0;
  z-index: 40;
  display: grid;
  grid-template-columns: auto 1fr auto;
  gap: 24px;
  align-items: center;
  min-height: 72px;
  padding: 14px clamp(18px, 4vw, 44px);
  border-bottom: 1px solid rgba(255, 250, 240, 0.12);
  background: rgba(18, 22, 20, 0.9);
  color: var(--home-ivory);
  backdrop-filter: blur(18px);
}

.home-mark {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  text-decoration: none;
  text-transform: uppercase;
}

.home-mark span {
  display: grid;
  width: 34px;
  height: 34px;
  place-items: center;
  border: 1px solid var(--home-gold);
  background: var(--home-gold);
  color: var(--home-ink);
  font-family: Georgia, "Times New Roman", serif;
  font-size: 21px;
  line-height: 1;
}

.home-mark strong {
  font-size: 13px;
  font-weight: 900;
  letter-spacing: 0;
}

.home-top nav {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 8px;
}

.home-top nav a,
.home-top-cta,
.home-primary,
.home-secondary {
  min-height: 38px;
  padding: 10px 13px;
  border: 1px solid transparent;
  text-decoration: none;
  font-size: 0.75rem;
  font-weight: 900;
  letter-spacing: 0;
  text-transform: uppercase;
  transition: background 220ms ease, border-color 220ms ease, color 220ms ease, transform 220ms ease;
}

.home-top nav a:hover,
.home-top nav a:focus-visible {
  border-color: rgba(255, 250, 240, 0.42);
}

.home-top-cta {
  border-color: var(--home-gold);
  background: var(--home-gold);
  color: var(--home-ink);
}

.home-top-cta:hover,
.home-top-cta:focus-visible,
.home-primary:hover,
.home-primary:focus-visible,
.home-secondary:hover,
.home-secondary:focus-visible {
  transform: translateY(-2px);
}

.home-hero {
  position: relative;
  display: grid;
  min-height: calc(100svh - 128px);
  overflow: hidden;
  align-items: end;
  background: var(--home-ink);
  color: var(--home-ivory);
  isolation: isolate;
}

.home-hero-media,
.home-hero-media img,
.home-hero-shade {
  position: absolute;
  inset: 0;
}

.home-hero-media {
  z-index: -3;
  margin: 0;
}

.home-hero-media img {
  height: 100%;
  object-fit: cover;
  opacity: 0.86;
}

.home-hero-shade {
  z-index: -2;
  background:
    linear-gradient(90deg, rgba(18, 22, 20, 0.96) 0%, rgba(18, 22, 20, 0.58) 48%, rgba(18, 22, 20, 0.16) 100%),
    linear-gradient(0deg, rgba(18, 22, 20, 0.96) 0%, rgba(18, 22, 20, 0.42) 58%, rgba(18, 22, 20, 0.24) 100%);
}

.home-hero-content {
  max-width: 1120px;
  padding: clamp(72px, 10vw, 128px) clamp(22px, 8vw, 112px) clamp(38px, 6vw, 70px);
}

.home-hero-line {
  max-width: 780px;
  margin-bottom: 30px;
  color: rgba(255, 250, 240, 0.82);
  font-size: 1.55rem;
  line-height: 1.22;
}

.home-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
}

.home-primary,
.home-secondary {
  display: inline-flex;
  min-height: 48px;
  align-items: center;
  justify-content: center;
  padding-inline: 18px;
}

.home-primary {
  border-color: var(--home-gold);
  background: var(--home-gold);
  color: var(--home-ink);
}

.home-secondary {
  border-color: rgba(255, 250, 240, 0.46);
  color: var(--home-ivory);
}

.home-secondary:hover,
.home-secondary:focus-visible {
  background: rgba(255, 250, 240, 0.1);
}

.home-hero-facts {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  margin: 0;
  padding: 1px;
  background: rgba(255, 250, 240, 0.2);
}

.home-hero-facts div {
  min-height: 112px;
  padding: 18px clamp(18px, 3vw, 36px);
  background: rgba(18, 22, 20, 0.72);
  backdrop-filter: blur(18px);
}

.home-hero-facts dt,
.home-hero-facts dd {
  margin: 0;
}

.home-hero-facts dt {
  margin-bottom: 16px;
  color: rgba(255, 250, 240, 0.58);
  font-size: 0.72rem;
  font-weight: 900;
  text-transform: uppercase;
}

.home-hero-facts dd {
  color: var(--home-ivory);
  font-family: Georgia, "Times New Roman", serif;
  font-size: 2rem;
  line-height: 1;
}

.home-proof {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: clamp(22px, 3vw, 42px);
  max-width: 1240px;
  margin: 0 auto;
  padding: clamp(78px, 9vw, 134px) clamp(22px, 7vw, 104px);
  background: var(--home-paper);
}

.home-proof article {
  min-height: 220px;
  padding: 0 0 30px;
  border-top: 1px solid var(--home-line);
  background: transparent;
}

.home-proof span {
  display: grid;
  width: 42px;
  height: 42px;
  margin-bottom: clamp(42px, 5vw, 72px);
  place-items: center;
  border: 1px solid var(--home-line);
  color: var(--home-oxide);
  font-family: Georgia, "Times New Roman", serif;
  font-size: 1.3rem;
}

.home-proof strong {
  display: block;
  margin-bottom: 12px;
  font-family: "Arial Black", Arial, Helvetica, sans-serif;
  font-size: 1.4rem;
  font-weight: 900;
  line-height: 1;
  text-transform: uppercase;
}

.home-proof p {
  max-width: 360px;
  margin-bottom: 0;
  color: var(--home-muted);
}

.home-workspace,
.home-location,
.home-map-section,
.home-routes {
  display: grid;
  grid-template-columns: minmax(280px, 0.72fr) minmax(0, 1fr);
  gap: clamp(48px, 8vw, 132px);
  align-items: center;
  padding: clamp(86px, 10vw, 156px) clamp(22px, 8vw, 118px);
}

.home-section-copy p:not(.home-kicker),
.home-location p,
.home-map-copy p,
.home-routes p {
  max-width: 560px;
  color: var(--home-muted);
  font-size: 1.03rem;
  line-height: 1.64;
}

.home-chip-row {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  margin-top: 36px;
}

.home-chip-row span,
.home-map-notes li {
  min-height: 34px;
  padding: 8px 11px;
  border: 1px solid rgba(184, 137, 77, 0.34);
  background: rgba(255, 250, 240, 0.74);
  color: color-mix(in srgb, var(--home-green) 82%, var(--home-gold));
  font-size: 0.75rem;
  font-weight: 900;
  line-height: 1.2;
  text-transform: uppercase;
}

.home-workspace-media {
  display: grid;
  grid-template-columns: 1fr 0.58fr;
  gap: clamp(16px, 2vw, 26px);
  align-items: end;
}

.home-workspace-media figure,
.home-gallery-strip figure {
  position: relative;
  margin: 0;
  overflow: hidden;
  background: var(--home-ink);
}

.home-workspace-media figure {
  background-position: center;
  background-size: cover;
}

.home-workspace-media figure:nth-child(1) {
  background-image: url("assets/images/open-plan-800.webp");
}

.home-workspace-media figure:nth-child(2) {
  background-image: url("assets/images/reception-800.webp");
}

.home-workspace-media img {
  height: clamp(360px, 36vw, 470px);
  object-fit: cover;
}

.home-workspace-media .home-media-large img {
  height: clamp(440px, 46vw, 590px);
}

.home-workspace-media figcaption,
.home-gallery-strip figcaption {
  position: absolute;
  left: 16px;
  bottom: 16px;
  z-index: 1;
  padding: 10px 12px;
  background: rgba(18, 22, 20, 0.72);
  color: var(--home-ivory);
  font-size: 0.72rem;
  font-weight: 900;
  text-transform: uppercase;
  backdrop-filter: blur(14px);
}

.home-impact {
  position: relative;
  display: grid;
  min-height: 64svh;
  place-items: center;
  overflow: hidden;
  padding: clamp(88px, 11vw, 154px) clamp(22px, 8vw, 118px);
  background: var(--home-ink);
  color: var(--home-ivory);
}

.home-impact img {
  position: absolute;
  inset: 0;
  height: 100%;
  object-fit: cover;
  opacity: 0.34;
  filter: contrast(1.08) saturate(0.92);
}

.home-impact::after {
  position: absolute;
  inset: 0;
  content: "";
  background:
    linear-gradient(90deg, rgba(18, 22, 20, 0.82), rgba(18, 22, 20, 0.36)),
    linear-gradient(0deg, rgba(18, 22, 20, 0.8), transparent 46%, rgba(18, 22, 20, 0.38));
}

.home-impact div {
  position: relative;
  z-index: 1;
  width: min(1120px, 100%);
}

.home-impact h2 {
  max-width: 980px;
  margin-bottom: 0;
}

.home-location {
  grid-template-columns: minmax(280px, 0.58fr) minmax(0, 1fr);
  background:
    linear-gradient(90deg, rgba(21, 54, 47, 0.12), transparent 44%),
    #eef2eb;
}

.home-time-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: clamp(14px, 2vw, 24px);
  margin: 0;
  padding: 0;
  background: transparent;
}

.home-time-grid div {
  min-height: 138px;
  padding: 20px;
  border: 1px solid rgba(18, 22, 20, 0.12);
  background: rgba(255, 250, 240, 0.64);
}

.home-time-grid dt,
.home-time-grid dd {
  margin: 0;
}

.home-time-grid dt {
  margin-bottom: 30px;
  color: var(--home-oxide);
  font-family: Georgia, "Times New Roman", serif;
  font-size: 3.2rem;
  line-height: 0.8;
}

.home-time-grid dd {
  font-size: 0.78rem;
  font-weight: 900;
  text-transform: uppercase;
}

.home-map-section {
  grid-template-columns: minmax(280px, 0.58fr) minmax(0, 1fr);
  align-items: stretch;
  background:
    linear-gradient(90deg, rgba(184, 137, 77, 0.12), transparent 42%),
    var(--home-ink);
  color: var(--home-ivory);
}

.home-map-copy {
  align-self: center;
}

.home-map-copy p {
  color: rgba(255, 250, 240, 0.7);
}

.home-map-notes {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin: 30px 0 0;
  padding: 0;
  list-style: none;
}

.home-map-notes li {
  border-color: rgba(255, 250, 240, 0.2);
  background: rgba(255, 250, 240, 0.08);
  color: var(--home-ivory);
}

.home-map-wrap {
  position: relative;
  min-height: clamp(460px, 48vw, 580px);
  overflow: hidden;
  border: 1px solid rgba(255, 250, 240, 0.18);
  border-radius: 8px;
  background: #dfe7df;
  box-shadow: 0 24px 64px rgba(0, 0, 0, 0.24);
}

.home-map,
.home-map-fallback {
  position: absolute;
  inset: 0;
}

.home-map {
  z-index: 2;
  min-height: 420px;
  background: transparent;
}

.home-map-fallback {
  z-index: 1;
  background:
    linear-gradient(90deg, transparent 49%, rgba(18, 22, 20, 0.1) 50%, transparent 51%) 0 0 / 82px 82px,
    linear-gradient(0deg, transparent 49%, rgba(18, 22, 20, 0.1) 50%, transparent 51%) 0 0 / 82px 82px,
    #edf1e8;
}

.home-map-pin {
  position: absolute;
  left: 50%;
  top: 50%;
  display: grid;
  width: 76px;
  height: 76px;
  place-items: center;
  border: 3px solid var(--home-ivory);
  background: var(--home-oxide);
  color: var(--home-ivory);
  font-family: Georgia, "Times New Roman", serif;
  font-size: 2rem;
  transform: translate(-50%, -50%);
  box-shadow: 0 18px 40px rgba(18, 22, 20, 0.24);
}

.home-map-gridline {
  position: absolute;
  left: 50%;
  top: 50%;
  width: 44%;
  height: 4px;
  background: rgba(143, 71, 59, 0.55);
  transform-origin: left center;
}

.home-map-gridline.one {
  transform: rotate(34deg);
}

.home-map-gridline.two {
  transform: rotate(-26deg);
}

.home-map.leaflet-container {
  --map-ink: var(--home-ink);
  --map-ivory: var(--home-ivory);
  --map-oxide: var(--home-oxide);
  font-family: Arial, Helvetica, sans-serif;
}

.home-map.is-map-ready + .home-map-fallback {
  opacity: 0;
}

.home-map .leaflet-control-zoom a {
  color: var(--home-ink);
}

.home-map .leaflet-popup-content-wrapper,
.home-map .leaflet-popup-tip {
  border-radius: 4px;
}

.home-map .leaflet-popup-content {
  margin: 12px 14px;
  color: var(--home-ink);
  font-size: 0.82rem;
}

.home-map .map-popup-title {
  display: block;
  margin-bottom: 4px;
  font-weight: 900;
  text-transform: uppercase;
}

.savoy-map-marker {
  display: grid;
  place-items: center;
}

.savoy-map-marker span {
  display: grid;
  width: 46px;
  height: 46px;
  place-items: center;
  border: 3px solid var(--map-ivory, var(--home-ivory, #fffaf0));
  background: var(--map-oxide, var(--home-oxide, #8f473b));
  color: var(--map-ivory, var(--home-ivory, #fffaf0));
  font-family: Georgia, "Times New Roman", serif;
  font-size: 1.45rem;
  box-shadow: 0 18px 38px rgba(18, 22, 20, 0.24);
}

.site-map-section {
  --map-ink: #121614;
  --map-paper: #f7f0e4;
  --map-ivory: #fffaf0;
  --map-muted: rgba(255, 250, 240, 0.68);
  --map-gold: #b8894d;
  --map-oxide: #8f473b;
  display: grid;
  grid-template-columns: minmax(280px, 0.68fr) minmax(0, 1fr);
  gap: clamp(28px, 6vw, 90px);
  align-items: stretch;
  padding: clamp(56px, 8vw, 112px) clamp(20px, 6vw, 88px);
  background:
    linear-gradient(90deg, rgba(143, 71, 59, 0.18), transparent 40%),
    var(--map-ink);
  color: var(--map-ivory);
}

.site-map-copy {
  align-self: center;
}

.site-map-kicker {
  margin: 0 0 16px;
  color: var(--map-gold);
  font-size: 12px;
  font-weight: 900;
  letter-spacing: 0;
  text-transform: uppercase;
}

.site-map-section h2 {
  max-width: 760px;
  margin-bottom: 22px;
  color: var(--map-ivory);
}

.site-map-copy p:not(.site-map-kicker) {
  max-width: 560px;
  color: var(--map-muted);
  font-size: 18px;
}

.site-map-points {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-top: 30px;
}

.site-map-points span {
  min-height: 34px;
  padding: 8px 11px;
  border: 1px solid rgba(255, 250, 240, 0.2);
  background: rgba(255, 250, 240, 0.08);
  color: var(--map-ivory);
  font-size: 12px;
  font-weight: 900;
  line-height: 1.2;
  text-transform: uppercase;
}

.site-map-wrap {
  position: relative;
  min-height: 560px;
  overflow: hidden;
  border: 1px solid rgba(255, 250, 240, 0.18);
  border-radius: 8px;
  background: #dfe7df;
  box-shadow: 0 26px 80px rgba(0, 0, 0, 0.3);
}

.site-map,
.site-map-fallback {
  position: absolute;
  inset: 0;
}

.site-map {
  --map-ink: #121614;
  --map-ivory: #fffaf0;
  --map-oxide: #8f473b;
  z-index: 2;
  min-height: 420px;
  background: transparent;
}

.site-map-fallback {
  z-index: 1;
  background:
    linear-gradient(90deg, transparent 49%, rgba(18, 22, 20, 0.1) 50%, transparent 51%) 0 0 / 82px 82px,
    linear-gradient(0deg, transparent 49%, rgba(18, 22, 20, 0.1) 50%, transparent 51%) 0 0 / 82px 82px,
    #edf1e8;
}

.site-map.is-map-ready + .site-map-fallback {
  opacity: 0;
}

.site-map-pin {
  position: absolute;
  left: 50%;
  top: 50%;
  display: grid;
  width: 76px;
  height: 76px;
  place-items: center;
  border: 3px solid var(--map-ivory);
  background: var(--map-oxide);
  color: var(--map-ivory);
  font-family: Georgia, "Times New Roman", serif;
  font-size: 2rem;
  transform: translate(-50%, -50%);
  box-shadow: 0 18px 40px rgba(18, 22, 20, 0.24);
}

.site-map.leaflet-container {
  font-family: Arial, Helvetica, sans-serif;
}

.site-map .leaflet-control-zoom a {
  color: var(--map-ink);
}

.site-map .leaflet-popup-content-wrapper,
.site-map .leaflet-popup-tip {
  border-radius: 4px;
}

.site-map .leaflet-popup-content {
  margin: 12px 14px;
  color: var(--map-ink);
  font-size: 0.82rem;
}

.site-map .map-popup-title {
  display: block;
  margin-bottom: 4px;
  font-weight: 900;
  text-transform: uppercase;
}

.location-cinema .site-map-section {
  --map-ink: #101514;
  --map-gold: var(--champagne);
  --map-oxide: #8e3f32;
  border-top: 1px solid rgba(255, 250, 242, 0.14);
  border-bottom: 1px solid rgba(255, 250, 242, 0.14);
  font-family: Inter, Arial, Helvetica, sans-serif;
}

.location-cinema .site-map-section h2 {
  font-family: Inter, Arial, Helvetica, sans-serif;
  font-weight: 900;
}

.home-gallery-strip {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 0.86fr) minmax(0, 1fr);
  gap: clamp(20px, 3vw, 42px);
  align-items: start;
  padding: clamp(86px, 11vw, 164px) clamp(22px, 8vw, 118px);
  background: #fbf6ed;
}

.home-gallery-strip figure {
  background-position: center;
  background-size: cover;
  height: clamp(300px, 34vw, 430px);
  min-height: 0;
  box-shadow: 0 22px 58px rgba(18, 22, 20, 0.12);
}

.home-gallery-strip figure:nth-child(1) {
  background-image: url("assets/images/meeting-room-800.webp");
}

.home-gallery-strip figure:nth-child(2) {
  background-image: url("assets/images/focus-booths-800.webp");
  margin-top: clamp(42px, 6vw, 88px);
}

.home-gallery-strip figure:nth-child(3) {
  background-image: url("assets/images/tea-point-800.webp");
  margin-top: clamp(86px, 10vw, 142px);
}

.home-gallery-strip img {
  position: absolute;
  inset: 0;
  z-index: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform 540ms ease;
}

.home-gallery-strip figure:hover img {
  transform: scale(1.04);
}

.home-routes {
  grid-template-columns: minmax(280px, 0.5fr) minmax(0, 1.08fr);
  background:
    linear-gradient(90deg, rgba(143, 71, 59, 0.08), transparent 48%),
    #f7f0e4;
}

.home-route-list {
  display: grid;
  grid-template-columns: 1fr;
  gap: 0;
  width: 100%;
  max-width: 920px;
  justify-self: end;
  border-top: 1px solid var(--home-line);
  background: transparent;
}

.home-route-list a {
  display: grid;
  grid-template-columns: 54px minmax(120px, 0.28fr) minmax(0, 1fr);
  gap: clamp(14px, 2vw, 28px);
  min-height: 92px;
  align-items: baseline;
  padding: 22px 0;
  border-bottom: 1px solid var(--home-line);
  background: transparent;
  color: var(--home-ink);
  text-decoration: none;
  transition: color 220ms ease, transform 220ms ease;
}

.home-route-list a:hover,
.home-route-list a:focus-visible {
  color: var(--home-green);
  transform: translateX(6px);
}

.home-route-list span {
  color: var(--home-oxide);
  font-family: Georgia, "Times New Roman", serif;
  font-size: 1.8rem;
}

.home-route-list a:hover span,
.home-route-list a:focus-visible span,
.home-route-list a:hover small,
.home-route-list a:focus-visible small {
  color: color-mix(in srgb, var(--home-green) 68%, var(--home-muted));
}

.home-route-list strong {
  display: block;
  margin-top: 0;
  font-family: "Arial Black", Arial, Helvetica, sans-serif;
  font-size: 1.12rem;
  font-weight: 900;
  text-transform: uppercase;
}

.home-route-list small {
  display: block;
  max-width: 360px;
  margin-top: 0;
  color: var(--home-muted);
  font-size: 0.84rem;
  line-height: 1.35;
}

.home-footer {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(260px, 420px);
  gap: clamp(28px, 7vw, 104px);
  align-items: end;
  padding: clamp(86px, 10vw, 148px) clamp(22px, 8vw, 118px);
  background:
    linear-gradient(90deg, rgba(30, 69, 91, 0.26), transparent 44%),
    var(--home-ink);
  color: var(--home-ivory);
}

.home-footer h2 {
  max-width: 900px;
}

.home-footer p:not(.home-kicker) {
  max-width: 560px;
  color: rgba(255, 250, 240, 0.66);
  font-size: 1.1rem;
}

.home-footer address {
  display: grid;
  gap: 0;
  align-self: stretch;
  border-top: 1px solid rgba(255, 250, 240, 0.2);
  font-style: normal;
}

.home-footer a {
  display: grid;
  gap: 2px;
  min-height: 66px;
  align-content: center;
  border-bottom: 1px solid rgba(255, 250, 240, 0.18);
  color: var(--home-ivory);
  text-decoration: none;
  transition: color 220ms ease, transform 220ms ease;
}

.home-footer a:hover,
.home-footer a:focus-visible {
  color: var(--home-gold);
  transform: translateX(4px);
}

.home-footer span {
  font-weight: 900;
}

.home-footer small {
  color: rgba(255, 250, 240, 0.52);
  font-size: 0.72rem;
  font-weight: 900;
  text-transform: uppercase;
}

@media (max-width: 1180px) {
  .home-page h1 {
    font-size: 6rem;
  }

  .home-page h2 {
    font-size: 4.2rem;
  }

  .home-route-list {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 900px) {
  .site-map-section {
    grid-template-columns: 1fr;
  }

  .site-map-wrap {
    min-height: 520px;
  }

  .home-top,
  .home-workspace,
  .home-location,
  .home-map-section,
  .home-routes,
  .home-footer {
    grid-template-columns: 1fr;
  }

  .home-top {
    position: static;
    gap: 14px;
  }

  .home-top nav {
    justify-content: flex-start;
  }

  .home-page h1 {
    font-size: 4.4rem;
  }

  .home-page h2 {
    font-size: 3.2rem;
  }

  .home-hero {
    min-height: calc(100svh - 92px);
  }

  .home-hero-content {
    padding-top: 72px;
  }

  .home-proof,
  .home-time-grid,
  .home-gallery-strip {
    grid-template-columns: 1fr;
  }

  .home-workspace-media {
    grid-template-columns: 1fr;
  }

  .home-workspace-media img,
  .home-workspace-media .home-media-large img {
    height: auto;
    min-height: 360px;
  }

  .home-gallery-strip figure:nth-child(2),
  .home-gallery-strip figure:nth-child(3) {
    margin-top: 0;
  }

  .home-route-list a {
    grid-template-columns: 48px minmax(0, 1fr);
  }

  .home-route-list small {
    grid-column: 2;
  }

  .home-map-wrap {
    min-height: 520px;
  }
}

@media (max-width: 620px) {
  .site-map-section {
    padding: 56px 20px;
  }

  .site-map-section h2 {
    font-size: 2.55rem;
  }

  .site-map-copy p:not(.site-map-kicker) {
    font-size: 1rem;
  }

  .site-map-wrap {
    min-height: 420px;
  }

  .home-top nav {
    gap: 4px;
  }

  .home-top nav a,
  .home-top-cta {
    min-height: 34px;
    padding: 8px 9px;
    font-size: 0.68rem;
  }

  .home-page h1 {
    font-size: 3.35rem;
  }

  .home-page h2 {
    font-size: 2.55rem;
  }

  .home-hero-line {
    font-size: 1.14rem;
  }

  .home-actions a {
    width: 100%;
  }

  .home-hero-facts,
  .home-route-list {
    grid-template-columns: 1fr;
  }

  .home-hero-facts div {
    min-height: 96px;
  }

  .home-proof article {
    min-height: 210px;
  }

  .home-impact {
    min-height: 560px;
  }

  .home-map-wrap {
    min-height: 430px;
  }

  .home-gallery-strip figure {
    height: 340px;
    min-height: 340px;
  }
}

.workspace-hero .kicker,
.workspace-breathing-room .kicker,
.workspace-plan-suite .kicker,
.workspace-suite-copy .kicker,
.workspace-service-suite .kicker,
.workspace-page .occupier-section .kicker,
.workspace-connection-table .kicker,
.workspace-footer .kicker {
  color: var(--accent);
}

.workspace-hero h1 {
  max-width: 860px;
  margin-bottom: clamp(24px, 3vw, 42px);
  font-size: clamp(4.4rem, 8.6vw, 9.4rem);
  line-height: 0.88;
  text-wrap: balance;
}

.workspace-hero-copy > p:not(.kicker) {
  max-width: 600px;
  color: #536059;
  font-size: clamp(1.1rem, 1.5vw, 1.45rem);
  line-height: 1.58;
}

.workspace-hero-ledger {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 1px;
  max-width: 650px;
  margin: clamp(34px, 5vw, 66px) 0 0;
  padding: 1px;
  background: rgba(19, 32, 31, 0.14);
}

.workspace-hero-ledger div {
  min-height: 116px;
  padding: 18px;
  background: rgba(255, 250, 240, 0.74);
  backdrop-filter: blur(16px);
}

.workspace-hero-ledger dt,
.workspace-hero-ledger dd {
  margin: 0;
}

.workspace-hero-ledger dt {
  margin-bottom: 18px;
  color: #6a716b;
  font-size: 11px;
  font-weight: 800;
  text-transform: uppercase;
}

.workspace-hero-ledger dd {
  color: var(--workspace-green);
  font-family: Georgia, "Times New Roman", serif;
  font-size: clamp(1.65rem, 3vw, 2.7rem);
  line-height: 0.95;
}

.workspace-hero-media {
  position: relative;
  min-height: min(80vh, 840px);
  padding: clamp(22px, 3vw, 48px) 0 clamp(62px, 7vw, 100px) clamp(30px, 4vw, 64px);
}

.workspace-hero-media::before {
  position: absolute;
  inset: 0 12% 8% 0;
  content: "";
  border: 1px solid rgba(19, 32, 31, 0.16);
  background: rgba(255, 250, 240, 0.28);
}

.workspace-hero-card {
  border-radius: 0;
}

.workspace-hero-card--primary {
  position: relative;
  z-index: 2;
  width: min(100%, 860px);
  height: clamp(500px, 68vh, 790px);
  margin: 0 0 0 auto;
  box-shadow: 0 34px 90px rgba(19, 32, 31, 0.18);
}

.workspace-hero-card--primary img,
.workspace-hero-card--secondary img {
  height: 100%;
  object-fit: cover;
}

.workspace-hero-card--primary figcaption {
  left: 22px;
  right: auto;
  bottom: 22px;
  max-width: min(480px, calc(100% - 44px));
  background: rgba(16, 35, 31, 0.76);
  color: #fffaf0;
}

.workspace-hero-card--secondary {
  position: absolute;
  left: 0;
  bottom: 0;
  z-index: 3;
  width: min(42%, 360px);
  min-width: 240px;
  height: clamp(190px, 25vh, 290px);
  border: 10px solid var(--paper);
  box-shadow: 0 24px 60px rgba(19, 32, 31, 0.2);
}

.workspace-hero-index {
  position: absolute;
  right: 0;
  top: clamp(22px, 3vw, 48px);
  z-index: 3;
  display: flex;
  gap: 16px;
  margin: 0;
  color: rgba(19, 32, 31, 0.58);
  font-size: 11px;
  font-weight: 800;
  letter-spacing: 0;
  text-transform: uppercase;
  writing-mode: vertical-rl;
}

.availability-board {
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 0;
  padding: 0 clamp(24px, 8vw, 118px);
  border-top: 1px solid rgba(19, 32, 31, 0.16);
  border-bottom: 1px solid rgba(19, 32, 31, 0.16);
  background: rgba(255, 250, 240, 0.46);
}

.availability-board div {
  min-height: 190px;
  padding: clamp(24px, 3vw, 38px) clamp(18px, 2vw, 30px);
  border-right: 1px solid rgba(19, 32, 31, 0.12);
  background: transparent;
}

.availability-board div:first-child {
  border-left: 1px solid rgba(19, 32, 31, 0.12);
}

.availability-board div::before {
  right: clamp(18px, 2vw, 30px);
  top: clamp(22px, 3vw, 36px);
  border-color: rgba(167, 122, 72, 0.34);
  color: var(--accent);
}

.availability-board span,
.availability-board small {
  color: #69736b;
}

.availability-board strong {
  margin: 44px 0 14px;
  color: var(--workspace-green);
  font-size: clamp(3rem, 5.4vw, 6.25rem);
}

.workspace-breathing-room {
  display: grid;
  grid-template-columns: minmax(320px, 1fr) minmax(280px, 0.48fr);
  gap: clamp(32px, 8vw, 132px);
  align-items: end;
  padding: clamp(96px, 13vw, 196px) clamp(24px, 10vw, 154px);
  background: var(--workspace-ivory);
}

.workspace-breathing-copy h2 {
  max-width: 980px;
  margin-bottom: 0;
  font-size: clamp(3.3rem, 7vw, 7.8rem);
  line-height: 0.94;
  text-wrap: balance;
}

.workspace-breathing-room > p {
  margin: 0;
  color: #5d665f;
  font-size: clamp(1.1rem, 1.8vw, 1.45rem);
  line-height: 1.62;
}

.workspace-plan-suite {
  grid-template-columns: minmax(300px, 0.58fr) minmax(560px, 1fr);
  gap: clamp(38px, 8vw, 132px);
  padding: clamp(80px, 11vw, 164px) clamp(24px, 8vw, 118px);
  background: #ecefe8;
}

.workspace-copy-panel h2 {
  max-width: 610px;
  font-size: clamp(3rem, 5.7vw, 6.3rem);
  line-height: 0.95;
}

.workspace-copy-panel p:not(.kicker) {
  max-width: 520px;
  font-size: 1.1rem;
  line-height: 1.62;
}

.workspace-plan-suite .technical-plan {
  min-height: clamp(560px, 62vw, 760px);
  border: 1px solid rgba(19, 32, 31, 0.22);
  background:
    linear-gradient(90deg, transparent 49%, rgba(19, 32, 31, 0.06) 50%, transparent 51%) 0 0 / 72px 72px,
    linear-gradient(0deg, transparent 49%, rgba(19, 32, 31, 0.06) 50%, transparent 51%) 0 0 / 72px 72px,
    #fffaf0;
  box-shadow: inset 0 0 0 18px rgba(167, 122, 72, 0.05);
}

.workspace-plan-suite .technical-plan::before {
  position: absolute;
  left: 24px;
  top: 22px;
  z-index: 2;
  color: rgba(19, 32, 31, 0.46);
  content: "Indicative fourth floor";
  font-size: 11px;
  font-weight: 800;
  text-transform: uppercase;
}

.workspace-plan-suite .technical-plan span {
  border-color: rgba(19, 32, 31, 0.3);
  background: rgba(255, 253, 248, 0.92);
  color: #43504a;
  box-shadow: 0 12px 32px rgba(19, 32, 31, 0.06);
}

.workspace-plan-suite .technical-plan span strong {
  display: block;
  margin-bottom: 4px;
  color: var(--accent);
  font-family: Georgia, "Times New Roman", serif;
  font-size: clamp(2rem, 4vw, 4.3rem);
  font-weight: 400;
  line-height: 0.9;
}

.plan-benefits {
  gap: 10px;
}

.workspace-chip-row span,
.plan-benefits span {
  border-color: rgba(167, 122, 72, 0.3);
  background: rgba(255, 250, 240, 0.74);
  color: #5d442b;
}

.workspace-scroll-suite {
  display: grid;
  grid-template-columns: minmax(420px, 1.05fr) minmax(340px, 0.76fr);
  gap: clamp(34px, 7vw, 116px);
  align-items: start;
  padding: 0 clamp(24px, 8vw, 118px) clamp(96px, 12vw, 180px);
  background: var(--workspace-green);
  color: var(--workspace-ivory);
}

.workspace-suite-media {
  position: sticky;
  top: 96px;
  min-height: min(84vh, 840px);
  padding: clamp(70px, 9vw, 132px) 0 clamp(52px, 7vw, 96px);
}

.suite-image {
  position: relative;
  margin: 0;
  overflow: hidden;
  background: #091311;
}

.suite-image-main {
  height: min(72vh, 760px);
  box-shadow: 0 34px 100px rgba(0, 0, 0, 0.28);
}

.suite-image-main img,
.suite-image-inset img {
  height: 100%;
  object-fit: cover;
}

.suite-image-main figcaption {
  position: absolute;
  left: 20px;
  bottom: 20px;
  padding: 12px 14px;
  background: rgba(16, 35, 31, 0.74);
  color: var(--workspace-ivory);
  font-size: 11px;
  font-weight: 800;
  text-transform: uppercase;
  backdrop-filter: blur(14px);
}

.suite-image-inset {
  position: absolute;
  right: clamp(-34px, -2vw, -18px);
  bottom: clamp(34px, 6vw, 86px);
  width: min(40%, 340px);
  height: clamp(190px, 24vh, 270px);
  border: 10px solid var(--workspace-green);
  box-shadow: 0 24px 60px rgba(0, 0, 0, 0.26);
}

.workspace-suite-copy {
  display: grid;
  gap: clamp(70px, 12vh, 132px);
  padding-top: clamp(88px, 12vw, 168px);
}

.workspace-suite-copy article {
  display: grid;
  min-height: 48vh;
  align-content: center;
  padding-top: clamp(24px, 4vw, 46px);
  border-top: 1px solid rgba(255, 250, 240, 0.24);
}

.workspace-suite-copy h2 {
  max-width: 600px;
  font-size: clamp(3rem, 5.6vw, 6.4rem);
  line-height: 0.95;
}

.workspace-suite-copy p:not(.kicker) {
  max-width: 540px;
  color: rgba(255, 250, 240, 0.72);
  font-size: 1.1rem;
  line-height: 1.66;
}

.workspace-service-suite {
  grid-template-columns: minmax(320px, 0.65fr) minmax(520px, 1fr);
  gap: clamp(36px, 7vw, 112px);
  padding: clamp(86px, 11vw, 162px) clamp(24px, 8vw, 118px);
  background:
    linear-gradient(90deg, rgba(167, 122, 72, 0.16), transparent 36%),
    #111d1d;
  color: var(--workspace-ivory);
}

.workspace-service-suite .table-heading p:not(.kicker) {
  max-width: 560px;
  color: rgba(255, 250, 240, 0.66);
  font-size: 1.1rem;
  line-height: 1.62;
}

.workspace-service-suite .rows {
  gap: 0;
  border-top: 1px solid rgba(255, 250, 240, 0.14);
  background: transparent;
}

.workspace-service-suite .rows p {
  min-height: 112px;
  padding: 26px 26px 26px 82px;
  border-bottom: 1px solid rgba(255, 250, 240, 0.14);
  background: transparent;
  color: rgba(255, 250, 240, 0.7);
  line-height: 1.58;
}

.workspace-service-suite .rows p::before {
  left: 26px;
  top: 28px;
  border-color: rgba(167, 122, 72, 0.44);
  color: #d8b783;
}

.workspace-service-suite .rows span {
  color: var(--workspace-ivory);
}

.workspace-media-wall {
  grid-template-columns: repeat(12, minmax(0, 1fr));
  gap: 12px;
  padding: 12px;
  background: var(--workspace-green);
}

.workspace-media-wall figure {
  min-height: 380px;
  background: #091311;
}

.workspace-media-wall figure:nth-child(1) {
  grid-column: span 7;
  min-height: 620px;
}

.workspace-media-wall figure:nth-child(2) {
  grid-column: span 5;
  min-height: 620px;
}

.workspace-media-wall figure:nth-child(3),
.workspace-media-wall figure:nth-child(4),
.workspace-media-wall figure:nth-child(5) {
  grid-column: span 4;
}

.workspace-media-wall figure:nth-child(6) {
  grid-column: span 12;
  min-height: 560px;
}

.workspace-media-wall figure::before {
  background: var(--accent);
  box-shadow: 13px 0 0 #fffaf0;
}

.workspace-media-wall figure img {
  height: 100%;
  object-fit: cover;
}

.workspace-media-wall figcaption {
  width: fit-content;
  right: auto;
  max-width: calc(100% - 28px);
  background: rgba(16, 35, 31, 0.76);
  color: var(--workspace-ivory);
}

.workspace-page .occupier-section {
  grid-template-columns: minmax(300px, 0.72fr) minmax(420px, 1fr);
  gap: clamp(38px, 8vw, 132px);
  padding: clamp(92px, 12vw, 176px) clamp(24px, 10vw, 154px);
  background: var(--workspace-ivory);
}

.workspace-page .occupier-section h2 {
  max-width: 760px;
  font-size: clamp(3rem, 5.8vw, 6.8rem);
  line-height: 0.95;
}

.workspace-page .occupier-section > div > p {
  max-width: 520px;
  font-size: 1.1rem;
  line-height: 1.62;
}

.workspace-page .occupier-section dl {
  align-self: center;
  gap: 0;
  border-top: 1px solid rgba(19, 32, 31, 0.13);
  background: transparent;
}

.workspace-page .occupier-section dl > div {
  min-height: 142px;
  padding: 26px 26px 26px 82px;
  border-bottom: 1px solid rgba(19, 32, 31, 0.13);
  background: transparent;
}

.workspace-page .occupier-section dl > div::before {
  left: 26px;
  top: 28px;
  border-color: rgba(167, 122, 72, 0.34);
  color: var(--accent);
}

.workspace-page .occupier-section dd {
  max-width: 660px;
  color: #626b63;
  line-height: 1.58;
}

.workspace-connection-table {
  padding: clamp(82px, 10vw, 150px) clamp(24px, 10vw, 154px);
  background: #dfe7df;
}

.workspace-connection-table .commute-heading {
  display: block;
  max-width: 960px;
  margin-bottom: clamp(30px, 5vw, 70px);
  padding: 0;
  border-top: 0;
}

.workspace-connection-table .commute-heading h2 {
  font-size: clamp(3rem, 5.8vw, 6.8rem);
  line-height: 0.95;
}

.workspace-connection-table > div:not(.commute-heading) {
  grid-template-columns: minmax(160px, 0.8fr) minmax(110px, auto) minmax(240px, 1fr);
  padding: 24px 0;
  border-top-color: rgba(19, 32, 31, 0.18);
}

.workspace-connection-table .transport-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 14px;
  padding: 0;
  border-top: 0;
}

.workspace-connection-table .transport-card {
  display: grid;
  grid-template-columns: 54px 1fr;
  grid-template-areas:
    "icon station"
    "time time"
    "lines lines";
  gap: 14px 16px;
  align-items: center;
  min-height: 224px;
  padding: 22px;
  border: 1px solid rgba(19, 32, 31, 0.16);
  background: rgba(255, 250, 242, 0.52);
  box-shadow: 0 18px 44px rgba(19, 32, 31, 0.06);
}

.tube-roundel {
  grid-area: icon;
  display: block;
  box-sizing: border-box;
  width: 54px;
  height: 54px;
  border: 13px solid #1f5aa6;
  border-radius: 50%;
  background:
    linear-gradient(#c7392f, #c7392f) 50% 50% / 118% 32% no-repeat,
    #f8f4ec;
  box-shadow: inset 0 0 0 5px #f8f4ec;
}

.workspace-connection-table .transport-card__station {
  display: block;
  grid-area: station;
  grid-template-columns: none;
  min-width: 0;
  padding: 0;
  border-top: 0;
}

.workspace-connection-table .transport-card__station span {
  display: block;
  color: var(--ink);
  font-size: clamp(1.1rem, 1.45vw, 1.55rem);
  font-weight: 800;
  line-height: 1.05;
}

.workspace-connection-table .transport-card__station em {
  display: block;
  margin-top: 6px;
  color: #59645d;
  font-size: 0.82rem;
  font-style: normal;
  font-weight: 700;
  text-transform: uppercase;
  overflow-wrap: anywhere;
}

.workspace-connection-table .transport-card strong {
  grid-area: time;
  padding-top: 8px;
  color: var(--accent);
  font-size: clamp(2.45rem, 5vw, 4.85rem);
  line-height: 0.9;
}

.transport-card p {
  display: flex;
  flex-wrap: wrap;
  grid-area: lines;
  gap: 8px;
  margin: 0;
}

.transport-card p span {
  display: inline-flex;
  min-height: 28px;
  align-items: center;
  padding: 6px 9px;
  border: 1px solid rgba(19, 32, 31, 0.16);
  background: rgba(255, 255, 255, 0.48);
  color: #303b36;
  font-size: 0.78rem;
  font-weight: 800;
}

.workspace-connection-table strong {
  color: var(--accent);
  font-size: clamp(2.2rem, 4vw, 4.1rem);
}

.workspace-connection-table em {
  color: #59645d;
}

.workspace-arrival-duo {
  grid-template-columns: minmax(0, 1.16fr) minmax(0, 0.64fr);
  gap: 12px;
  padding: 12px;
  background: var(--workspace-green);
}

.workspace-arrival-duo img {
  height: clamp(520px, 66vw, 800px);
  object-fit: cover;
}

.workspace-arrival-duo img:nth-child(2) {
  height: clamp(520px, 66vw, 800px);
}

.workspace-footer {
  grid-template-columns: minmax(320px, 0.74fr) minmax(360px, 0.56fr);
  gap: clamp(36px, 8vw, 132px);
  padding: clamp(84px, 11vw, 166px) clamp(24px, 10vw, 154px);
  border-top: 0;
  background:
    linear-gradient(90deg, rgba(167, 122, 72, 0.14), transparent 42%),
    var(--workspace-green);
  color: var(--workspace-ivory);
}

.workspace-footer p:not(.kicker) {
  max-width: 520px;
  color: rgba(255, 250, 240, 0.66);
  font-size: 1.1rem;
}

.workspace-footer address {
  min-width: min(100%, 420px);
}

.workspace-footer a {
  display: grid;
  grid-template-columns: 1fr auto;
  gap: 8px 18px;
  align-items: baseline;
  border-bottom-color: rgba(255, 250, 240, 0.16);
  color: var(--workspace-ivory);
}

.workspace-footer a::after {
  color: #d8b783;
  content: "Email";
}

.workspace-footer a small {
  color: rgba(255, 250, 240, 0.52);
  font-size: 11px;
  font-style: normal;
  font-weight: 800;
  text-transform: uppercase;
}

@media (max-width: 1180px) {
  .workspace-hero {
    grid-template-columns: minmax(0, 0.9fr) minmax(0, 1fr);
    gap: clamp(34px, 5vw, 70px);
  }

  .workspace-hero h1 {
    font-size: clamp(4rem, 8vw, 7.4rem);
  }

  .workspace-plan-suite,
  .workspace-scroll-suite,
  .workspace-service-suite {
    gap: clamp(30px, 5vw, 72px);
  }
}

@media (max-width: 980px) {
  .workspace-hero,
  .workspace-breathing-room,
  .workspace-plan-suite,
  .workspace-scroll-suite,
  .workspace-service-suite,
  .workspace-page .occupier-section,
  .workspace-footer {
    grid-template-columns: 1fr;
  }

  .workspace-hero {
    min-height: auto;
    padding-top: clamp(54px, 10vw, 96px);
  }

  .workspace-hero::before {
    bottom: auto;
    height: 44%;
  }

  .workspace-hero-copy {
    max-width: 820px;
  }

  .workspace-hero-media {
    min-height: 0;
    padding: 0 0 clamp(62px, 10vw, 96px) clamp(22px, 5vw, 42px);
  }

  .workspace-hero-card--primary {
    height: clamp(430px, 70vw, 660px);
  }

  .availability-board {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .availability-board div:nth-child(odd) {
    border-left: 1px solid rgba(19, 32, 31, 0.12);
  }

  .workspace-breathing-room,
  .workspace-plan-suite,
  .workspace-page .occupier-section,
  .workspace-connection-table,
  .workspace-footer {
    padding-right: clamp(22px, 6vw, 52px);
    padding-left: clamp(22px, 6vw, 52px);
  }

  .workspace-suite-media {
    position: relative;
    top: auto;
    min-height: auto;
    padding-bottom: 84px;
  }

  .suite-image-main {
    height: clamp(420px, 70vw, 640px);
  }

  .workspace-suite-copy {
    padding-top: 0;
  }

  .workspace-suite-copy article {
    min-height: auto;
    padding-bottom: clamp(38px, 8vw, 76px);
  }

  .workspace-arrival-duo {
    grid-template-columns: 1fr;
  }

  .workspace-arrival-duo img,
  .workspace-arrival-duo img:nth-child(2) {
    height: clamp(420px, 74vw, 620px);
  }
}

@media (max-width: 720px) {
  .workspace-hero {
    padding: 42px 20px 54px;
  }

  .workspace-hero::before {
    left: 20px;
    top: 34px;
  }

  .workspace-hero-copy {
    padding-left: 18px;
  }

  .workspace-hero h1 {
    font-size: clamp(3.25rem, 15vw, 5.25rem);
    line-height: 0.92;
  }

  .workspace-hero-ledger {
    grid-template-columns: 1fr;
  }

  .workspace-hero-media {
    padding: 0;
  }

  .workspace-hero-card--primary {
    height: clamp(330px, 72vw, 480px);
  }

  .workspace-hero-card--secondary {
    position: relative;
    left: auto;
    bottom: auto;
    width: min(78%, 310px);
    min-width: 0;
    height: 190px;
    margin: -38px 0 0 auto;
    border-width: 8px;
  }

  .workspace-hero-index {
    position: static;
    flex-direction: row;
    margin-top: 18px;
    writing-mode: initial;
  }

  .availability-board {
    grid-template-columns: 1fr;
    padding: 0 20px;
  }

  .availability-board div,
  .availability-board div:first-child,
  .availability-board div:nth-child(odd) {
    min-height: 158px;
    border-left: 1px solid rgba(19, 32, 31, 0.12);
  }

  .availability-board strong {
    font-size: clamp(2.8rem, 16vw, 4.5rem);
  }

  .workspace-breathing-room,
  .workspace-plan-suite,
  .workspace-service-suite,
  .workspace-page .occupier-section,
  .workspace-connection-table,
  .workspace-footer {
    padding: 66px 20px;
  }

  .workspace-breathing-copy h2,
  .workspace-copy-panel h2,
  .workspace-suite-copy h2,
  .workspace-service-suite h2,
  .workspace-page .occupier-section h2,
  .workspace-connection-table .commute-heading h2,
  .workspace-footer h2 {
    font-size: clamp(2.75rem, 13vw, 4.5rem);
  }

  .workspace-plan-suite .technical-plan {
    min-height: 640px;
  }

  .workspace-plan-suite .technical-plan::before {
    left: 22px;
    top: 20px;
  }

  .workspace-plan-suite .technical-plan .support {
    left: 22px;
    top: 58px;
    width: calc(50% - 28px);
    height: 70px;
  }

  .workspace-plan-suite .technical-plan .booths {
    right: 22px;
    top: 58px;
    width: calc(50% - 28px);
    height: 70px;
  }

  .workspace-plan-suite .technical-plan .desk-bank {
    inset: 150px 22px 306px 22px;
  }

  .workspace-plan-suite .technical-plan .boardroom {
    left: 22px;
    bottom: 166px;
    width: calc(50% - 28px);
    height: 116px;
  }

  .workspace-plan-suite .technical-plan .meeting {
    left: auto;
    right: 22px;
    bottom: 166px;
    width: calc(50% - 28px);
    height: 116px;
  }

  .workspace-plan-suite .technical-plan .tea {
    left: 22px;
    right: 22px;
    bottom: 22px;
    width: auto;
    height: 118px;
  }

  .workspace-scroll-suite {
    padding: 0 20px 66px;
  }

  .suite-image-main {
    height: 360px;
  }

  .suite-image-inset {
    position: relative;
    right: auto;
    bottom: auto;
    width: min(82%, 320px);
    height: 190px;
    margin: -46px 0 0 auto;
    border-width: 8px;
  }

  .workspace-service-suite .rows p,
  .workspace-page .occupier-section dl > div {
    padding-left: 22px;
  }

  .workspace-service-suite .rows p::before,
  .workspace-page .occupier-section dl > div::before {
    position: static;
    margin-bottom: 16px;
  }

  .workspace-media-wall {
    grid-template-columns: 1fr;
  }

  .workspace-media-wall figure:nth-child(n) {
    grid-column: 1 / -1;
    min-height: 320px;
  }

  .workspace-connection-table > div:not(.commute-heading) {
    grid-template-columns: 1fr;
    gap: 6px;
    align-items: start;
  }

  .workspace-connection-table .transport-grid {
    grid-template-columns: 1fr;
    gap: 12px;
  }

  .workspace-connection-table .transport-card {
    grid-template-columns: 44px minmax(0, 1fr);
    grid-template-areas:
      "icon station"
      "time time"
      "lines lines";
    min-height: 0;
    padding: 18px;
  }

  .tube-roundel {
    width: 44px;
    height: 44px;
  }

  .workspace-connection-table .transport-card strong {
    align-self: center;
    justify-self: start;
    padding-top: 0;
    font-size: clamp(2rem, 12vw, 3.15rem);
    white-space: nowrap;
  }

  .workspace-footer a {
    grid-template-columns: 1fr;
  }
}

/* Workspace opening redesign */
.workspace-page .workspace-hero {
  position: relative;
  display: grid;
  grid-template-columns: 1fr;
  grid-template-rows: 1fr;
  min-height: calc(100svh - 72px);
  align-content: center;
  overflow: hidden;
  padding: clamp(46px, 7vw, 96px) clamp(22px, 7vw, 108px);
  background: var(--workspace-green);
  color: var(--workspace-ivory);
  isolation: isolate;
}

.workspace-page .workspace-hero::before {
  position: absolute;
  inset: 0;
  z-index: 2;
  width: auto;
  height: auto;
  content: "";
  background:
    linear-gradient(90deg, rgba(8, 18, 16, 0.58) 0%, rgba(8, 18, 16, 0.3) 42%, rgba(8, 18, 16, 0) 66%),
    linear-gradient(0deg, rgba(8, 18, 16, 0.34) 0%, rgba(8, 18, 16, 0) 42%);
  pointer-events: none;
}

.workspace-page .workspace-hero-media {
  position: absolute;
  inset: 0 0 0 46%;
  z-index: 1;
  min-height: 0;
  margin: 0;
  overflow: hidden;
  padding: 0;
  background: #091311;
  background-position: 68% center;
  background-size: cover;
}

.workspace-page .workspace-hero-media::before {
  position: absolute;
  inset: 0;
  z-index: 2;
  content: "";
  background:
    linear-gradient(90deg, rgba(8, 18, 16, 0.94) 0%, rgba(8, 18, 16, 0.58) 22%, rgba(8, 18, 16, 0.12) 46%, rgba(8, 18, 16, 0) 62%),
    linear-gradient(0deg, rgba(8, 18, 16, 0.9), rgba(8, 18, 16, 0.32) 42%, rgba(8, 18, 16, 0) 66%);
}

.workspace-page .workspace-hero-media img {
  width: 100%;
  max-width: none;
  height: 100%;
  object-fit: cover;
  object-position: 68% center;
  opacity: 1;
  filter: saturate(0.98) contrast(1.02);
  transform: none;
}

.workspace-page .workspace-hero-media figcaption {
  position: absolute;
  right: clamp(22px, 4vw, 64px);
  bottom: clamp(18px, 3vw, 40px);
  z-index: 4;
  padding: 10px 12px;
  border: 1px solid rgba(255, 250, 240, 0.28);
  background: rgba(8, 18, 16, 0.5);
  color: rgba(255, 250, 240, 0.76);
  font-size: 0.72rem;
  font-weight: 800;
  line-height: 1;
  text-transform: uppercase;
  backdrop-filter: blur(14px);
}

.workspace-page .workspace-hero-content {
  position: relative;
  z-index: 3;
  display: grid;
  grid-template-columns: minmax(560px, 720px) minmax(300px, 440px);
  gap: clamp(30px, 6vw, 96px);
  align-items: end;
  width: min(100%, 1600px);
  justify-content: space-between;
  margin: 0 auto;
}

.workspace-page .workspace-hero-copy {
  max-width: 820px;
  padding-left: 0;
}

.workspace-page .workspace-hero .kicker {
  color: #e0bb83;
}

.workspace-page .workspace-hero h1 {
  max-width: 620px;
  margin-bottom: 24px;
  color: var(--workspace-ivory);
  font-size: 5.45rem;
  line-height: 0.94;
  text-wrap: wrap;
}

.workspace-page .workspace-hero-copy > p:not(.kicker) {
  max-width: 590px;
  color: rgba(255, 250, 240, 0.78);
  font-size: 1.18rem;
  line-height: 1.58;
}

.workspace-hero-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  margin-top: 30px;
}

.workspace-hero-actions .primary-action,
.workspace-hero-actions .secondary-action {
  border-color: rgba(255, 250, 240, 0.74);
}

.workspace-hero-actions .primary-action {
  background: var(--workspace-ivory);
  color: var(--workspace-green);
}

.workspace-hero-actions .secondary-action {
  background: rgba(255, 250, 240, 0.08);
  color: var(--workspace-ivory);
  backdrop-filter: blur(12px);
}

.workspace-hero-actions .secondary-action:hover,
.workspace-hero-actions .secondary-action:focus-visible {
  background: rgba(255, 250, 240, 0.18);
}

.workspace-page .workspace-hero-ledger {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 1px;
  width: min(100%, 520px);
  max-width: none;
  margin: 0;
  padding: 1px;
  border: 1px solid rgba(255, 250, 240, 0.22);
  background: rgba(255, 250, 240, 0.18);
  backdrop-filter: blur(18px);
}

.workspace-page .workspace-hero-ledger div {
  min-height: 118px;
  padding: 18px;
  background: rgba(8, 18, 16, 0.58);
  backdrop-filter: none;
}

.workspace-page .workspace-hero-ledger dt {
  margin-bottom: 18px;
  color: rgba(255, 250, 240, 0.58);
  font-size: 0.68rem;
}

.workspace-page .workspace-hero-ledger dd {
  color: var(--workspace-ivory);
  font-size: 2.2rem;
}

.workspace-page .availability-board {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 1px;
  padding: clamp(18px, 3vw, 34px) clamp(22px, 7vw, 108px);
  border: 0;
  background:
    linear-gradient(90deg, rgba(37, 42, 27, 0.14), transparent 38%),
    var(--workspace-green);
}

.workspace-page .availability-board div,
.workspace-page .availability-board div:first-child,
.workspace-page .availability-board div:nth-child(odd) {
  position: relative;
  min-height: 164px;
  overflow: hidden;
  border: 0;
  background: rgba(255, 250, 240, 0.9);
}

.workspace-page .availability-board div:first-child {
  background: #1a2d29;
  color: var(--workspace-ivory);
}

.workspace-page .availability-board div::before {
  top: 20px;
  right: 20px;
  border-color: rgba(167, 122, 72, 0.32);
  color: var(--accent);
}

.workspace-page .availability-board div:first-child::before {
  border-color: rgba(255, 250, 240, 0.24);
  color: #e0bb83;
}

.workspace-page .availability-board span,
.workspace-page .availability-board small {
  color: #637066;
}

.workspace-page .availability-board div:first-child span,
.workspace-page .availability-board div:first-child small {
  color: rgba(255, 250, 240, 0.62);
}

.workspace-page .availability-board strong {
  max-width: 8.5em;
  margin: 38px 0 12px;
  color: var(--workspace-green);
  font-size: 3.35rem;
  line-height: 0.92;
}

.workspace-page .availability-board div:first-child strong {
  color: var(--workspace-ivory);
}

.workspace-page .workspace-breathing-room {
  display: grid;
  grid-template-columns: minmax(0, 0.88fr) minmax(340px, 0.55fr);
  gap: clamp(34px, 7vw, 118px);
  align-items: start;
  padding: clamp(78px, 10vw, 138px) clamp(22px, 9vw, 138px);
  border-bottom: 1px solid rgba(19, 32, 31, 0.12);
  background:
    linear-gradient(90deg, rgba(167, 122, 72, 0.1), transparent 32%),
    var(--workspace-ivory);
}

.workspace-page .workspace-breathing-copy h2 {
  max-width: 980px;
  color: var(--workspace-green);
  font-size: 6.4rem;
  line-height: 0.95;
}

.workspace-breathing-detail {
  display: grid;
  gap: 34px;
}

.workspace-page .workspace-breathing-detail > p {
  margin: 0;
  color: #5d665f;
  font-size: 1.18rem;
  line-height: 1.64;
}

.workspace-breathing-points {
  display: grid;
  gap: 0;
  margin: 0;
  padding: 0;
  border-top: 1px solid rgba(19, 32, 31, 0.14);
  list-style: none;
}

.workspace-breathing-points li {
  display: grid;
  grid-template-columns: minmax(120px, 0.46fr) 1fr;
  gap: 18px;
  padding: 20px 0;
  border-bottom: 1px solid rgba(19, 32, 31, 0.14);
}

.workspace-breathing-points strong {
  color: var(--workspace-green);
  font-family: Georgia, "Times New Roman", serif;
  font-size: 1.45rem;
  font-weight: 400;
  line-height: 1.04;
}

.workspace-breathing-points span {
  color: #667068;
  line-height: 1.55;
}

.workspace-page #workspace-plan {
  scroll-margin-top: 90px;
}

.workspace-page .workspace-plan-suite {
  grid-template-columns: minmax(320px, 0.5fr) minmax(520px, 1fr);
  gap: clamp(34px, 7vw, 112px);
  align-items: center;
  padding: clamp(76px, 9vw, 132px) clamp(22px, 7vw, 108px);
  background:
    linear-gradient(90deg, rgba(16, 35, 31, 0.06), transparent 42%),
    #ecefe8;
}

.workspace-page .workspace-copy-panel h2 {
  max-width: 650px;
  font-size: 5.4rem;
}

.workspace-page .workspace-copy-panel p:not(.kicker) {
  max-width: 560px;
  color: #59645d;
  font-size: 1.08rem;
}

.workspace-program {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 1px;
  margin: 30px 0 22px;
  padding: 1px;
  background: rgba(19, 32, 31, 0.14);
}

.workspace-program div {
  min-height: 102px;
  padding: 16px;
  background: rgba(255, 250, 240, 0.78);
}

.workspace-program dt,
.workspace-program dd {
  margin: 0;
}

.workspace-program dt {
  margin-bottom: 16px;
  color: #687169;
  font-size: 0.68rem;
  font-weight: 800;
  text-transform: uppercase;
}

.workspace-program dd {
  color: var(--workspace-green);
  font-family: Georgia, "Times New Roman", serif;
  font-size: 1.8rem;
  line-height: 0.95;
}

.workspace-page .workspace-plan-suite .technical-plan {
  min-height: 590px;
  border-color: rgba(19, 32, 31, 0.2);
  background:
    linear-gradient(90deg, transparent 49%, rgba(19, 32, 31, 0.055) 50%, transparent 51%) 0 0 / 64px 64px,
    linear-gradient(0deg, transparent 49%, rgba(19, 32, 31, 0.055) 50%, transparent 51%) 0 0 / 64px 64px,
    #fffaf0;
  box-shadow:
    inset 0 0 0 16px rgba(167, 122, 72, 0.055),
    0 24px 80px rgba(19, 32, 31, 0.1);
}

.workspace-page .workspace-plan-suite .technical-plan::before {
  left: 50%;
  top: 56px;
  transform: translateX(-50%);
}

.workspace-page .workspace-plan-suite .technical-plan span {
  align-content: center;
  border-color: rgba(19, 32, 31, 0.24);
  border-radius: 2px;
  background: rgba(255, 253, 248, 0.94);
}

.workspace-page .workspace-plan-suite .technical-plan .support {
  left: 36px;
  top: 36px;
  width: 31%;
  height: 78px;
}

.workspace-page .workspace-plan-suite .technical-plan .booths {
  right: 36px;
  top: 36px;
  width: 27%;
  height: 78px;
}

.workspace-page .workspace-plan-suite .technical-plan .desk-bank {
  inset: 138px 36px 178px;
}

.workspace-page .workspace-plan-suite .technical-plan .boardroom {
  left: 36px;
  bottom: 36px;
  width: 31%;
  height: 116px;
}

.workspace-page .workspace-plan-suite .technical-plan .meeting {
  left: 36%;
  bottom: 36px;
  width: 25%;
  height: 116px;
}

.workspace-page .workspace-plan-suite .technical-plan .tea {
  right: 36px;
  bottom: 36px;
  width: 27%;
  height: 116px;
}

@media (max-width: 1180px) {
  .workspace-page .workspace-hero h1 {
    font-size: 5.1rem;
  }

  .workspace-page .workspace-hero-ledger dd {
    font-size: 1.85rem;
  }

  .workspace-page .availability-board strong {
    font-size: 2.7rem;
  }

  .workspace-page .workspace-breathing-copy h2,
  .workspace-page .workspace-copy-panel h2 {
    font-size: 4.9rem;
  }
}

@media (max-width: 980px) {
  .workspace-page .workspace-hero {
    min-height: 820px;
    padding: clamp(48px, 8vw, 74px) clamp(22px, 6vw, 52px);
  }

  .workspace-page .workspace-hero::before {
    background:
      linear-gradient(90deg, rgba(8, 18, 16, 0.84), rgba(8, 18, 16, 0.36)),
      linear-gradient(0deg, rgba(8, 18, 16, 0.92) 0%, rgba(8, 18, 16, 0.22) 58%, rgba(8, 18, 16, 0.34) 100%);
  }

  .workspace-page .workspace-hero-content,
  .workspace-page .workspace-breathing-room,
  .workspace-page .workspace-plan-suite {
    grid-template-columns: 1fr;
  }

  .workspace-page .workspace-hero-media {
    inset: 0;
    background-position: 58% center;
  }

  .workspace-page .workspace-hero-media::before {
    background:
      linear-gradient(90deg, rgba(8, 18, 16, 0.76), rgba(8, 18, 16, 0.3)),
      linear-gradient(0deg, rgba(8, 18, 16, 0.88) 0%, rgba(8, 18, 16, 0.16) 58%, rgba(8, 18, 16, 0.24) 100%);
  }

  .workspace-page .workspace-hero-content {
    gap: 28px;
  }

  .workspace-page .workspace-hero-copy {
    max-width: 760px;
  }

  .workspace-page .workspace-hero h1 {
    font-size: 4.45rem;
  }

  .workspace-page .workspace-hero-ledger {
    width: min(100%, 640px);
  }

  .workspace-page .availability-board {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    padding-right: clamp(22px, 6vw, 52px);
    padding-left: clamp(22px, 6vw, 52px);
  }

  .workspace-page .workspace-breathing-room,
  .workspace-page .workspace-plan-suite {
    padding-right: clamp(22px, 6vw, 52px);
    padding-left: clamp(22px, 6vw, 52px);
  }

  .workspace-page .workspace-plan-suite .technical-plan {
    min-height: 560px;
  }
}

@media (max-width: 720px) {
  .workspace-page .workspace-hero {
    min-height: 760px;
    padding: 42px 20px 34px;
  }

  .workspace-page .workspace-hero-media img {
    height: calc(100% + 120px);
    object-position: center top;
    transform: translateY(-72px);
  }

  .workspace-page .workspace-hero-media {
    background-position: center top;
  }

  .workspace-page .workspace-hero-media figcaption {
    display: none;
  }

  .workspace-page .workspace-hero h1 {
    font-size: 3.35rem;
    line-height: 0.94;
  }

  .workspace-page .workspace-hero-copy > p:not(.kicker) {
    font-size: 1.04rem;
  }

  .workspace-hero-actions {
    margin-top: 24px;
  }

  .workspace-hero-actions .primary-action,
  .workspace-hero-actions .secondary-action {
    flex: 1 1 180px;
  }

  .workspace-page .workspace-hero-ledger div {
    min-height: 104px;
    padding: 15px;
  }

  .workspace-page .workspace-hero-ledger dd {
    font-size: 1.55rem;
  }

  .workspace-page .availability-board {
    padding: 1px;
  }

  .workspace-page .availability-board div,
  .workspace-page .availability-board div:first-child,
  .workspace-page .availability-board div:nth-child(odd) {
    min-height: 142px;
    padding: 20px;
  }

  .workspace-page .availability-board div::before {
    top: 16px;
    right: 16px;
  }

  .workspace-page .availability-board strong {
    margin-top: 34px;
    font-size: 2.08rem;
  }

  .workspace-page .workspace-breathing-room,
  .workspace-page .workspace-plan-suite {
    padding: 64px 20px;
  }

  .workspace-page .workspace-breathing-copy h2,
  .workspace-page .workspace-copy-panel h2 {
    font-size: 3.35rem;
  }

  .workspace-page .workspace-breathing-detail > p,
  .workspace-page .workspace-copy-panel p:not(.kicker) {
    font-size: 1rem;
  }

  .workspace-breathing-points li {
    grid-template-columns: 1fr;
    gap: 8px;
    padding: 18px 0;
  }

  .workspace-program {
    grid-template-columns: 1fr;
  }

  .workspace-page .workspace-plan-suite .technical-plan {
    min-height: 640px;
  }

  .workspace-page .workspace-plan-suite .technical-plan::before {
    left: 20px;
    top: 20px;
    transform: none;
  }

  .workspace-page .workspace-plan-suite .technical-plan .support {
    left: 20px;
    top: 58px;
    width: calc(50% - 26px);
    height: 72px;
  }

  .workspace-page .workspace-plan-suite .technical-plan .booths {
    right: 20px;
    top: 58px;
    width: calc(50% - 26px);
    height: 72px;
  }

  .workspace-page .workspace-plan-suite .technical-plan .desk-bank {
    inset: 154px 20px 304px;
  }

  .workspace-page .workspace-plan-suite .technical-plan .boardroom {
    left: 20px;
    bottom: 166px;
    width: calc(50% - 26px);
    height: 114px;
  }

  .workspace-page .workspace-plan-suite .technical-plan .meeting {
    left: auto;
    right: 20px;
    bottom: 166px;
    width: calc(50% - 26px);
    height: 114px;
  }

  .workspace-page .workspace-plan-suite .technical-plan .tea {
    right: 20px;
    bottom: 20px;
    left: 20px;
    width: auto;
    height: 118px;
  }
}

@media (max-width: 520px) {
  .workspace-page .workspace-hero {
    min-height: 820px;
  }

  .workspace-page .workspace-hero h1 {
    font-size: 3rem;
  }

  .workspace-page .workspace-hero-ledger,
  .workspace-page .availability-board {
    grid-template-columns: 1fr;
  }
}

body.workspace-page *,
body.gallery-page * {
  font-family: var(--brand-font) !important;
}

body.workspace-page .workspace-arrival-images figure,
body.workspace-page .floor-plan-figure,
body.workspace-page .suite-image,
body.workspace-page .workspace-media-wall figure,
body.workspace-page .savoy-carousel__track figure {
  overflow: hidden;
  border: 1px solid rgba(37, 42, 27, 0.16);
  border-radius: 8px;
  background: var(--ink);
  box-shadow: var(--soft-shadow);
}

body.workspace-page .workspace-arrival-duo img {
  border: 1px solid rgba(37, 42, 27, 0.16);
  border-radius: 8px;
  box-shadow: var(--soft-shadow);
}

body.gallery-page .story-media figure,
body.gallery-page .editorial-gallery figure,
body.gallery-page .floor-plan-figure,
body.gallery-page .savoy-carousel__track figure {
  overflow: hidden;
  border: 1px solid rgba(37, 42, 27, 0.16);
  border-radius: 8px;
  box-shadow: var(--soft-shadow);
}

body.workspace-page .workspace-media-wall {
  grid-template-columns: repeat(12, minmax(0, 1fr));
  gap: 12px;
  padding: 12px;
  background:
    linear-gradient(90deg, rgba(37, 42, 27, 0.1), transparent 42%),
    var(--paper);
}

body.workspace-page .workspace-media-wall figure:nth-child(n) {
  min-height: 410px;
  grid-column: span 6;
}

body.workspace-page .workspace-media-wall figure:nth-child(3) {
  grid-column: span 5;
  min-height: 520px;
}

body.workspace-page .workspace-media-wall figure:nth-child(4) {
  grid-column: span 7;
  min-height: 520px;
}

body.workspace-page .workspace-media-wall--feature figure:nth-child(n) {
  grid-column: 1 / -1;
  min-height: clamp(460px, 52vw, 760px);
}

body.workspace-page .workspace-media-wall--feature figure img {
  object-position: center;
}

body.workspace-page .workspace-media-wall figure img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

@media (max-width: 720px) {
  body.workspace-page .availability-board,
  body.workspace-page .workspace-service-suite .rows,
  body.workspace-page .workspace-media-wall,
  body.workspace-page .transport-grid {
    display: grid;
    grid-auto-flow: row;
    overflow: visible;
    overscroll-behavior-inline: auto;
    scroll-snap-type: none;
    scrollbar-width: auto;
  }

  body.workspace-page .availability-board {
    grid-template-columns: 1fr;
    gap: 10px;
    padding: 14px 20px 18px;
    border: 0;
    background: var(--paper);
  }

  body.workspace-page .availability-board div,
  body.workspace-page .availability-board div:first-child,
  body.workspace-page .availability-board div:nth-child(odd) {
    min-height: 132px;
    border: 1px solid rgba(37, 42, 27, 0.14);
    border-radius: 8px;
    background: rgba(244, 240, 223, 0.78);
    scroll-snap-align: start;
  }

  body.workspace-page .workspace-service-suite {
    gap: 24px;
    padding: 48px 20px;
  }

  body.workspace-page .workspace-service-suite h2 {
    font-size: clamp(2.35rem, 11vw, 3.35rem);
  }

  body.workspace-page .workspace-service-suite .table-heading p:not(.kicker) {
    font-size: 1rem;
    line-height: 1.48;
  }

  body.workspace-page .workspace-service-suite .rows {
    grid-template-columns: 1fr;
    gap: 10px;
    border: 0;
    padding-bottom: 10px;
  }

  body.workspace-page .workspace-service-suite .rows p {
    min-height: 0;
    padding: 18px;
    border: 1px solid rgba(244, 240, 223, 0.18);
    border-radius: 8px;
    background: rgba(244, 240, 223, 0.06);
    scroll-snap-align: start;
  }

  body.workspace-page .workspace-service-suite .rows p::before {
    position: static;
    display: inline-grid;
    margin: 0 0 14px;
  }

  body.workspace-page .workspace-media-wall {
    grid-template-columns: 1fr;
    gap: 12px;
    padding: 12px 20px 18px;
  }

  body.workspace-page .workspace-media-wall figure:nth-child(n) {
    grid-column: auto;
    min-height: 220px;
    scroll-snap-align: start;
  }

  body.workspace-page .transport-grid {
    grid-template-columns: 1fr;
    gap: 12px;
    padding-bottom: 10px;
  }

  body.workspace-page .transport-card {
    scroll-snap-align: start;
  }
}

@media (max-width: 860px) {
  body.workspace-page .site-top,
  body.gallery-page .site-top {
    position: sticky;
    top: 0;
    z-index: 60;
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 10px 12px;
    align-items: center;
    padding: 10px 16px;
    backdrop-filter: blur(18px);
  }

  body.workspace-page .wordmark,
  body.gallery-page .wordmark {
    min-width: 0;
  }

  body.workspace-page .wordmark strong,
  body.gallery-page .wordmark strong {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
  }

  body.workspace-page .site-top nav,
  body.gallery-page .site-top nav {
    grid-column: 1 / -1;
    display: flex;
    flex-wrap: nowrap;
    justify-content: flex-start;
    gap: 6px;
    overflow-x: auto;
    padding: 0 0 3px;
    scrollbar-width: none;
  }

  body.workspace-page .site-top nav::-webkit-scrollbar,
  body.gallery-page .site-top nav::-webkit-scrollbar {
    display: none;
  }

  body.workspace-page .site-top nav a,
  body.gallery-page .site-top nav a {
    flex: 0 0 auto;
  }
}

@media (max-width: 860px) {
  body.workspace-page .site-top {
    align-items: start;
    gap: 8px 12px;
    padding-bottom: 12px;
  }

  body.workspace-page .site-top nav {
    gap: 8px;
    flex-wrap: wrap;
    overflow: visible;
    padding-bottom: 0;
  }

  body.workspace-page .site-top nav a,
  body.workspace-page .top-cta {
    min-height: 44px;
    padding: 12px 14px;
    font-size: 0.8rem;
    line-height: 1.1;
  }

  body.workspace-page .wordmark strong {
    font-size: 12px;
    line-height: 1.15;
  }
}

@media (max-width: 720px) {
  body.workspace-page .workspace-hero {
    min-height: auto;
    padding: 42px 18px 20px;
  }

  body.workspace-page .workspace-hero::before {
    background:
      linear-gradient(180deg, rgba(8, 18, 16, 0.82), rgba(8, 18, 16, 0.62) 48%, rgba(8, 18, 16, 0.86));
  }

  body.workspace-page .workspace-hero-content {
    grid-template-columns: 1fr;
    gap: 22px;
    order: 1;
  }

  body.workspace-page .workspace-hero h1 {
    max-width: 9em;
    margin-bottom: 18px;
    font-size: clamp(2.8rem, 12.5vw, 3.45rem);
  }

  body.workspace-page .workspace-hero-copy > p:not(.kicker) {
    max-width: 34rem;
    font-size: 0.98rem;
    line-height: 1.5;
  }

  body.workspace-page .workspace-hero-media {
    position: relative;
    inset: auto;
    z-index: 3;
    order: 2;
    height: clamp(200px, 54vw, 280px);
    margin-top: 8px;
    border: 1px solid rgba(255, 250, 240, 0.2);
    border-radius: 8px;
    background-image: none;
    box-shadow: 0 18px 46px rgba(0, 0, 0, 0.24);
  }

  body.workspace-page .workspace-hero-media::before {
    display: none;
  }

  body.workspace-page .workspace-hero-media img {
    height: 100%;
    opacity: 1;
    object-position: center;
    transform: none;
  }

  body.workspace-page .workspace-hero-ledger {
    grid-template-columns: 1fr;
  }

  body.workspace-page .workspace-hero-ledger div {
    min-height: 92px;
    padding: 13px;
  }

  body.workspace-page .workspace-hero-ledger dt {
    margin-bottom: 12px;
  }

  body.workspace-page .workspace-hero-ledger dd {
    font-size: clamp(1.18rem, 6vw, 1.45rem);
  }

  body.workspace-page .workspace-breathing-room,
  body.workspace-page .workspace-plan-suite,
  body.workspace-page .workspace-service-suite,
  body.workspace-page .occupier-section,
  body.workspace-page .workspace-connection-table,
  body.workspace-page .site-map-section,
  body.workspace-page .workspace-footer,
  body.workspace-page .savoy-carousel {
    padding: 48px 18px;
  }

  body.workspace-page .workspace-breathing-copy h2,
  body.workspace-page .workspace-copy-panel h2,
  body.workspace-page .workspace-suite-copy h2,
  body.workspace-page .workspace-service-suite h2,
  body.workspace-page .occupier-section h2,
  body.workspace-page .workspace-connection-table .commute-heading h2,
  body.workspace-page .site-map-section h2,
  body.workspace-page .workspace-footer h2,
  body.workspace-page .savoy-carousel__copy h2 {
    font-size: clamp(2.35rem, 10.5vw, 3.25rem);
    line-height: 0.98;
  }

  body.workspace-page .workspace-arrival-editorial {
    gap: 24px;
    padding: 46px 18px 42px;
  }

  body.workspace-page .workspace-arrival-copy {
    gap: 16px;
  }

  body.workspace-page .workspace-arrival-images,
  body.workspace-page .floor-plan-pair,
  body.workspace-page .workspace-suite-copy,
  body.workspace-page .occupier-section dl,
  body.workspace-page .workspace-arrival-duo {
    display: grid;
    grid-auto-flow: row;
    overflow: visible;
    overscroll-behavior-inline: auto;
    scroll-snap-type: none;
    scrollbar-width: auto;
  }

  body.workspace-page .workspace-arrival-images {
    grid-template-columns: 1fr;
    gap: 12px;
  }

  body.workspace-page .workspace-arrival-images figure,
  body.workspace-page .floor-plan-pair .floor-plan-figure,
  body.workspace-page .workspace-suite-copy article,
  body.workspace-page .occupier-section dl > div,
  body.workspace-page .workspace-arrival-duo img {
    scroll-snap-align: start;
  }

  body.workspace-page .workspace-arrival-images img {
    height: clamp(210px, 62vw, 260px);
  }

  body.workspace-page .floor-plan-pair {
    grid-template-columns: 1fr;
    width: 100%;
    justify-self: stretch;
    padding-bottom: 8px;
  }

  body.workspace-page .workspace-plan-suite .floor-plan-pair .floor-plan-figure {
    aspect-ratio: 3008 / 1408;
  }

  body.workspace-page .workspace-scroll-suite {
    gap: 24px;
    padding: 0 18px 48px;
  }

  body.workspace-page .workspace-suite-media {
    padding: 48px 0 0;
  }

  body.workspace-page .suite-image-main {
    height: clamp(220px, 60vw, 300px);
  }

  body.workspace-page .suite-image-inset {
    display: none;
  }

  body.workspace-page .workspace-suite-copy {
    grid-template-columns: 1fr;
    gap: 12px;
    padding: 0 0 8px;
  }

  body.workspace-page .workspace-suite-copy article {
    min-height: 0;
    padding: 20px;
    border: 1px solid rgba(255, 250, 240, 0.18);
    border-radius: 8px;
    background: rgba(255, 250, 240, 0.06);
  }

  body.workspace-page .workspace-breathing-points li {
    padding: 15px 0;
  }

  body.workspace-page .workspace-program {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  body.workspace-page .plan-benefits {
    flex-wrap: nowrap;
    overflow-x: auto;
    padding-bottom: 6px;
    scrollbar-width: thin;
  }

  body.workspace-page .plan-benefits span {
    flex: 0 0 auto;
  }

  body.workspace-page .occupier-section dl {
    grid-template-columns: 1fr;
    border-top: 0;
    gap: 10px;
  }

  body.workspace-page .occupier-section dl > div {
    min-height: 0;
    padding: 18px;
    border: 1px solid rgba(37, 42, 27, 0.14);
    border-radius: 8px;
    background: rgba(244, 240, 223, 0.74);
  }

  body.workspace-page .site-map-wrap,
  body.workspace-page .gallery-map__live {
    min-height: 340px;
  }

  body.workspace-page .workspace-arrival-duo {
    grid-template-columns: 1fr;
    gap: 12px;
    padding: 12px 18px;
  }

  body.workspace-page .workspace-arrival-duo img,
  body.workspace-page .workspace-arrival-duo img:nth-child(2) {
    height: clamp(220px, 60vw, 280px);
  }
}

@media (max-width: 520px) {
  body.workspace-page .workspace-hero {
    min-height: auto;
  }

  body.workspace-page .workspace-hero-ledger {
    grid-template-columns: 1fr;
  }

  body.workspace-page .workspace-program {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 720px) {
  body.gallery-page .gallery-cover {
    min-height: 590px;
  }

  body.gallery-page .gallery-cover__content {
    padding: 64px 18px 92px;
  }

  body.gallery-page .gallery-cover h1 {
    max-width: 9em;
    font-size: clamp(2.7rem, 12vw, 3.45rem);
  }

  body.gallery-page .gallery-cover__markers {
    flex-wrap: nowrap;
    overflow-x: auto;
    width: 100%;
    padding-bottom: 6px;
    scrollbar-width: thin;
  }

  body.gallery-page .gallery-cover__markers span {
    flex: 0 0 auto;
  }

  body.gallery-page .gallery-scroll-cue {
    width: auto;
    min-height: 36px;
    padding: 9px 12px;
  }

  body.gallery-page .magazine-intro,
  body.gallery-page .gallery-scroll-story,
  body.gallery-page .gallery-spec,
  body.gallery-page .floor-plan-section,
  body.gallery-page .brochure-panels,
  body.gallery-page .gallery-map,
  body.gallery-page .savoy-carousel,
  body.gallery-page .contact-footer {
    padding: 46px 18px;
  }

  body.gallery-page .magazine-intro {
    gap: 24px;
  }

  body.gallery-page .magazine-intro > p {
    font-family: var(--brand-font);
    font-size: clamp(1.7rem, 8vw, 2.45rem);
    line-height: 1.14;
  }

  body.gallery-page .intro-card {
    padding-top: 18px;
  }

  body.gallery-page .gallery-scroll-story {
    gap: 18px;
  }

  body.gallery-page .story-media,
  body.gallery-page .story-copy,
  body.gallery-page .editorial-gallery,
  body.gallery-page .gallery-spec-grid,
  body.gallery-page .brochure-panels,
  body.gallery-page .gallery-map-points {
    display: grid;
    grid-auto-flow: column;
    overflow-x: auto;
    overscroll-behavior-inline: contain;
    scroll-snap-type: x mandatory;
    scrollbar-width: thin;
  }

  body.gallery-page .story-media {
    grid-auto-columns: minmax(260px, 82vw);
    gap: 12px;
    min-height: 0;
    background: transparent;
    box-shadow: none;
  }

  body.gallery-page .story-media figure,
  body.gallery-page .story-media figure.is-active,
  body.gallery-page .story-media figure.is-before,
  body.gallery-page .story-media figure.is-after {
    position: relative;
    height: 315px;
    opacity: 1;
    transform: none;
    scroll-snap-align: start;
  }

  body.gallery-page .story-media img {
    height: 100%;
  }

  body.gallery-page .story-copy {
    grid-auto-columns: minmax(260px, 82vw);
    gap: 12px;
    padding-bottom: 8px;
  }

  body.gallery-page .story-copy article,
  body.gallery-page .story-copy article.is-active,
  body.gallery-page .story-copy article.is-before,
  body.gallery-page .story-copy article.is-after {
    min-height: 0;
    padding: 20px;
    scroll-snap-align: start;
  }

  body.gallery-page .story-copy h2,
  body.gallery-page .gallery-spec__intro h2,
  body.gallery-page .floor-plan-copy h2,
  body.gallery-page .brochure-panels h2,
  body.gallery-page .gallery-map h2,
  body.gallery-page .savoy-carousel__copy h2,
  body.gallery-page .contact-footer h2 {
    font-size: clamp(2.25rem, 10vw, 3.25rem);
    line-height: 0.98;
  }

  body.gallery-page .editorial-gallery {
    grid-auto-columns: minmax(245px, 78vw);
    grid-template-columns: none;
    gap: 12px;
    padding: 12px 18px 18px;
  }

  body.gallery-page .editorial-gallery figure,
  body.gallery-page .editorial-gallery .large,
  body.gallery-page .editorial-gallery .wide {
    grid-column: auto;
    grid-row: auto;
    scroll-snap-align: start;
  }

  body.gallery-page .editorial-gallery img,
  body.gallery-page .editorial-gallery .large img {
    height: 310px;
  }

  body.gallery-page .gallery-spec-grid {
    grid-auto-columns: minmax(210px, 72vw);
    grid-template-columns: none;
    gap: 10px;
    background: transparent;
    padding-bottom: 8px;
  }

  body.gallery-page .gallery-spec-grid span {
    min-height: 118px;
    border: 1px solid rgba(37, 42, 27, 0.14);
    border-radius: 8px;
    scroll-snap-align: start;
  }

  body.gallery-page .brochure-panels {
    grid-auto-columns: minmax(270px, 84vw);
    grid-template-columns: none;
    gap: 12px;
    background: transparent;
  }

  body.gallery-page .brochure-panels article {
    min-height: 0;
    padding: 24px;
    border: 1px solid rgba(37, 42, 27, 0.14);
    border-radius: 8px;
    scroll-snap-align: start;
  }

  body.gallery-page .gallery-map-points {
    grid-auto-columns: minmax(145px, 44vw);
    grid-template-columns: none;
    gap: 10px;
    background: transparent;
    padding-bottom: 8px;
  }

  body.gallery-page .gallery-map-points span {
    border: 1px solid rgba(37, 42, 27, 0.14);
    border-radius: 8px;
    scroll-snap-align: start;
  }

  body.gallery-page .gallery-map__live,
  body.gallery-page .site-map-wrap {
    min-height: 330px;
  }

  body.gallery-page .savoy-carousel__track {
    min-height: 300px;
  }
}

.capital-page {
  --cap-ink: #111817;
  --cap-paper: #f4efe4;
  --cap-panel: #fffaf0;
  --cap-muted: #635e55;
  --cap-line: rgba(17, 24, 23, 0.14);
  --cap-gold: #b8894d;
  --cap-green: #24483f;
  --cap-blue: #223f5d;
  --cap-rust: #8f473b;
  --cap-plum: #4c3447;
  --accent: var(--cap-gold);
  background:
    linear-gradient(180deg, #f4efe4 0%, #eef2ec 42%, #f7efe5 100%);
  color: var(--cap-ink);
}

.capital-page .site-top {
  background: color-mix(in srgb, var(--cap-paper) 90%, white);
}

.capital-page h1,
.capital-page h2,
.capital-page h3 {
  letter-spacing: 0;
}

.capital-page h1 {
  max-width: 1040px;
  margin-bottom: 24px;
  font-size: 5.6rem;
  line-height: 0.95;
}

.capital-page h2 {
  max-width: 880px;
  margin-bottom: 20px;
  font-size: 4.2rem;
  line-height: 0.96;
}

.capital-page h3 {
  margin: 0 0 16px;
  font-size: 1.1rem;
  font-weight: 900;
  line-height: 1.1;
  text-transform: uppercase;
}

.capital-page p {
  color: var(--cap-muted);
}

.capital-kicker {
  margin: 0 0 14px;
  color: var(--cap-gold);
  font-size: 0.75rem;
  font-weight: 900;
  letter-spacing: 0;
  text-transform: uppercase;
}

.capital-hero {
  position: relative;
  display: grid;
  min-height: calc(100svh - 72px);
  overflow: hidden;
  align-items: end;
  background: var(--cap-ink);
  color: var(--cap-panel);
  isolation: isolate;
}

.capital-hero-media,
.capital-hero-media img,
.capital-hero-shade {
  position: absolute;
  inset: 0;
}

.capital-hero-media {
  z-index: -3;
  margin: 0;
}

.capital-hero-media img {
  height: 100%;
  object-fit: cover;
  opacity: 0.82;
}

.capital-hero-shade {
  z-index: -2;
  background:
    linear-gradient(90deg, rgba(9, 16, 15, 0.96) 0%, rgba(9, 16, 15, 0.72) 46%, rgba(9, 16, 15, 0.12) 100%),
    linear-gradient(0deg, rgba(9, 16, 15, 0.92) 0%, rgba(9, 16, 15, 0.42) 56%, rgba(9, 16, 15, 0.2) 100%);
}

.capital-hero-content {
  max-width: 1180px;
  padding: clamp(72px, 10vw, 128px) clamp(22px, 8vw, 112px) clamp(38px, 6vw, 70px);
}

.capital-hero-content p:not(.capital-kicker) {
  max-width: 760px;
  color: rgba(255, 250, 240, 0.78);
  font-size: 1.35rem;
  line-height: 1.28;
}

.capital-hero-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  margin-top: 30px;
}

.capital-hero .primary-action {
  border-color: var(--cap-gold);
  background: var(--cap-gold);
  color: var(--cap-ink);
}

.capital-hero .secondary-action {
  border-color: rgba(255, 250, 240, 0.44);
  background: rgba(255, 250, 240, 0.06);
  color: var(--cap-panel);
}

.capital-hero-metrics {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  margin: 0;
  padding: 1px;
  background: rgba(255, 250, 240, 0.22);
}

.capital-hero-metrics div {
  min-height: 112px;
  padding: 18px clamp(18px, 3vw, 36px);
  background: rgba(12, 20, 19, 0.76);
  backdrop-filter: blur(18px);
}

.capital-hero-metrics dt,
.capital-hero-metrics dd {
  margin: 0;
}

.capital-hero-metrics dt {
  margin-bottom: 14px;
  color: rgba(255, 250, 240, 0.58);
  font-size: 0.72rem;
  font-weight: 900;
  text-transform: uppercase;
}

.capital-hero-metrics dd {
  color: var(--cap-panel);
  font-family: Georgia, "Times New Roman", serif;
  font-size: 2rem;
  line-height: 1;
}

.capital-intro,
.capital-universe,
.capital-outreach,
.capital-tracking,
.capital-stack,
.capital-data-room {
  padding: clamp(64px, 9vw, 128px) clamp(20px, 7vw, 104px);
}

.capital-intro {
  display: grid;
  grid-template-columns: minmax(280px, 0.88fr) minmax(320px, 1fr);
  gap: clamp(26px, 6vw, 90px);
  align-items: end;
  background:
    linear-gradient(90deg, rgba(36, 72, 63, 0.12), transparent 48%),
    var(--cap-paper);
}

.capital-intro p:not(.capital-kicker) {
  max-width: 720px;
  margin-bottom: 0;
  font-size: 1.22rem;
  line-height: 1.45;
}

.capital-stage-path {
  display: grid;
  grid-column: 1 / -1;
  grid-template-columns: repeat(9, minmax(0, 1fr));
  gap: 1px;
  margin: 14px 0 0;
  padding: 1px;
  background: var(--cap-line);
  list-style: none;
}

.capital-stage-path li {
  min-height: 74px;
  padding: 14px 10px;
  background: rgba(255, 250, 240, 0.76);
  color: var(--cap-green);
  font-size: 0.74rem;
  font-weight: 900;
  line-height: 1.15;
  text-align: center;
  text-transform: uppercase;
}

.capital-section-head {
  max-width: 900px;
  margin-bottom: 34px;
}

.capital-section-head p:not(.capital-kicker) {
  max-width: 680px;
  font-size: 1.08rem;
}

.capital-funnel {
  padding: clamp(64px, 9vw, 126px) clamp(20px, 6vw, 88px);
  background: var(--cap-ink);
  color: var(--cap-panel);
}

.capital-funnel .capital-section-head p:not(.capital-kicker) {
  color: rgba(255, 250, 240, 0.68);
}

.capital-funnel-grid {
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: 1px;
  margin: 0;
  padding: 1px;
  background: rgba(255, 250, 240, 0.24);
  list-style: none;
}

.capital-funnel-grid li {
  position: relative;
  min-height: 186px;
  padding: 20px;
  overflow: hidden;
  background:
    linear-gradient(145deg, rgba(184, 137, 77, 0.16), transparent 48%),
    #17211f;
}

.capital-funnel-grid li:nth-child(3n + 2) {
  background:
    linear-gradient(145deg, rgba(34, 63, 93, 0.34), transparent 50%),
    #17211f;
}

.capital-funnel-grid li:nth-child(3n) {
  background:
    linear-gradient(145deg, rgba(143, 71, 59, 0.28), transparent 52%),
    #17211f;
}

.capital-funnel-grid span,
.capital-buyer-grid span,
.capital-touch-grid span,
.capital-final-signal span {
  display: inline-grid;
  min-height: 30px;
  place-items: center;
  margin-bottom: 28px;
  color: var(--cap-gold);
  font-family: Georgia, "Times New Roman", serif;
  font-size: 1.35rem;
  line-height: 1;
}

.capital-funnel-grid strong,
.capital-buyer-grid strong,
.capital-touch-grid strong {
  display: block;
  margin-bottom: 10px;
  color: inherit;
  font-size: 1rem;
  font-weight: 900;
  line-height: 1.08;
  text-transform: uppercase;
}

.capital-funnel-grid small {
  display: block;
  color: rgba(255, 250, 240, 0.62);
  font-size: 0.88rem;
  line-height: 1.36;
}

.capital-universe {
  display: grid;
  grid-template-columns: minmax(280px, 0.62fr) minmax(0, 1fr);
  gap: clamp(28px, 6vw, 92px);
  align-items: start;
  background:
    linear-gradient(90deg, rgba(184, 137, 77, 0.12), transparent 44%),
    #f7f0e6;
}

.capital-universe-copy {
  position: sticky;
  top: 104px;
}

.capital-universe-copy p:not(.capital-kicker) {
  max-width: 620px;
  font-size: 1.08rem;
}

.capital-buyer-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 1px;
  background: var(--cap-line);
}

.capital-buyer-grid article {
  min-height: 232px;
  padding: 24px;
  background: var(--cap-panel);
}

.capital-buyer-grid article:last-child {
  grid-column: 1 / -1;
  min-height: 190px;
  background:
    linear-gradient(90deg, rgba(36, 72, 63, 0.1), transparent 48%),
    var(--cap-panel);
}

.capital-buyer-grid span,
.capital-touch-grid span {
  margin-bottom: 38px;
  color: var(--cap-rust);
}

.capital-buyer-grid p,
.capital-touch-grid p {
  margin-bottom: 0;
}

.capital-signal-band {
  padding: clamp(64px, 9vw, 128px) clamp(20px, 7vw, 104px);
  background:
    linear-gradient(135deg, rgba(34, 63, 93, 0.12), transparent 42%),
    #eef2ec;
}

.capital-signal-layout {
  display: grid;
  grid-template-columns: minmax(260px, 0.9fr) minmax(260px, 0.8fr) minmax(280px, 0.72fr);
  gap: 1px;
  background: var(--cap-line);
}

.capital-signal-list,
.capital-enrichment-list,
.capital-scorecard {
  padding: 26px;
  background: var(--cap-panel);
}

.capital-signal-list ul,
.capital-remarketing ul {
  display: grid;
  gap: 10px;
  margin: 0;
  padding: 0;
  list-style: none;
}

.capital-signal-list li,
.capital-remarketing li {
  position: relative;
  padding-left: 20px;
  color: var(--cap-muted);
}

.capital-signal-list li::before,
.capital-remarketing li::before {
  position: absolute;
  left: 0;
  top: 0.62em;
  width: 7px;
  height: 7px;
  background: var(--cap-rust);
  content: "";
}

.capital-enrichment-list p {
  margin-bottom: 0;
  font-size: 1.03rem;
}

.capital-scorecard {
  background: var(--cap-green);
  color: var(--cap-panel);
}

.capital-scorecard .capital-kicker {
  color: var(--cap-gold);
}

.capital-scorecard h3 {
  margin-bottom: 22px;
  color: var(--cap-panel);
  font-family: Georgia, "Times New Roman", serif;
  font-size: 5.6rem;
  font-weight: 400;
  line-height: 0.86;
  text-transform: none;
}

.capital-scorecard dl,
.capital-tracking-grid dl {
  display: grid;
  gap: 1px;
  margin: 0;
  background: rgba(255, 250, 240, 0.2);
}

.capital-scorecard div,
.capital-tracking-grid dl div {
  display: grid;
  grid-template-columns: 1fr auto;
  gap: 14px;
  padding: 11px 0;
}

.capital-scorecard dt,
.capital-scorecard dd,
.capital-tracking-grid dt,
.capital-tracking-grid dd {
  margin: 0;
}

.capital-scorecard dt {
  color: rgba(255, 250, 240, 0.72);
}

.capital-scorecard dd,
.capital-tracking-grid dd {
  font-weight: 900;
}

.capital-outreach {
  background: #f7f0e6;
}

.capital-touch-grid {
  display: grid;
  grid-template-columns: repeat(6, minmax(0, 1fr));
  gap: 1px;
  margin-bottom: 36px;
  background: var(--cap-line);
}

.capital-touch-grid article {
  min-height: 220px;
  padding: 20px;
  background: var(--cap-panel);
}

.capital-email-panel {
  display: grid;
  grid-template-columns: minmax(260px, 0.58fr) minmax(320px, 1fr);
  gap: clamp(24px, 5vw, 74px);
  align-items: stretch;
  padding: clamp(26px, 5vw, 54px);
  background:
    linear-gradient(90deg, rgba(76, 52, 71, 0.22), transparent 44%),
    var(--cap-ink);
  color: var(--cap-panel);
}

.capital-email-panel p:not(.capital-kicker) {
  color: rgba(255, 250, 240, 0.7);
}

.capital-email-panel h3 {
  color: var(--cap-panel);
  font-family: Georgia, "Times New Roman", serif;
  font-size: 3rem;
  font-weight: 400;
  line-height: 0.95;
  text-transform: none;
}

.capital-email-panel pre {
  min-height: 340px;
  margin: 0;
  padding: 24px;
  overflow-x: auto;
  border: 1px solid rgba(255, 250, 240, 0.2);
  background: rgba(255, 250, 240, 0.08);
  color: var(--cap-panel);
  font-family: "Courier New", Courier, monospace;
  font-size: 0.95rem;
  line-height: 1.55;
  white-space: pre-wrap;
}

.capital-tracking {
  background:
    linear-gradient(90deg, rgba(36, 72, 63, 0.12), transparent 46%),
    #eef2ec;
}

.capital-link-strip {
  display: grid;
  grid-template-columns: minmax(180px, 0.28fr) minmax(0, 1fr);
  gap: 18px;
  align-items: center;
  margin-bottom: 24px;
  padding: 18px 22px;
  background: var(--cap-green);
  color: var(--cap-panel);
}

.capital-link-strip strong {
  font-size: 0.78rem;
  font-weight: 900;
  text-transform: uppercase;
}

.capital-link-strip p {
  margin-bottom: 0;
  color: rgba(255, 250, 240, 0.72);
}

.capital-link-strip code {
  padding: 2px 5px;
  background: rgba(255, 250, 240, 0.12);
  color: var(--cap-panel);
  font-family: "Courier New", Courier, monospace;
  font-size: 0.92em;
}

.capital-tracking-grid {
  display: grid;
  grid-template-columns: minmax(280px, 1fr) minmax(260px, 0.78fr) minmax(260px, 0.8fr);
  gap: 1px;
  background: var(--cap-line);
}

.capital-tracking-grid article {
  min-height: 310px;
  padding: 26px;
  background: var(--cap-panel);
}

.capital-tracking-grid ol {
  display: grid;
  gap: 9px;
  margin: 0;
  padding-left: 20px;
  color: var(--cap-muted);
}

.capital-tracking-grid dl {
  background: var(--cap-line);
}

.capital-tracking-grid dl div {
  padding: 11px 0;
  background: var(--cap-panel);
}

.capital-tracking-grid article:nth-child(3) {
  background: var(--cap-blue);
  color: var(--cap-panel);
}

.capital-tracking-grid article:nth-child(3) h3,
.capital-tracking-grid article:nth-child(3) p,
.capital-tracking-grid article:nth-child(3) strong {
  color: var(--cap-panel);
}

.capital-tracking-grid article:nth-child(3) p {
  margin-bottom: 14px;
}

.capital-event-cloud {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-top: 26px;
}

.capital-event-cloud span {
  min-height: 34px;
  padding: 8px 11px;
  border: 1px solid rgba(36, 72, 63, 0.26);
  background: rgba(255, 250, 240, 0.78);
  color: var(--cap-green);
  font-size: 0.75rem;
  font-weight: 900;
  line-height: 1.2;
  text-transform: uppercase;
}

.capital-remarketing {
  display: grid;
  grid-template-columns: minmax(0, 0.86fr) minmax(300px, 0.7fr);
  gap: clamp(28px, 6vw, 92px);
  align-items: center;
  padding: clamp(64px, 9vw, 128px) clamp(20px, 7vw, 104px);
  background: var(--cap-ink);
  color: var(--cap-panel);
}

.capital-remarketing figure {
  position: relative;
  min-height: 560px;
  margin: 0;
  overflow: hidden;
  background: var(--cap-green);
}

.capital-remarketing img {
  position: absolute;
  inset: 0;
  height: 100%;
  object-fit: cover;
}

.capital-remarketing p {
  color: rgba(255, 250, 240, 0.68);
  font-size: 1.08rem;
}

.capital-remarketing li {
  color: rgba(255, 250, 240, 0.72);
}

.capital-stack {
  background: #f7f0e6;
}

.capital-stack-table {
  display: grid;
  gap: 1px;
  background: var(--cap-line);
}

.capital-stack-table div {
  display: grid;
  grid-template-columns: minmax(190px, 0.32fr) minmax(0, 1fr);
  gap: 18px;
  min-height: 70px;
  align-items: center;
  padding: 18px 22px;
  background: var(--cap-panel);
}

.capital-stack-table span {
  color: var(--cap-rust);
  font-size: 0.78rem;
  font-weight: 900;
  text-transform: uppercase;
}

.capital-stack-table strong {
  font-size: 1rem;
  line-height: 1.35;
}

.capital-data-room {
  display: grid;
  grid-template-columns: minmax(280px, 0.74fr) minmax(280px, 0.62fr);
  gap: clamp(28px, 6vw, 90px);
  align-items: center;
  background:
    linear-gradient(90deg, rgba(143, 71, 59, 0.14), transparent 48%),
    #eef2ec;
}

.capital-data-room p:not(.capital-kicker) {
  max-width: 700px;
  font-size: 1.08rem;
}

.capital-final-signal {
  min-height: 360px;
  padding: 30px;
  background:
    linear-gradient(135deg, rgba(184, 137, 77, 0.16), transparent 52%),
    var(--cap-plum);
  color: var(--cap-panel);
}

.capital-final-signal span {
  display: block;
  margin-bottom: 80px;
  color: var(--cap-gold);
  font-size: 0.75rem;
  font-family: Arial, Helvetica, sans-serif;
  font-weight: 900;
  text-transform: uppercase;
}

.capital-final-signal strong {
  display: block;
  margin-bottom: 22px;
  font-family: Georgia, "Times New Roman", serif;
  font-size: 2.6rem;
  font-weight: 400;
  line-height: 1;
}

.capital-final-signal p {
  max-width: 420px;
  margin-bottom: 0;
  color: rgba(255, 250, 240, 0.72);
}

.capital-footer {
  background:
    linear-gradient(90deg, rgba(36, 72, 63, 0.3), transparent 44%),
    var(--cap-ink);
}

@media (max-width: 1180px) {
  .capital-page h1 {
    font-size: 4.6rem;
  }

  .capital-page h2 {
    font-size: 3.45rem;
  }

  .capital-funnel-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .capital-stage-path {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }

  .capital-touch-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }

  .capital-signal-layout,
  .capital-tracking-grid {
    grid-template-columns: 1fr 1fr;
  }

  .capital-scorecard,
  .capital-tracking-grid article:first-child {
    grid-column: 1 / -1;
  }
}

@media (max-width: 900px) {
  .capital-page .site-top,
  .capital-intro,
  .capital-universe,
  .capital-email-panel,
  .capital-link-strip,
  .capital-remarketing,
  .capital-data-room {
    grid-template-columns: 1fr;
  }

  .capital-page .site-top {
    position: static;
  }

  .capital-page .site-top nav {
    justify-content: flex-start;
  }

  .capital-page h1 {
    font-size: 3.65rem;
  }

  .capital-page h2 {
    font-size: 2.85rem;
  }

  .capital-hero {
    min-height: calc(100svh - 92px);
  }

  .capital-hero-metrics,
  .capital-buyer-grid,
  .capital-signal-layout,
  .capital-tracking-grid {
    grid-template-columns: 1fr;
  }

  .capital-universe-copy {
    position: static;
  }

  .capital-buyer-grid article:last-child,
  .capital-scorecard,
  .capital-tracking-grid article:first-child {
    grid-column: auto;
  }

  .capital-remarketing figure {
    min-height: 420px;
  }
}

@media (max-width: 620px) {
  .capital-page .site-top nav {
    gap: 4px;
  }

  .capital-page h1 {
    font-size: 3rem;
  }

  .capital-page h2 {
    font-size: 2.35rem;
  }

  .capital-hero-content {
    padding: 64px 20px 34px;
  }

  .capital-hero-content p:not(.capital-kicker),
  .capital-intro p:not(.capital-kicker) {
    font-size: 1.03rem;
  }

  .capital-hero-actions a {
    width: 100%;
  }

  .capital-funnel-grid,
  .capital-stage-path,
  .capital-touch-grid,
  .capital-stack-table div {
    grid-template-columns: 1fr;
  }

  .capital-funnel-grid li,
  .capital-touch-grid article {
    min-height: 168px;
  }

  .capital-scorecard h3 {
    font-size: 4.6rem;
  }

  .capital-email-panel pre {
    min-height: 300px;
    padding: 18px;
    font-size: 0.86rem;
  }

  .capital-final-signal strong {
    font-size: 2.05rem;
  }
}

/* Real floor-plan asset */
.floor-plan-section {
  display: grid;
  grid-template-columns: minmax(260px, 0.58fr) minmax(0, 1fr);
  gap: clamp(28px, 6vw, 90px);
  align-items: center;
  padding: clamp(58px, 8vw, 116px) clamp(20px, 6vw, 88px);
  background:
    linear-gradient(90deg, rgba(180, 138, 78, 0.12), transparent 44%),
    #f1e8da;
  color: var(--ink);
}

.floor-plan-section--gallery {
  background:
    linear-gradient(90deg, rgba(136, 66, 56, 0.1), transparent 46%),
    #f7f0e6;
}

.floor-plan-section--home {
  grid-template-columns: minmax(260px, 0.52fr) minmax(0, 0.98fr);
  gap: clamp(52px, 8vw, 132px);
  padding: clamp(92px, 11vw, 166px) clamp(22px, 8vw, 118px);
  background:
    linear-gradient(90deg, rgba(180, 138, 78, 0.08), transparent 52%),
    #fbf6ed;
}

.floor-plan-section--location {
  margin: 0 clamp(20px, 6vw, 88px) clamp(44px, 8vw, 100px);
  border: 1px solid rgba(21, 24, 23, 0.14);
  border-radius: 10px;
  background:
    linear-gradient(90deg, rgba(180, 138, 78, 0.12), transparent 48%),
    #f4efe4;
  color: var(--ink);
  box-shadow: 0 24px 80px rgba(0, 0, 0, 0.16);
}

.floor-plan-section--capital {
  background:
    linear-gradient(90deg, rgba(36, 72, 63, 0.12), transparent 48%),
    #eef2ec;
}

.floor-plan-copy {
  max-width: 620px;
}

.floor-plan-copy h2 {
  max-width: 760px;
  margin-bottom: 18px;
  font-size: clamp(3rem, 6vw, 5.7rem);
  line-height: 0.94;
}

.floor-plan-copy p:last-child {
  max-width: 560px;
  margin-bottom: 0;
  color: color-mix(in srgb, currentColor 68%, transparent);
  font-size: clamp(1rem, 1.3vw, 1.18rem);
  line-height: 1.55;
}

.floor-plan-section--home .floor-plan-copy {
  max-width: 540px;
}

.floor-plan-section--home .floor-plan-copy h2 {
  font-size: clamp(3.1rem, 5.4vw, 4.8rem);
}

.floor-plan-section--home .floor-plan-figure {
  width: min(100%, 860px);
  justify-self: end;
  box-shadow: 0 24px 70px rgba(17, 20, 19, 0.13);
}

.floor-plan-figure {
  position: relative;
  display: grid;
  aspect-ratio: 1800 / 1715;
  margin: 0;
  overflow: hidden;
  border: 1px solid rgba(21, 24, 23, 0.18);
  border-radius: 8px;
  background:
    radial-gradient(circle at 24% 18%, rgba(180, 138, 78, 0.14), transparent 32%),
    #fffaf2;
  box-shadow: 0 28px 90px rgba(17, 20, 19, 0.18);
}

.floor-plan-section--location .floor-plan-figure {
  border-color: rgba(21, 24, 23, 0.18);
  box-shadow: 0 28px 90px rgba(17, 20, 19, 0.2);
}

.floor-plan-figure img {
  width: 100%;
  height: 100%;
  padding: clamp(10px, 2vw, 30px);
  object-fit: contain;
}

.floor-plan-figure figcaption {
  position: absolute;
  top: 14px;
  left: 14px;
  max-width: calc(100% - 28px);
  padding: 9px 12px;
  border: 1px solid rgba(255, 250, 242, 0.16);
  border-radius: 999px;
  background: rgba(8, 8, 7, 0.72);
  color: #fffaf2;
  font-size: 0.68rem;
  font-weight: 900;
  letter-spacing: 0;
  line-height: 1;
  text-transform: uppercase;
}

.floor-plan-figure--heritage,
.floor-plan-figure--workspace {
  min-height: 0;
}

.floor-editorial,
.workspace-page .workspace-plan-suite {
  background:
    linear-gradient(90deg, rgba(180, 138, 78, 0.08), transparent 45%),
    #f4efe4;
}

.workspace-page .workspace-plan-suite .floor-plan-figure {
  width: min(100%, 980px);
  justify-self: end;
  aspect-ratio: 3008 / 1408;
  border-radius: 6px;
}

.floor-plan-pair {
  display: grid;
  gap: 16px;
  width: min(100%, 980px);
  justify-self: end;
}

.workspace-page .workspace-plan-suite .floor-plan-pair .floor-plan-figure {
  width: 100%;
  justify-self: stretch;
}

.workspace-page .workspace-plan-suite .floor-plan-figure img {
  padding: 0;
  object-fit: cover;
}

.workspace-page .workspace-plan-suite .floor-plan-figure figcaption {
  top: auto;
  bottom: 14px;
  left: 14px;
  background: rgba(16, 35, 31, 0.74);
  backdrop-filter: blur(14px);
}

@media (max-width: 1180px) {
  .floor-plan-section {
    grid-template-columns: 1fr;
  }

  .floor-plan-copy {
    max-width: 780px;
  }
}

@media (max-width: 720px) {
  .floor-plan-section {
    padding: 46px 18px;
  }

  .floor-plan-section--location {
    margin-right: 18px;
    margin-left: 18px;
  }

  .floor-plan-copy h2 {
    font-size: clamp(2.45rem, 14vw, 3.5rem);
  }

  .floor-plan-figure figcaption {
    top: 10px;
    left: 10px;
    max-width: calc(100% - 20px);
    font-size: 0.62rem;
  }

  .floor-plan-figure img {
    padding: 8px;
  }
}

/* Global Savoy Court brand alignment */
:root {
  --ink: #252a1b;
  --paper: #e3e0cc;
  --muted: #686957;
  --line: rgba(37, 42, 27, 0.16);
  --white: #f4f0df;
  --gold: #894e24;
  --green: #252a1b;
  --blue: #384432;
  --red: #894e24;
  --plum: #3a3328;
  --sage: #d7d6c5;
  --copper: #894e24;
  --shadow: 0 24px 80px rgba(37, 42, 27, 0.18);
  --soft-shadow: 0 16px 48px rgba(37, 42, 27, 0.14);
  --brand-font: helvetica-lt-pro, Helvetica, Arial, sans-serif;
}

body,
button,
input,
select,
textarea,
.home-page,
.template-page,
.location-cinema {
  font-family: var(--brand-font);
}

h1,
h2,
h3,
.home-hero h1,
.hub-hero-copy h1,
.location-hero-title,
.location-cinema h1,
.location-cinema h2,
.capital-page h1,
.capital-page h2,
.wordmark span,
.home-mark span {
  font-family: var(--brand-font);
  font-weight: 500;
  letter-spacing: 0;
}

.heritage-page,
.workspace-page,
.gallery-page,
.location-page,
.capital-page,
.home-page,
.hub-page,
.location-cinema {
  --accent: #894e24;
  --gallery-green: #252a1b;
  --gallery-blue: #384432;
  --gallery-brass: #894e24;
  --gallery-cream: #e3e0cc;
  --home-paper: #e3e0cc;
  --champagne: #e3e0cc;
  --obsidian: #252a1b;
  background-color: var(--paper);
  color: var(--ink);
}

.hub-page {
  background:
    linear-gradient(180deg, #e3e0cc 0%, #d7d6c5 56%, #ece8d8 100%);
}

.site-top,
.hub-header,
.home-top,
.location-island {
  border-color: rgba(37, 42, 27, 0.16);
  background: rgba(227, 224, 204, 0.9);
  color: var(--ink);
}

.home-mark span,
.wordmark span,
.location-logo span {
  border-color: var(--ink);
  background: var(--ink);
  color: var(--paper);
}

.top-cta,
.home-actions a,
.home-hero-cta,
.capital-hero-actions a,
.site-top nav a[aria-current="page"],
.location-island nav a[aria-current="page"] {
  border-color: var(--accent);
}

.top-cta:hover,
.top-cta:focus-visible,
.home-actions a:hover,
.home-actions a:focus-visible,
.capital-hero-actions a:hover,
.capital-hero-actions a:focus-visible {
  background: var(--ink);
  color: var(--paper);
}

.kicker,
.home-kicker,
.capital-kicker,
.site-map-kicker,
.floor-plan-copy .kicker,
.location-eyebrow,
.workspace-eyebrow,
.gallery-kicker {
  color: var(--accent);
}

.floor-plan-section,
.floor-plan-section--gallery,
.floor-plan-section--home,
.floor-plan-section--location,
.floor-plan-section--capital,
.floor-editorial,
.workspace-page .workspace-plan-suite {
  background:
    linear-gradient(90deg, rgba(137, 78, 36, 0.12), transparent 48%),
    var(--paper);
  color: var(--ink);
}

.floor-plan-figure,
.floor-plan-section--home .floor-plan-figure,
.floor-plan-section--location .floor-plan-figure,
.workspace-page .workspace-plan-suite .floor-plan-figure {
  border-color: rgba(37, 42, 27, 0.18);
  background:
    radial-gradient(circle at 24% 18%, rgba(137, 78, 36, 0.12), transparent 32%),
    #f4f0df;
  box-shadow: var(--soft-shadow);
}

.floor-plan-figure figcaption,
.home-hero-panel,
.hero-panel,
.capital-email-panel pre {
  background: rgba(37, 42, 27, 0.88);
  color: var(--paper);
}

body.workspace-page .workspace-plan-suite .floor-plan-figure {
  border-color: rgba(37, 42, 27, 0.16);
  background: #111f1c;
  box-shadow:
    inset 0 0 0 1px rgba(244, 240, 223, 0.18),
    0 24px 70px rgba(37, 42, 27, 0.14);
}

.site-map,
.gallery-map,
.location-map,
.workspace-map {
  border-color: rgba(37, 42, 27, 0.18);
}

body.home-page *,
body.template-page *,
body.hub-page * {
  font-family: var(--brand-font) !important;
}

.home-page main,
.template-page main,
.hub-page main {
  background-color: var(--paper);
}

.home-page section,
.template-page section {
  border-color: rgba(37, 42, 27, 0.14);
}

.home-page [class*="card"],
.template-page [class*="card"],
.home-page [class*="panel"],
.template-page [class*="panel"],
.home-page [class*="stat"],
.template-page [class*="stat"],
.home-page [class*="spec"],
.template-page [class*="spec"] {
  border-color: rgba(37, 42, 27, 0.16);
}

.home-page a,
.template-page a,
.hub-page a {
  text-decoration-color: rgba(137, 78, 36, 0.48);
}

.home-page a:hover,
.home-page a:focus-visible,
.template-page a:hover,
.template-page a:focus-visible,
.hub-page a:hover,
.hub-page a:focus-visible {
  color: var(--accent);
}

.home-page ::selection,
.template-page ::selection,
.hub-page ::selection {
  background: var(--ink);
  color: var(--paper);
}

.global-email-cta {
  position: fixed;
  right: clamp(14px, 2vw, 26px);
  bottom: clamp(14px, 2vw, 26px);
  z-index: 80;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 44px;
  padding: 12px 18px;
  border: 1px solid rgba(227, 224, 204, 0.6);
  border-radius: 999px;
  background: var(--ink);
  color: var(--paper);
  box-shadow: 0 18px 52px rgba(37, 42, 27, 0.28);
  font-size: 0.72rem;
  font-weight: 800;
  letter-spacing: 0;
  line-height: 1;
  text-decoration: none;
  text-transform: uppercase;
}

.global-email-cta:hover,
.global-email-cta:focus-visible {
  background: var(--accent);
  color: var(--paper);
}

/* Cookie consent banner (built entirely in script.js; appears only on pages
   whose <body> carries data-ga4 / data-clarity). Small card bottom-left on
   desktop; on phones it becomes a full-width bar lifted ABOVE the fixed
   mobile CTA bars (.lombard-mobile-cta / .nbs-mobile-cta, z-index 95, about
   66px tall plus safe-area inset). */
.consent-banner {
  position: fixed;
  left: clamp(14px, 2vw, 26px);
  bottom: clamp(14px, 2vw, 26px);
  z-index: 140;
  box-sizing: border-box;
  max-width: min(360px, calc(100vw - 28px));
  padding: 18px 20px;
  border: 1px solid var(--line, rgba(0, 0, 0, 0.18));
  border-radius: 14px;
  background: var(--surface-strong, #fff);
  color: var(--ink, #1f1f1f);
  box-shadow: 0 18px 52px rgba(0, 0, 0, 0.22);
  font-size: 0.85rem;
  line-height: 1.5;
}

.consent-banner__heading {
  margin: 0 0 6px;
  font-family: inherit;
  font-size: 0.95rem;
  font-weight: 800;
  letter-spacing: 0;
  line-height: 1.3;
  text-transform: none;
}

.consent-banner__copy {
  margin: 0 0 14px;
}

.consent-banner__actions {
  display: flex;
  gap: 10px;
}

/* Accept and Decline share size and weight on purpose: declining must be as
   easy as accepting. Only the fill differs. */
.consent-banner__actions button {
  flex: 1 1 0;
  min-height: 44px;
  padding: 10px 14px;
  border: 1px solid var(--ink, #1f1f1f);
  border-radius: 999px;
  background: transparent;
  color: var(--ink, #1f1f1f);
  font: inherit;
  font-size: 0.74rem;
  font-weight: 800;
  letter-spacing: 0;
  line-height: 1;
  text-transform: uppercase;
  cursor: pointer;
}

.consent-banner__actions button:focus-visible {
  outline: 2px solid var(--accent, #1f1f1f);
  outline-offset: 2px;
}

/* Accept is the primary action: filled, same size and order as Decline. */
.consent-banner__actions .consent-banner__accept {
  background: var(--ink, #1f1f1f);
  color: var(--surface-strong, #fff);
}

@media (max-width: 720px) {
  .consent-banner {
    left: 0;
    right: 0;
    bottom: calc(74px + env(safe-area-inset-bottom, 0px));
    max-width: none;
    border-left: 0;
    border-right: 0;
    border-radius: 0;
  }
}

/* Lombard palette: ivory card, terracotta primary, ink ghost secondary. */
body.lombard-page .consent-banner {
  background: var(--ivory);
  color: var(--ink);
}

/* --accent-dark instead of --accent: the terracotta fill only reaches 4.24:1
   with the small uppercase label; the dark tone clears WCAG AA at 6.2:1. */
body.lombard-page .consent-banner__accept {
  border-color: var(--accent-dark, #8f493d);
  background: var(--accent-dark, #8f493d);
  color: var(--white);
}

body.lombard-page .consent-banner__accept:hover,
body.lombard-page .consent-banner__accept:focus-visible {
  background: var(--ink);
  color: var(--white);
}

body.lombard-page .consent-banner__decline:hover,
body.lombard-page .consent-banner__decline:focus-visible {
  background: var(--ink);
  color: var(--ivory);
}

/* NBS palette: white card, SQUARE corners everywhere, coral kept for the
   accept CTA only (matches .nbs-mobile-cta__book). */
body.workspace-page.nbs-page .consent-banner,
body.workspace-page.nbs-page .consent-banner__actions button {
  border-radius: 0;
}

body.workspace-page.nbs-page .consent-banner {
  background: var(--white);
  color: var(--ink);
}

/* Coral darkened with ink: pure coral is 3.5:1 with white small text, below
   WCAG AA; this mix reads coral but measures 4.9:1. */
body.workspace-page.nbs-page .consent-banner__accept {
  border-color: color-mix(in srgb, var(--accent) 75%, var(--ink));
  background: color-mix(in srgb, var(--accent) 75%, var(--ink));
  color: var(--white);
}

body.workspace-page.nbs-page .consent-banner__accept:hover,
body.workspace-page.nbs-page .consent-banner__accept:focus-visible {
  background: var(--ink);
  border-color: var(--ink);
  color: var(--white);
}

body.workspace-page.nbs-page .consent-banner__decline:hover,
body.workspace-page.nbs-page .consent-banner__decline:focus-visible {
  background: var(--ink);
  color: var(--white);
}

/* NBS consent banner shape: the shared small floating card (see the base
   .consent-banner rules above) sat low-left over the hero copy/buttons on
   first visit. Reshaped here into a slim bar pinned to the page's bottom
   edge instead - full width, one row on desktop (copy left, actions right
   via a two-column grid; the heading and paragraph stack in column one,
   actions spans both rows in column two). Text, buttons, ids and the show/
   hide mechanics in consent.js are untouched - this only changes layout. */
@media (min-width: 721px) {
  body.workspace-page.nbs-page .consent-banner {
    left: 0;
    right: 0;
    bottom: 0;
    max-width: none;
    width: 100%;
    display: grid;
    grid-template-columns: 1fr auto;
    column-gap: 32px;
    align-items: center;
    padding: 16px clamp(24px, 4vw, 56px);
    border-width: 1px 0 0;
    box-shadow: 0 -14px 40px rgba(18, 22, 16, 0.16);
  }

  body.workspace-page.nbs-page .consent-banner__heading {
    grid-column: 1;
    grid-row: 1;
    margin: 0 0 2px;
    font-size: 0.82rem;
  }

  body.workspace-page.nbs-page .consent-banner__copy {
    grid-column: 1;
    grid-row: 2;
    margin: 0;
    max-width: 62ch;
  }

  body.workspace-page.nbs-page .consent-banner__actions {
    grid-column: 2;
    grid-row: 1 / 3;
    justify-self: end;
  }
}

/* Phones: still the full-width bar (shared mobile rule above already lifts
   it above the sticky Call/Arrange bar via bottom: calc(74px + safe area),
   left unchanged here), just slimmer padding and a touch smaller type so
   heading/copy/actions stack compactly instead of reading as a tall card. */
@media (max-width: 720px) {
  body.workspace-page.nbs-page .consent-banner {
    padding: 14px 16px;
    box-shadow: 0 -10px 28px rgba(18, 22, 16, 0.16);
  }

  body.workspace-page.nbs-page .consent-banner__heading {
    font-size: 0.86rem;
  }

  body.workspace-page.nbs-page .consent-banner__copy {
    font-size: 0.78rem;
  }
}

/* Footer "Cookie choices" reopen control: plain underlined text button that
   inherits each footer's light-on-dark palette. */
.consent-settings-link {
  margin-top: 12px;
  padding: 0;
  border: 0;
  background: none;
  color: inherit;
  font: inherit;
  font-size: 0.8rem;
  text-decoration: underline;
  text-underline-offset: 3px;
  cursor: pointer;
  opacity: 0.82;
}

.consent-settings-link:hover,
.consent-settings-link:focus-visible {
  opacity: 1;
}

.consent-settings-link:focus-visible {
  outline: 2px solid currentColor;
  outline-offset: 2px;
}

.savoy-carousel {
  display: grid;
  grid-template-columns: minmax(260px, 0.48fr) minmax(0, 1fr);
  gap: clamp(28px, 5vw, 76px);
  align-items: center;
  padding: clamp(58px, 8vw, 118px) clamp(20px, 6vw, 88px);
  border-top: 1px solid rgba(37, 42, 27, 0.14);
  border-bottom: 1px solid rgba(37, 42, 27, 0.14);
  background:
    linear-gradient(90deg, rgba(137, 78, 36, 0.1), transparent 48%),
    var(--paper);
  color: var(--ink);
}

.savoy-carousel__copy {
  max-width: 520px;
}

.savoy-carousel__copy h2 {
  max-width: 620px;
  margin-bottom: 18px;
  font-size: clamp(2.6rem, 5.6vw, 5.1rem);
  line-height: 0.92;
}

.savoy-carousel__copy p:not(.kicker) {
  max-width: 440px;
  color: rgba(37, 42, 27, 0.72);
  font-size: clamp(1rem, 1.25vw, 1.15rem);
  line-height: 1.55;
}

.savoy-carousel__cta {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 42px;
  margin-top: 12px;
  padding: 12px 16px;
  border: 1px solid var(--accent);
  background: var(--ink);
  color: var(--paper);
  font-size: 0.74rem;
  font-weight: 850;
  letter-spacing: 0;
  text-decoration: none;
  text-transform: uppercase;
}

.savoy-carousel__stage {
  position: relative;
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto;
  gap: 14px;
  align-items: center;
}

.savoy-carousel__track {
  position: relative;
  min-height: clamp(320px, 44vw, 640px);
  overflow: hidden;
  border: 1px solid rgba(37, 42, 27, 0.16);
  background: #f4f0df;
  box-shadow: var(--soft-shadow);
}

.savoy-carousel__track figure {
  position: absolute;
  inset: 0;
  display: grid;
  margin: 0;
  opacity: 0;
  transform: scale(1.015);
  transition: opacity 360ms ease, transform 520ms ease;
  pointer-events: none;
}

.savoy-carousel__track figure.is-active {
  opacity: 1;
  transform: scale(1);
  pointer-events: auto;
}

.savoy-carousel__track img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.savoy-carousel__track figcaption {
  position: absolute;
  left: 18px;
  bottom: 18px;
  max-width: calc(100% - 36px);
  padding: 10px 12px;
  background: rgba(37, 42, 27, 0.86);
  color: var(--paper);
  font-size: 0.72rem;
  font-weight: 850;
  line-height: 1;
  text-transform: uppercase;
}

.savoy-carousel__control,
.savoy-carousel__dots button {
  border: 1px solid rgba(37, 42, 27, 0.2);
  background: rgba(244, 240, 223, 0.9);
  color: var(--ink);
  cursor: pointer;
}

.savoy-carousel__control {
  width: 48px;
  height: 48px;
  overflow: hidden;
  white-space: nowrap;
  text-indent: 110%;
}

.savoy-carousel__control::before {
  content: ">";
  display: grid;
  width: 100%;
  height: 100%;
  place-items: center;
  text-indent: 0;
  font-size: 1.15rem;
  font-weight: 900;
}

.savoy-carousel__control[data-carousel-prev]::before {
  content: "<";
}

.savoy-carousel__control:hover,
.savoy-carousel__control:focus-visible,
.savoy-carousel__dots button:hover,
.savoy-carousel__dots button:focus-visible,
.savoy-carousel__dots button.is-active {
  background: var(--ink);
  color: var(--paper);
}

.savoy-carousel__dots {
  position: absolute;
  right: 76px;
  bottom: 18px;
  display: flex;
  gap: 8px;
}

.savoy-carousel__dots button {
  width: 10px;
  height: 10px;
  padding: 0;
  border-radius: 999px;
}

@media (max-width: 900px) {
  .savoy-carousel {
    grid-template-columns: 1fr;
  }

  .savoy-carousel__stage {
    grid-template-columns: 1fr 1fr;
  }

  .savoy-carousel__track {
    grid-column: 1 / -1;
    grid-row: 1;
  }

  .savoy-carousel__control {
    grid-row: 2;
    width: 100%;
  }

  .savoy-carousel__dots {
    right: 18px;
  }
}

@media (max-width: 640px) {
  .global-email-cta {
    right: 12px;
    bottom: 12px;
    min-height: 40px;
    padding: 11px 14px;
    font-size: 0.68rem;
  }

  .savoy-carousel {
    padding: 46px 18px;
  }

  .savoy-carousel__track {
    min-height: 320px;
  }
}

/* Root website selector */
.selector-page {
  --paper: #f5f1e8;
  --ink: #14201d;
  --muted: #66706b;
  --accent: #252a1b;
  --selector-line: rgba(20, 32, 29, 0.14);
  --selector-panel: #fffaf1;
  --selector-dark: #172321;
  min-height: 100svh;
  background: var(--paper);
  color: var(--ink);
  font-family: var(--brand-font);
}

.selector-top {
  position: sticky;
  top: 0;
  z-index: 20;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 24px;
  min-height: 74px;
  padding: 14px clamp(18px, 4vw, 46px);
  border-bottom: 1px solid var(--selector-line);
  background: rgba(245, 241, 232, 0.94);
  backdrop-filter: blur(18px);
}

.selector-page .wordmark span {
  width: 40px;
  height: 40px;
  background: var(--selector-dark);
  color: var(--paper);
  font-size: 15px;
}

.selector-page .wordmark strong {
  max-width: 200px;
  line-height: 1.15;
}

.selector-top nav {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  justify-content: flex-end;
}

.selector-top nav a {
  min-height: 36px;
  padding: 9px 11px;
  border: 1px solid transparent;
  color: inherit;
  font-size: 12px;
  font-weight: 800;
  text-decoration: none;
  text-transform: uppercase;
}

.selector-top nav a:hover,
.selector-top nav a:focus-visible {
  background: rgba(255, 250, 241, 0.64);
  border-color: currentColor;
}

.selector-hero {
  display: grid;
  grid-template-rows: auto 1fr;
  gap: clamp(28px, 4vw, 54px);
  min-height: calc(100svh - 74px);
  padding: clamp(28px, 5vw, 70px) clamp(18px, 4vw, 54px) clamp(38px, 5vw, 72px);
}

.selector-hero__copy {
  display: grid;
  grid-template-columns: minmax(280px, 0.72fr) minmax(320px, 1fr);
  gap: clamp(20px, 5vw, 72px);
  align-items: end;
  max-width: 1320px;
}

.selector-hero h1 {
  max-width: 780px;
  margin-bottom: 0;
  font-size: clamp(46px, 7vw, 106px);
  line-height: 0.92;
}

.selector-hero__copy p:not(.kicker),
.selector-legacy__copy p {
  max-width: 540px;
  color: var(--muted);
  font-size: clamp(17px, 1.5vw, 21px);
  line-height: 1.5;
}

.selector-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: clamp(16px, 2.2vw, 28px);
  min-height: 0;
}

.selector-card {
  display: grid;
  grid-template-rows: minmax(300px, 0.94fr) auto;
  min-height: min(66svh, 720px);
  overflow: hidden;
  border: 1px solid var(--selector-line);
  background: var(--selector-panel);
  color: inherit;
  text-decoration: none;
  transition:
    border-color 180ms ease,
    transform 180ms ease,
    box-shadow 180ms ease;
}

.selector-card:hover,
.selector-card:focus-visible {
  border-color: rgba(20, 32, 29, 0.34);
  box-shadow: 0 22px 52px rgba(20, 32, 29, 0.13);
  transform: translateY(-2px);
}

.selector-card figure {
  position: relative;
  min-height: 0;
  margin: 0;
  overflow: hidden;
  background: #d8d3c6;
}

.selector-card figure::after {
  position: absolute;
  inset: auto 0 0;
  height: 46%;
  background: linear-gradient(180deg, rgba(20, 32, 29, 0) 0%, rgba(20, 32, 29, 0.64) 100%);
  content: "";
}

.selector-card img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform 520ms ease;
}

.selector-card figcaption {
  position: absolute;
  right: 18px;
  bottom: 16px;
  z-index: 1;
  color: #fffaf1;
  font-size: 12px;
  font-weight: 800;
  text-transform: uppercase;
}

.selector-card:hover img,
.selector-card:focus-visible img {
  transform: scale(1.035);
}

.selector-card__body {
  display: grid;
  align-content: start;
  gap: 16px;
  min-height: 288px;
  padding: clamp(22px, 3vw, 36px);
}

.selector-card__meta {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  align-items: center;
  justify-content: space-between;
}

.selector-card span {
  color: var(--site-accent, var(--accent));
  font-size: 12px;
  font-weight: 800;
  letter-spacing: 0;
  text-transform: uppercase;
}

.selector-card__meta small {
  padding: 6px 8px;
  border: 1px solid rgba(20, 32, 29, 0.16);
  color: var(--ink);
  font-size: 11px;
  font-weight: 800;
  text-transform: uppercase;
}

.selector-card strong {
  max-width: 620px;
  font-family: Georgia, "Times New Roman", serif;
  font-size: clamp(34px, 4vw, 62px);
  font-weight: 400;
  line-height: 0.98;
}

.selector-card p {
  max-width: 520px;
  margin: 0;
  color: var(--muted);
  font-size: 16px;
  line-height: 1.45;
}

.selector-card__facts {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 1px;
  margin: 4px 0 0;
  padding: 1px;
  background: rgba(20, 32, 29, 0.13);
}

.selector-card__facts div {
  min-height: 82px;
  padding: 12px;
  background: rgba(255, 250, 241, 0.78);
}

.selector-card__facts dt {
  margin-bottom: 12px;
  color: var(--muted);
  font-size: 11px;
  font-weight: 800;
  text-transform: uppercase;
}

.selector-card__facts dd {
  margin: 0;
  color: var(--ink);
  font-size: 14px;
  font-weight: 800;
  line-height: 1.2;
}

.selector-card em {
  align-self: end;
  justify-self: start;
  margin-top: 14px;
  min-height: 42px;
  padding: 12px 15px;
  border: 1px solid currentColor;
  background: var(--selector-dark);
  color: var(--paper);
  font-size: 12px;
  font-style: normal;
  font-weight: 800;
  text-transform: uppercase;
}

.selector-card em::after {
  content: " ->";
}

.selector-card--nbs {
  --site-accent: #252a1b;
}

.selector-card--lombard {
  --site-accent: #8b623e;
}

.selector-card--lombard-v2 {
  --site-accent: #c9503c;
}

.selector-legacy {
  display: grid;
  grid-template-columns: minmax(240px, 0.42fr) minmax(360px, 1fr);
  gap: clamp(20px, 4vw, 48px);
  align-items: start;
  padding: clamp(36px, 5vw, 66px) clamp(18px, 4vw, 54px);
  border-top: 1px solid var(--selector-line);
  background: var(--selector-dark);
  color: var(--paper);
}

.selector-legacy h2 {
  margin-bottom: 10px;
  font-size: clamp(36px, 4vw, 58px);
  line-height: 1;
}

.selector-legacy .kicker {
  color: #d6b27f;
}

.selector-legacy__copy p {
  color: rgba(245, 241, 232, 0.72);
}

.legacy-links {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
}

.legacy-links a {
  display: grid;
  min-height: 108px;
  align-content: space-between;
  gap: 14px;
  padding: 18px;
  border: 1px solid rgba(245, 241, 232, 0.18);
  background: rgba(245, 241, 232, 0.06);
  color: inherit;
  text-decoration: none;
  transition:
    border-color 180ms ease,
    background 180ms ease;
}

.legacy-links a:hover,
.legacy-links a:focus-visible {
  border-color: rgba(245, 241, 232, 0.48);
  background: rgba(245, 241, 232, 0.12);
}

.legacy-links span {
  font-size: 16px;
  font-weight: 800;
}

.legacy-links small {
  color: rgba(245, 241, 232, 0.68);
}

.selector-email-library {
  padding: clamp(44px, 6vw, 82px) clamp(18px, 4vw, 54px);
  border-top: 1px solid var(--selector-line);
  background:
    linear-gradient(180deg, rgba(255, 250, 241, 0.72), rgba(237, 231, 220, 0.92)),
    var(--paper);
}

.selector-email-library__intro {
  display: grid;
  grid-template-columns: minmax(260px, 0.44fr) minmax(340px, 0.56fr);
  gap: clamp(20px, 4vw, 48px);
  align-items: end;
  max-width: 1320px;
  margin: 0 auto clamp(22px, 4vw, 44px);
}

.selector-email-library h2 {
  max-width: 720px;
  margin-bottom: 0;
  font-size: clamp(38px, 5vw, 72px);
  line-height: 0.98;
}

.selector-email-library__intro p:not(.kicker) {
  max-width: 570px;
  margin: 0;
  color: var(--muted);
  font-size: clamp(17px, 1.45vw, 20px);
  line-height: 1.52;
}

.newsletter-template-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: clamp(18px, 2.4vw, 30px);
  max-width: 1320px;
  margin: 0 auto;
}

.newsletter-template-card {
  display: grid;
  gap: 16px;
  align-content: start;
  min-width: 0;
  min-height: 100%;
}

/* Keep the two preview frames level: each card shares the parent
   grid's row tracks, so both summaries take the taller height. */
@supports (grid-template-rows: subgrid) {
  .newsletter-template-card {
    grid-row: span 2;
    grid-template-rows: subgrid;
  }
}

.newsletter-template-card__summary {
  display: grid;
  gap: 16px;
  align-content: start;
  padding: clamp(18px, 2vw, 26px);
  border: 1px solid var(--selector-line);
  border-radius: 8px;
  background: var(--selector-panel);
  box-shadow: 0 16px 42px rgba(20, 32, 29, 0.08);
}

.newsletter-template-card__summary span,
.newsletter-template-card__summary dt,
.newsletter-eyebrow,
.newsletter-facts dt {
  color: var(--accent);
  font-size: 11px;
  font-weight: 900;
  letter-spacing: 0;
  line-height: 1.25;
  text-transform: uppercase;
}

.newsletter-eyebrow {
  margin: 0;
}

.newsletter-template-card__summary h3 {
  max-width: 590px;
  margin: 0;
  font-family: Georgia, "Times New Roman", serif;
  font-size: clamp(30px, 3vw, 46px);
  font-weight: 400;
  line-height: 1;
}

.newsletter-template-card__summary dl {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 1px;
  margin: 0;
  padding: 1px;
  background: rgba(20, 32, 29, 0.12);
}

.newsletter-template-card__summary dl div {
  min-height: 96px;
  padding: 14px 15px;
  background: rgba(245, 241, 232, 0.72);
}

.newsletter-template-card__summary dt {
  margin-bottom: 8px;
}

.newsletter-template-card__summary dd {
  margin: 0;
  color: var(--ink);
  font-size: 15px;
  font-weight: 600;
  line-height: 1.4;
}

.newsletter-preview {
  padding: clamp(14px, 2vw, 22px);
  border: 1px solid rgba(20, 32, 29, 0.14);
  border-radius: 8px;
  background: #ddd6c7;
  box-shadow: 0 18px 50px rgba(20, 32, 29, 0.12);
  overflow: hidden;
}

/* Live previews: the cards embed the actual Mailchimp export files
   (nbs-email.html / lombard-email.html) so what is reviewed here is
   exactly what gets pasted into Mailchimp. */
.newsletter-preview--live iframe {
  display: block;
  width: 100%;
  height: clamp(520px, 64vh, 760px);
  border: 0;
  background: #ffffff;
}

.newsletter-template-card__actions {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 10px 18px;
  margin-top: 4px;
}

.newsletter-download-btn {
  display: inline-flex;
  min-height: 46px;
  align-items: center;
  justify-content: center;
  gap: 9px;
  padding: 13px 20px;
  border: 1px solid var(--ink);
  background: var(--ink);
  color: #fffaf1;
  font-size: 12px;
  font-weight: 900;
  letter-spacing: 0.05em;
  line-height: 1;
  text-decoration: none;
  text-transform: uppercase;
  transition:
    background 180ms ease,
    color 180ms ease,
    transform 180ms ease;
}

.newsletter-download-btn::after {
  content: "\2193";
  font-size: 13px;
}

.newsletter-download-btn:hover,
.newsletter-download-btn:focus-visible {
  background: transparent;
  color: var(--ink);
  transform: translateY(-2px);
}

.newsletter-open-link {
  display: inline-block;
  color: var(--ink);
  font-size: 13px;
  font-weight: 700;
  letter-spacing: 0.04em;
  text-decoration: underline;
  text-underline-offset: 3px;
}

.newsletter-email {
  width: min(100%, 600px);
  margin: 0 auto;
  background: #eee5d3;
  color: #252a1b;
  font-family: var(--brand-font);
  box-shadow: 0 18px 42px rgba(20, 32, 29, 0.2);
}

.newsletter-viewline {
  padding: 10px 18px;
  background: #ffffff;
  color: #424242;
  font-size: 11px;
  line-height: 1.35;
  text-align: center;
}

.newsletter-viewline a {
  color: inherit;
  text-decoration: underline;
}

.newsletter-hero {
  position: relative;
  display: grid;
  min-height: 520px;
  overflow: hidden;
  background: #111d1d;
  isolation: isolate;
}

.newsletter-hero::after {
  position: absolute;
  inset: 0;
  z-index: 1;
  background:
    linear-gradient(90deg, rgba(12, 18, 22, 0.86) 0%, rgba(12, 18, 22, 0.62) 42%, rgba(12, 18, 22, 0.16) 100%),
    linear-gradient(0deg, rgba(37, 42, 27, 0.78) 0%, rgba(37, 42, 27, 0) 54%);
  content: "";
}

.newsletter-hero img {
  display: block;
  width: 100%;
  object-fit: cover;
}

.newsletter-hero img {
  position: absolute;
  inset: 0;
  height: 100%;
  object-position: center;
}

.newsletter-hero__overlay {
  position: relative;
  z-index: 2;
  display: grid;
  width: min(100%, 440px);
  align-content: end;
  gap: 16px;
  min-height: 520px;
  padding: 34px 30px;
  color: #fffaf1;
}

.newsletter-hero__overlay h4,
.newsletter-deck h5,
.newsletter-story-panel h5 {
  margin: 0;
  font-family: Georgia, "Times New Roman", serif;
  font-weight: 400;
  line-height: 0.98;
}

.newsletter-hero__overlay h4 {
  font-size: 52px;
}

.newsletter-hero__overlay p:not(.newsletter-eyebrow) {
  max-width: 365px;
  margin: 0;
  color: rgba(255, 250, 241, 0.88);
  font-size: 16px;
  line-height: 1.5;
}

.newsletter-hero__overlay .newsletter-eyebrow {
  color: #d7d6c5;
}

.newsletter-overlay-cta {
  display: inline-flex;
  min-height: 50px;
  width: fit-content;
  align-items: center;
  justify-content: center;
  padding: 15px 22px;
  border: 1px solid rgba(255, 255, 255, 0.58);
  background: #252a1b;
  box-shadow: 0 16px 34px rgba(0, 0, 0, 0.24);
  color: #ffffff;
  font-size: 12px;
  font-weight: 900;
  line-height: 1;
  text-decoration: none;
  text-transform: uppercase;
  transition:
    background 180ms ease,
    color 180ms ease,
    transform 180ms ease;
}

.newsletter-overlay-cta:hover,
.newsletter-overlay-cta:focus-visible {
  background: #fffaf1;
  color: #252a1b;
  transform: translateY(-2px);
}

.newsletter-proof-strip {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 1px;
  margin: 0;
  padding: 1px;
  background: #252a1b;
}

.newsletter-proof-strip div {
  display: grid;
  min-height: 102px;
  align-content: center;
  padding: 16px 12px;
  background: #fffaf1;
  text-align: center;
}

.newsletter-proof-strip dt {
  margin-bottom: 8px;
  color: #384432;
  font-size: 11px;
  font-weight: 900;
  letter-spacing: 0;
  line-height: 1.25;
  text-transform: uppercase;
}

.newsletter-proof-strip dd {
  margin: 0;
  color: #252a1b;
  font-family: Georgia, "Times New Roman", serif;
  font-size: 23px;
  line-height: 1;
}

.newsletter-story-panel {
  display: grid;
  gap: 14px;
  padding: 34px 34px 38px;
  background:
    linear-gradient(135deg, rgba(255, 250, 241, 0.94), rgba(238, 229, 211, 0.96)),
    #eee5d3;
  text-align: center;
}

.newsletter-story-panel span,
.newsletter-deck__lede span {
  color: #384432;
  font-size: 11px;
  font-weight: 900;
  letter-spacing: 0;
  line-height: 1.25;
  text-transform: uppercase;
}

.newsletter-story-panel h5 {
  max-width: 500px;
  margin: 0 auto;
  color: #252a1b;
  font-size: 34px;
}

.newsletter-story-panel p {
  max-width: 470px;
  margin: 0 auto;
  color: #263734;
  font-size: 15px;
  line-height: 1.55;
}

/* Lombard email preview mirrors the lombard.html v2 design language: paper and
   ivory surfaces, terracotta accent, Fraunces display, hero copy on the right. */
.newsletter-email--lombard {
  background: #f4eee4;
  color: #2a2521;
}

.newsletter-lux-hero {
  position: relative;
  display: grid;
  min-height: 520px;
  overflow: hidden;
  background: #221e1a;
  isolation: isolate;
}

.newsletter-lux-hero img {
  position: absolute;
  inset: 0;
  z-index: -2;
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center 38%;
}

.newsletter-lux-hero::after {
  position: absolute;
  inset: 0;
  z-index: -1;
  background:
    linear-gradient(270deg, rgba(34, 30, 26, 0.94) 0%, rgba(34, 30, 26, 0.62) 38%, rgba(34, 30, 26, 0.16) 76%, rgba(34, 30, 26, 0.05) 100%),
    linear-gradient(0deg, rgba(34, 30, 26, 0.9) 0%, rgba(34, 30, 26, 0.26) 52%, rgba(34, 30, 26, 0.12) 100%);
  content: "";
}

.newsletter-lux-hero__overlay {
  display: grid;
  align-content: end;
  gap: 16px;
  min-height: 520px;
  padding: 32px 26px;
  color: #fff8ec;
}

.newsletter-lux-hero__overlay .newsletter-eyebrow {
  width: fit-content;
  padding: 8px 12px;
  border-radius: 999px;
  background: #c9503c;
  color: #fff8ec;
}

.newsletter-lux-hero__overlay h4 {
  margin: 0;
  font-family: "Fraunces", Georgia, "Times New Roman", serif;
  font-optical-sizing: auto;
  font-variation-settings: "opsz" 144;
  font-size: 48px;
  font-weight: 590;
  letter-spacing: -0.01em;
  line-height: 0.98;
}

.newsletter-lux-hero__overlay p:not(.newsletter-eyebrow) {
  max-width: 330px;
  margin: 0;
  color: rgba(255, 248, 236, 0.85);
  font-size: 15px;
  line-height: 1.5;
}

/* Desktop: the copy hangs right over the darkened glass neighbour and the crop
   pans right so the Portland stone facade stays clear on the left, like the site hero. */
@media (min-width: 681px) {
  .newsletter-lux-hero img {
    object-position: 92% 38%;
  }

  .newsletter-lux-hero__overlay {
    justify-items: end;
    text-align: right;
  }
}

.newsletter-email--lombard .newsletter-overlay-cta {
  border-color: #c9503c;
  border-radius: 6px;
  background: #c9503c;
  color: #fff8ec;
}

.newsletter-email--lombard .newsletter-overlay-cta:hover,
.newsletter-email--lombard .newsletter-overlay-cta:focus-visible {
  border-color: #fff8ec;
  background: #fff8ec;
  color: #c9503c;
}

.newsletter-email--lombard .newsletter-contact-band {
  gap: 12px;
  padding: 22px;
  background: linear-gradient(160deg, #c9503c, #a63f2e);
}

.newsletter-email--lombard .newsletter-contact-band div {
  border: 1px solid rgba(255, 248, 236, 0.3);
  border-radius: 8px;
  background: rgba(255, 248, 236, 0.1);
}

.newsletter-email--lombard .newsletter-contact-band strong {
  color: #fff8ec;
  font-family: "Fraunces", Georgia, "Times New Roman", serif;
  font-optical-sizing: auto;
  font-variation-settings: "opsz" 144;
  font-weight: 560;
  text-transform: none;
}

.newsletter-email--lombard .newsletter-contact-band a {
  color: rgba(255, 248, 236, 0.9);
}

.newsletter-email--lombard .newsletter-disclaimer {
  background: #f4eee4;
  color: #655f56;
}

.newsletter-deck {
  display: grid;
  gap: 18px;
  padding: 34px 30px 38px;
  background: #fff8ec;
  color: #2a2521;
}

.newsletter-deck__lede {
  display: grid;
  gap: 10px;
}

.newsletter-deck__lede span {
  color: #c9503c;
}

.newsletter-deck h5 {
  max-width: 500px;
  color: #2a2521;
  font-family: "Fraunces", Georgia, "Times New Roman", serif;
  font-optical-sizing: auto;
  font-variation-settings: "opsz" 144;
  font-size: 34px;
  font-weight: 590;
  letter-spacing: -0.01em;
}

.newsletter-deck p {
  margin: 0;
  color: #655f56;
  font-size: 15px;
  line-height: 1.55;
}

.newsletter-facts {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 1px;
  margin: 8px 0 4px;
  padding: 1px;
  background: rgba(37, 42, 27, 0.2);
}

.newsletter-facts div {
  min-height: 86px;
  padding: 14px 10px;
  background: #fffaf1;
}

.newsletter-facts dt {
  margin-bottom: 8px;
  color: #384432;
}

.newsletter-facts dd {
  margin: 0;
  color: #252a1b;
  font-family: Georgia, "Times New Roman", serif;
  font-size: 22px;
  line-height: 1;
}

/* Lombard variant: ledger rows over the ivory deck panel (hairline top rules,
   no boxes) - same treatment as the site's station times. */
.newsletter-facts--dark {
  gap: 0 22px;
  padding: 0;
  background: transparent;
}

.newsletter-facts--dark div {
  min-height: 0;
  padding: 14px 0 2px;
  border-top: 1px solid rgba(42, 37, 33, 0.16);
  background: transparent;
}

.newsletter-facts--dark dt {
  color: #c9503c;
}

.newsletter-facts--dark dd {
  color: #2a2521;
  font-family: "Fraunces", Georgia, "Times New Roman", serif;
  font-optical-sizing: auto;
  font-variation-settings: "opsz" 144;
  font-weight: 590;
}

.newsletter-cta {
  display: inline-flex;
  min-height: 50px;
  align-items: center;
  justify-content: center;
  justify-self: center;
  margin-top: 4px;
  padding: 15px 22px;
  border: 1px solid #252a1b;
  background: #252a1b;
  color: #ffffff;
  font-size: 12px;
  font-weight: 900;
  line-height: 1;
  text-decoration: none;
  text-transform: uppercase;
  transition:
    background 180ms ease,
    color 180ms ease,
    transform 180ms ease;
}

.newsletter-cta:hover,
.newsletter-cta:focus-visible {
  background: #384432;
  border-color: #384432;
  color: #eee5d3;
  transform: translateY(-2px);
}

.newsletter-contact-band {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 1px;
  padding: 1px;
  background: rgba(238, 229, 211, 0.26);
}

.newsletter-contact-band div {
  display: grid;
  gap: 8px;
  min-height: 104px;
  align-content: center;
  padding: 18px;
  background: #252a1b;
  text-align: center;
}

.newsletter-contact-band strong {
  color: #eee5d3;
  font-family: Georgia, "Times New Roman", serif;
  font-size: 18px;
  font-weight: 400;
  line-height: 1.2;
  text-transform: uppercase;
}

.newsletter-contact-band a {
  color: #eee5d3;
  font-size: 13px;
  line-height: 1.35;
  overflow-wrap: anywhere;
  text-decoration: underline;
}

.newsletter-disclaimer {
  margin: 0;
  padding: 18px 22px 24px;
  background: #252a1b;
  color: rgba(238, 229, 211, 0.68);
  font-size: 10px;
  line-height: 1.45;
  text-align: center;
}

.lombard-page {
  --paper: #e9e1d5;
  --ink: #241b17;
  --muted: #6c6259;
  --line: rgba(36, 27, 23, 0.15);
  --white: #fff8ec;
  --accent: #8f493d;
  --gold: #ae8051;
  --champagne: #d2aa72;
  --ivory: #fbf2e2;
  --obsidian: #17110f;
  --surface: #f3eadc;
  --surface-strong: #fff8ec;
  --surface-muted: #ded3c5;
  --soft-line: rgba(251, 242, 226, 0.16);
  --soft-glow: 0 24px 70px rgba(23, 17, 15, 0.3);
  background:
    linear-gradient(180deg, var(--paper) 0%, var(--surface) 46%, var(--surface-strong) 100%);
  color: var(--ink);
}

.lombard-page main,
.lombard-page {
  overflow-x: clip;
}

body.lombard-page section[id],
body.lombard-page footer[id] {
  scroll-margin-top: 96px;
}

.lombard-page .site-top {
  border-bottom-color: var(--line);
  background: color-mix(in srgb, var(--paper) 91%, var(--surface-strong));
  color: var(--ink);
}

.lombard-page .wordmark span,
.lombard-page .site-map-pin,
.lombard-page .savoy-map-marker span {
  border-color: color-mix(in srgb, var(--ivory) 70%, transparent);
  background: var(--ink);
  color: var(--ivory);
  font-size: 16px;
}

.lombard-page .top-cta {
  border-color: var(--accent);
  background: var(--accent);
  color: var(--white);
}

.lombard-page .top-cta:hover,
.lombard-page .top-cta:focus-visible {
  background: var(--ink);
  color: var(--white);
}

.lombard-page .global-email-cta {
  border-color: rgba(251, 242, 226, 0.48);
  background: var(--ink);
  color: var(--ivory);
}

.lombard-page .global-email-cta:hover,
.lombard-page .global-email-cta:focus-visible {
  background: var(--accent);
  color: var(--white);
}

.lombard-page .heritage-hero::before {
  background:
    linear-gradient(
      90deg,
      rgba(23, 17, 15, 0.94) 0%,
      rgba(47, 34, 29, 0.76) 36%,
      rgba(76, 45, 39, 0.38) 58%,
      rgba(76, 45, 39, 0) 78%
    );
}

.lombard-page .heritage-title .kicker {
  color: var(--champagne);
}

.lombard-page .heritage-ledger {
  background: rgba(251, 242, 226, 0.22);
}

.lombard-page .heritage-ledger div {
  background: rgba(36, 27, 23, 0.56);
}

.lombard-page .heritage-ledger dt {
  color: rgba(251, 242, 226, 0.68);
}

.lombard-page .heritage-ledger dd {
  color: var(--ivory);
}

.lombard-page .heritage-hero img {
  object-position: center;
}

.lombard-page .heritage-editorial-statement img,
.lombard-page .savoy-carousel__track img {
  object-position: center;
}

.lombard-page .heritage-editorial-statement,
.lombard-page .floor-editorial {
  background:
    linear-gradient(90deg, rgba(143, 73, 61, 0.09), transparent 46%),
    var(--surface);
  color: var(--ink);
}

.lombard-page .heritage-editorial-copy h2 {
  color: var(--ink);
}

.lombard-page .heritage-editorial-copy p {
  color: var(--muted);
}

.lombard-page .heritage-editorial-copy span {
  background: var(--accent);
}

.lombard-page .image-timeline,
.lombard-page .full-image-gallery {
  background:
    linear-gradient(90deg, rgba(143, 73, 61, 0.16), transparent 46%),
    var(--obsidian);
}

.lombard-page .location-roll {
  background: var(--surface);
}

.lombard-page .roll-grid article {
  background: var(--surface-strong);
}

.lombard-page .stacked-media figure,
.lombard-page .image-timeline figure,
.lombard-page .workspace-media-wall figure {
  background: var(--obsidian);
}

.lombard-page .stacked-media figcaption,
.lombard-page .image-timeline figcaption,
.lombard-page .workspace-media-wall figcaption,
.lombard-page .savoy-carousel__track figcaption {
  background: rgba(23, 17, 15, 0.86);
  color: var(--ivory);
}

.lombard-page .image-timeline figure::before {
  background: var(--accent);
  box-shadow: 13px 0 0 var(--gold);
}

.lombard-cta-row {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
  align-items: center;
  margin-top: 30px;
}

.lombard-cta {
  display: inline-flex;
  min-height: 46px;
  align-items: center;
  justify-content: center;
  padding: 12px 18px;
  border: 1px solid color-mix(in srgb, var(--accent) 78%, var(--ink));
  border-radius: 999px;
  background: var(--accent);
  color: var(--white);
  font-size: 0.74rem;
  font-weight: 900;
  letter-spacing: 0;
  line-height: 1;
  text-decoration: none;
  text-transform: uppercase;
  transition: background 220ms ease, border-color 220ms ease, color 220ms ease, transform 220ms ease;
}

.lombard-cta:hover,
.lombard-cta:focus-visible {
  border-color: var(--ink);
  background: var(--ink);
  color: var(--white);
  transform: translateY(-2px);
}

.lombard-cta--ghost {
  border-color: currentColor;
  background: transparent;
  color: inherit;
}

.lombard-cta--ghost:hover,
.lombard-cta--ghost:focus-visible {
  border-color: var(--accent);
  background: var(--accent);
  color: var(--white);
}

.lombard-cta-row--paper .lombard-cta--ghost {
  color: var(--ink);
}

.lombard-floors {
  padding: clamp(64px, 9vw, 132px) clamp(18px, 6vw, 88px);
  background: var(--surface);
  color: var(--ink);
}

.lombard-floors__intro {
  display: grid;
  gap: clamp(14px, 2vw, 22px);
  justify-items: center;
  max-width: 860px;
  margin: 0 auto clamp(48px, 7vw, 92px);
  text-align: center;
}

.lombard-floors__intro .kicker {
  margin-bottom: 0;
}

.lombard-floors__intro h2 {
  max-width: 780px;
  margin: 0;
  color: var(--ink);
  font-size: clamp(3rem, 5.7vw, 5.9rem);
  line-height: 0.94;
}

.lombard-floors__intro p:not(.kicker) {
  max-width: 560px;
  margin: 0;
  color: var(--muted);
  font-size: clamp(1rem, 1.35vw, 1.18rem);
  line-height: 1.55;
}

.lombard-floors__intro-cta {
  margin-top: clamp(6px, 1.2vw, 16px);
}

.lombard-floor {
  display: grid;
  grid-template-columns: minmax(280px, 0.44fr) minmax(0, 0.86fr);
  gap: clamp(30px, 5.5vw, 86px);
  align-items: center;
  max-width: 1480px;
  margin: 0 auto;
  padding: clamp(42px, 6vw, 78px) 0;
  border-top: 1px solid var(--line);
}

.lombard-floor + .lombard-floor {
  margin-top: clamp(18px, 4vw, 42px);
}

.lombard-floor--sixth {
  grid-template-columns: minmax(0, 0.86fr) minmax(280px, 0.44fr);
}

.lombard-floor--sixth .lombard-floor__copy {
  order: 2;
}

.lombard-floor--sixth .lombard-floor__media {
  order: 1;
}

.lombard-floor__copy {
  min-width: 0;
}

.lombard-floor__eyebrow {
  margin: 0 0 18px;
  color: var(--accent);
  font-size: 0.78rem;
  font-weight: 900;
  letter-spacing: 0.04em;
  line-height: 1.3;
  text-transform: uppercase;
}

.lombard-floor__copy h3 {
  max-width: 560px;
  margin: 0 0 22px;
  color: var(--ink);
  font-family: Georgia, "Times New Roman", serif;
  font-size: clamp(2.15rem, 3.7vw, 4rem);
  font-weight: 400;
  letter-spacing: 0;
  line-height: 0.98;
}

.lombard-floor__copy p:not(.lombard-floor__eyebrow) {
  max-width: 560px;
  margin: 0 0 28px;
  color: var(--muted);
  font-size: clamp(1rem, 1.25vw, 1.12rem);
  line-height: 1.55;
}

.lombard-floor__spec {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 1px;
  margin: 0 0 24px;
  padding: 1px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--line);
  list-style: none;
  overflow: hidden;
}

.lombard-floor__spec li {
  min-height: 54px;
  padding: 16px 18px;
  background: color-mix(in srgb, var(--surface-strong) 72%, var(--surface));
  color: var(--ink);
  font-size: 0.76rem;
  font-weight: 900;
  line-height: 1.25;
  text-transform: uppercase;
}

.lombard-floor__tags {
  display: flex;
  flex-wrap: wrap;
  gap: 9px;
}

.lombard-floor__tags span {
  display: inline-flex;
  min-height: 34px;
  align-items: center;
  padding: 8px 11px;
  border: 1px solid rgba(101, 116, 95, 0.28);
  border-radius: 999px;
  background: rgba(101, 116, 95, 0.1);
  color: color-mix(in srgb, var(--ink) 88%, #65745f);
  font-size: 0.72rem;
  font-weight: 900;
  line-height: 1.15;
  text-transform: uppercase;
}

.lombard-floor__media {
  display: grid;
  grid-template-columns: minmax(0, 0.92fr) minmax(220px, 0.7fr);
  gap: clamp(14px, 2vw, 24px);
  align-items: stretch;
  min-width: 0;
}

.lombard-floor__media--stack {
  grid-template-columns: minmax(0, 1fr);
}

.lombard-floor-plan,
.lombard-floor-photo {
  position: relative;
  min-width: 0;
  margin: 0;
  overflow: hidden;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--surface-strong);
  box-shadow: 0 24px 70px rgba(36, 27, 23, 0.14);
}

.lombard-floor-plan {
  align-self: center;
  padding: clamp(14px, 2vw, 26px);
}

.lombard-floor-plan img,
.lombard-floor-photo img {
  display: block;
  width: 100%;
  height: 100%;
}

.lombard-floor-plan img {
  object-fit: contain;
}

.lombard-floor-photo img {
  object-fit: cover;
}

.lombard-page .image-timeline img[src*="Terrace"],
.lombard-page .full-image-gallery img[src*="Terrace"],
.lombard-page .savoy-carousel__track img[src*="Terrace"] {
  object-position: center 58%;
}

.lombard-floor-photo {
  aspect-ratio: 4 / 3;
}

.lombard-floor-plan figcaption,
.lombard-floor-photo figcaption {
  position: absolute;
  left: 14px;
  bottom: 14px;
  max-width: calc(100% - 28px);
  padding: 9px 12px;
  border: 1px solid rgba(251, 242, 226, 0.18);
  border-radius: 999px;
  background: rgba(23, 17, 15, 0.76);
  color: var(--ivory);
  font-size: 0.66rem;
  font-weight: 900;
  letter-spacing: 0;
  line-height: 1;
  text-transform: uppercase;
  backdrop-filter: blur(12px);
}

/* Before/after compare: 6th floor as offered vs the fitted concept.
   The invisible full-bleed range input drives --compare-pos (set in script.js);
   the "after" layer is clipped to the right of the divider. */
.lombard-compare-card {
  min-width: 0;
  margin: 0;
}

.lombard-compare {
  --compare-pos: 50%;
  position: relative;
  overflow: hidden;
  aspect-ratio: 4 / 3;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--surface-strong);
  box-shadow: 0 24px 70px rgba(36, 27, 23, 0.14);
  isolation: isolate;
}

/* Inside the 6th-floor media stack the two cards sit above each other, so a
   wider crop keeps the column from towering over the copy. Mobile keeps 4/3. */
@media (min-width: 721px) {
  .lombard-floor__media .lombard-compare {
    aspect-ratio: 16 / 9;
  }
}

.lombard-compare img {
  position: absolute;
  inset: 0;
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.lombard-compare__after {
  position: absolute;
  inset: 0;
  clip-path: inset(0 0 0 var(--compare-pos));
}

.lombard-compare__divider {
  position: absolute;
  top: 0;
  bottom: 0;
  left: var(--compare-pos);
  z-index: 2;
  width: 2px;
  transform: translateX(-1px);
  background: rgba(255, 248, 236, 0.92);
  box-shadow: 0 0 14px rgba(23, 17, 15, 0.4);
  pointer-events: none;
}

.lombard-compare__handle {
  position: absolute;
  top: 50%;
  left: var(--compare-pos);
  z-index: 3;
  display: grid;
  place-items: center;
  width: 44px;
  height: 44px;
  border: 1px solid rgba(251, 242, 226, 0.4);
  border-radius: 999px;
  background: rgba(23, 17, 15, 0.74);
  color: var(--ivory);
  transform: translate(-50%, -50%);
  pointer-events: none;
  backdrop-filter: blur(12px);
}

.lombard-compare__tag {
  position: absolute;
  top: 12px;
  z-index: 2;
  padding: 8px 11px;
  border: 1px solid rgba(251, 242, 226, 0.18);
  border-radius: 999px;
  background: rgba(23, 17, 15, 0.76);
  color: var(--ivory);
  font-size: 0.62rem;
  font-weight: 900;
  letter-spacing: 0.08em;
  line-height: 1;
  text-transform: uppercase;
  pointer-events: none;
}

.lombard-compare__tag--before {
  left: 12px;
}

.lombard-compare__tag--after {
  right: 12px;
}

.lombard-compare input[type="range"] {
  position: absolute;
  inset: 0;
  z-index: 4;
  width: 100%;
  height: 100%;
  margin: 0;
  padding: 0;
  appearance: none;
  -webkit-appearance: none;
  background: transparent;
  opacity: 0;
  cursor: ew-resize;
}

.lombard-compare input[type="range"]::-webkit-slider-thumb {
  -webkit-appearance: none;
  width: 44px;
  height: 44px;
}

.lombard-compare input[type="range"]::-moz-range-thumb {
  width: 44px;
  height: 44px;
  border: 0;
}

.lombard-compare:has(input[type="range"]:focus-visible) .lombard-compare__handle {
  outline: 2px solid var(--accent);
  outline-offset: 3px;
}

.lombard-compare-card figcaption {
  margin-top: 12px;
  color: var(--muted);
  font-size: 0.68rem;
  font-weight: 900;
  letter-spacing: 0.08em;
  line-height: 1.2;
  text-align: center;
  text-transform: uppercase;
}

.lombard-page .lombard-fitout-figure {
  aspect-ratio: 4 / 3;
}

.lombard-page .floor-plan-figure {
  border-color: var(--line);
  background:
    radial-gradient(circle at 24% 18%, rgba(143, 73, 61, 0.1), transparent 32%),
    var(--surface-strong);
  box-shadow: 0 24px 70px rgba(36, 27, 23, 0.14);
}

.lombard-page .lombard-fitout-figure img {
  padding: 0;
  object-fit: cover;
}

.lombard-page .full-image-gallery img:nth-child(1) {
  object-position: center 42%;
}

.lombard-page .lombard-intel {
  overflow: hidden;
  padding: clamp(54px, 7vw, 96px) clamp(16px, 6vw, 88px);
  background:
    radial-gradient(circle at 18% 10%, rgba(210, 170, 114, 0.12), transparent 30%),
    linear-gradient(180deg, #261a16 0%, var(--obsidian) 100%);
  color: var(--ivory);
}

.lombard-intel__intro {
  display: grid;
  grid-template-columns: minmax(320px, 0.92fr) minmax(280px, 0.58fr);
  gap: clamp(22px, 5vw, 76px);
  align-items: end;
  max-width: 1480px;
  margin: 0 auto clamp(24px, 4vw, 42px);
}

.lombard-intel__intro h2 {
  max-width: 780px;
  margin: 0;
  color: var(--ivory);
  font-size: clamp(42px, 5vw, 76px);
  line-height: 0.98;
}

.lombard-intel__intro p:not(.kicker) {
  max-width: 570px;
  margin: 0;
  color: rgba(251, 242, 226, 0.7);
  font-size: clamp(16px, 1.4vw, 19px);
  line-height: 1.55;
}

.lombard-arrival-panel {
  display: grid;
  grid-template-columns: minmax(0, 1.05fr) minmax(340px, 0.95fr);
  gap: 1px;
  max-width: 1480px;
  margin-inline: auto;
  padding: 1px;
  border: 1px solid rgba(251, 242, 226, 0.12);
  border-radius: 8px;
  background: rgba(251, 242, 226, 0.12);
  overflow: hidden;
}

.lombard-arrival-panel .arrival-map {
  min-height: clamp(330px, 28vw, 430px);
  border: 0;
  border-radius: 0;
}

.lombard-page .lombard-arrival-map .arrival-pin {
  max-width: none;
  padding: 7px 10px;
  font-size: 10px;
  white-space: nowrap;
}

.lombard-page .lombard-arrival-map .arrival-pin--building {
  min-width: 42px;
  justify-content: center;
}

.lombard-station-strip {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 1px;
  min-width: 0;
}

.lombard-station-strip div {
  display: grid;
  gap: 10px;
  min-height: 174px;
  align-content: center;
  padding: clamp(20px, 3vw, 34px);
  background:
    linear-gradient(180deg, rgba(251, 242, 226, 0.075), rgba(251, 242, 226, 0.035)),
    rgba(23, 17, 15, 0.66);
}

.lombard-station-strip strong {
  color: var(--champagne);
  font-family: Georgia, "Times New Roman", serif;
  font-size: clamp(34px, 4.5vw, 62px);
  font-weight: 400;
  line-height: 0.95;
}

.lombard-station-strip span {
  color: rgba(251, 242, 226, 0.76);
  font-size: 0.78rem;
  font-weight: 900;
  line-height: 1.3;
  text-transform: uppercase;
}

.lombard-page .lombard-intel .intel-grid {
  grid-template-columns: minmax(0, 1.06fr) minmax(0, 0.86fr) minmax(0, 1.08fr);
  align-items: stretch;
  max-width: 1480px;
  margin-inline: auto;
}

.lombard-page .lombard-intel .location-kicker,
.lombard-page .lombard-intel .kicker,
.lombard-page .lombard-intel .micro-head span,
.lombard-page .lombard-intel .amenity-notes strong {
  color: var(--champagne);
}

.lombard-page .lombard-intel .micro-card {
  display: grid;
  grid-template-rows: auto minmax(250px, 1fr) auto;
  gap: clamp(16px, 2vw, 22px);
  min-width: 0;
  min-height: 430px;
  padding: clamp(22px, 2.6vw, 34px);
  border-color: rgba(251, 242, 226, 0.15);
  background:
    linear-gradient(180deg, rgba(251, 242, 226, 0.08), rgba(251, 242, 226, 0.045)),
    rgba(251, 242, 226, 0.05);
}

.lombard-page .lombard-intel .micro-head {
  margin-bottom: 0;
  padding-bottom: 16px;
  border-bottom: 1px solid rgba(251, 242, 226, 0.12);
}

.lombard-page .lombard-intel .micro-card p {
  max-width: 34ch;
  margin: 0;
  color: rgba(251, 242, 226, 0.62);
  font-size: 14px;
  line-height: 1.5;
}

.lombard-page .lombard-intel .arrival-map,
.lombard-page .lombard-intel .telemetry,
.lombard-page .lombard-intel .week-grid,
.lombard-page .lombard-intel .commute-diagram {
  height: auto;
  min-height: clamp(228px, 22vw, 282px);
  margin-bottom: 0;
  border-color: rgba(251, 242, 226, 0.14);
  background: #1e1714;
}

.lombard-page .lombard-intel .arrival-map {
  background:
    radial-gradient(circle at 18% 68%, rgba(210, 170, 114, 0.2), transparent 17%),
    linear-gradient(120deg, rgba(63, 38, 31, 0.72), rgba(23, 17, 15, 0.88)),
    #1e1714;
}

.lombard-page .lombard-intel .arrival-map::before {
  position: absolute;
  inset: -28px;
  z-index: 0;
  content: "";
  background:
    linear-gradient(32deg, transparent 47%, rgba(251, 242, 226, 0.12) 48% 51%, transparent 52%) 0 0 / 78px 78px,
    linear-gradient(116deg, transparent 46%, rgba(251, 242, 226, 0.1) 47% 51%, transparent 52%) 0 0 / 86px 86px,
    radial-gradient(circle, rgba(251, 242, 226, 0.16) 1px, transparent 2px) 0 0 / 28px 28px;
  opacity: 0.74;
  transform: rotate(-6deg) scale(1.08);
}

.lombard-page .lombard-intel .arrival-map::after {
  background:
    radial-gradient(circle at 47% 48%, rgba(210, 170, 114, 0.14), transparent 28%),
    radial-gradient(circle at 86% 20%, rgba(143, 73, 61, 0.22), transparent 27%),
    linear-gradient(120deg, rgba(23, 17, 15, 0.4), rgba(23, 17, 15, 0.06) 52%, rgba(23, 17, 15, 0.46));
}

.lombard-page .lombard-intel .arrival-route {
  stroke-width: 4.4;
}

.lombard-page .lombard-intel .arrival-route--branch {
  opacity: 0.68;
  stroke-dasharray: 4 12;
  stroke-width: 3;
}

.lombard-page .lombard-intel .arrival-pin {
  border-color: rgba(251, 242, 226, 0.24);
  background: rgba(23, 17, 15, 0.84);
}

.lombard-page .arrival-pin--bank {
  left: 47%;
  top: 42%;
}

.lombard-page .arrival-pin--monument {
  right: 9%;
  top: 18%;
}

.lombard-page .arrival-pin--cannon {
  right: 10%;
  bottom: 15%;
}

.lombard-page .arrival-pin--liverpool {
  left: 35%;
  top: 12%;
}

.lombard-page .lombard-intel .arrival-pin.is-active,
.lombard-page .lombard-intel .arrival-pin--building,
.lombard-page .lombard-intel .week-grid button.is-active {
  background: var(--champagne);
  color: var(--obsidian);
}

.lombard-page .lombard-intel .week-grid button.is-active {
  border-color: rgba(210, 170, 114, 0.72);
}

.lombard-page .lombard-intel .telemetry {
  gap: 0;
  align-content: stretch;
  min-height: clamp(228px, 22vw, 282px);
  padding: 0;
}

.lombard-page .lombard-intel .amenity-notes span {
  min-height: 0;
  gap: 7px;
  align-content: center;
  padding: 18px 22px;
  border-bottom-color: rgba(251, 242, 226, 0.1);
}

.lombard-page .lombard-intel .amenity-notes strong {
  font-size: clamp(28px, 3vw, 40px);
}

.lombard-page .lombard-intel .commute-diagram {
  position: relative;
  overflow: hidden;
  border: 1px solid rgba(251, 242, 226, 0.14);
  border-radius: 8px;
  background:
    radial-gradient(circle at 50% 48%, rgba(210, 170, 114, 0.22), transparent 26%),
    radial-gradient(circle at 78% 20%, rgba(143, 73, 61, 0.18), transparent 28%),
    linear-gradient(135deg, rgba(46, 29, 24, 0.88), rgba(23, 17, 15, 0.96));
}

.lombard-page .lombard-intel .commute-diagram::before {
  position: absolute;
  inset: -18px;
  content: "";
  background:
    linear-gradient(90deg, transparent 48%, rgba(251, 242, 226, 0.08) 49% 51%, transparent 52%) 0 0 / 44px 44px,
    linear-gradient(0deg, transparent 48%, rgba(251, 242, 226, 0.07) 49% 51%, transparent 52%) 0 0 / 44px 44px;
  opacity: 0.55;
  transform: rotate(-4deg);
}

.lombard-page .lombard-intel .commute-diagram svg {
  position: absolute;
  inset: 12px;
  z-index: 1;
  width: calc(100% - 24px);
  height: calc(100% - 24px);
  overflow: visible;
}

.lombard-page .lombard-intel .commute-line {
  fill: none;
  stroke-linecap: round;
  stroke-width: 5;
  opacity: 0.9;
  filter: drop-shadow(0 12px 16px rgba(0, 0, 0, 0.22));
}

.lombard-page .lombard-intel .commute-line--central {
  stroke: var(--accent);
}

.lombard-page .lombard-intel .commute-line--district {
  stroke: var(--champagne);
}

.lombard-page .lombard-intel .commute-line--rail {
  stroke: rgba(251, 242, 226, 0.6);
  stroke-width: 3.4;
}

.lombard-page .lombard-intel .commute-line--dlr {
  stroke: rgba(251, 242, 226, 0.38);
  stroke-dasharray: 7 10;
  stroke-width: 3.2;
}

.lombard-page .lombard-intel .commute-node {
  position: absolute;
  z-index: 2;
  display: grid;
  max-width: min(176px, 42%);
  min-width: 0;
  gap: 3px;
  padding: 9px 10px;
  border: 1px solid rgba(251, 242, 226, 0.22);
  border-radius: 8px;
  background: rgba(23, 17, 15, 0.84);
  color: var(--ivory);
  box-shadow: 0 18px 32px rgba(0, 0, 0, 0.28);
  backdrop-filter: blur(12px);
}

.lombard-page .lombard-intel .commute-node strong,
.lombard-page .lombard-intel .commute-node small {
  display: block;
  min-width: 0;
  overflow-wrap: anywhere;
}

.lombard-page .lombard-intel .commute-node strong {
  color: currentColor;
  font-size: 12px;
  font-weight: 900;
  line-height: 1;
  text-transform: uppercase;
}

.lombard-page .lombard-intel .commute-node small {
  color: rgba(251, 242, 226, 0.68);
  font-size: 9.5px;
  font-weight: 800;
  line-height: 1.2;
}

.lombard-page .lombard-intel .commute-node--hub {
  left: 41%;
  top: 42%;
  max-width: 110px;
  border-color: rgba(210, 170, 114, 0.72);
  background: var(--champagne);
  color: var(--obsidian);
  transform: translate(-50%, -50%);
}

.lombard-page .lombard-intel .commute-node--hub small {
  color: rgba(23, 17, 15, 0.72);
}

.lombard-page .lombard-intel .commute-node--bank {
  left: 56%;
  top: 43%;
}

.lombard-page .lombard-intel .commute-node--monument {
  right: 7%;
  top: 12%;
}

.lombard-page .lombard-intel .commute-node--cannon {
  left: 7%;
  bottom: 12%;
}

.lombard-page .lombard-intel .commute-node--liverpool {
  right: 8%;
  bottom: 14%;
}

.lombard-page .site-map-section {
  --map-ink: var(--obsidian);
  --map-paper: var(--surface);
  --map-ivory: var(--ivory);
  --map-muted: rgba(251, 242, 226, 0.7);
  --map-gold: var(--champagne);
  --map-oxide: var(--accent);
  border-color: rgba(251, 242, 226, 0.14);
  background:
    linear-gradient(90deg, rgba(143, 73, 61, 0.24), transparent 48%),
    var(--obsidian);
  color: var(--ivory);
}

.lombard-page .site-map-section h2 {
  color: var(--ivory);
}

.lombard-page .site-map-copy p:not(.site-map-kicker) {
  color: rgba(251, 242, 226, 0.72);
}

.lombard-page .site-map-points span {
  border-color: rgba(251, 242, 226, 0.22);
  background: rgba(251, 242, 226, 0.08);
  color: var(--ivory);
}

.lombard-page .site-map-wrap {
  border-color: rgba(251, 242, 226, 0.18);
  background: var(--surface-muted);
  box-shadow: var(--soft-glow);
}

.lombard-page .site-map-section .site-map-pin {
  border-color: var(--ivory);
  background: var(--accent);
  color: var(--ivory);
}

.lombard-page .savoy-carousel {
  background:
    linear-gradient(90deg, rgba(143, 73, 61, 0.08), transparent 48%),
    var(--surface);
  color: var(--ink);
}

.lombard-page .savoy-carousel__copy p:not(.kicker) {
  color: var(--muted);
}

.lombard-page .savoy-carousel__cta {
  background: var(--accent);
  color: var(--white);
}

.lombard-page .savoy-carousel__track {
  border-color: var(--line);
  background: var(--surface-strong);
  box-shadow: 0 22px 60px rgba(36, 27, 23, 0.14);
}

.lombard-page .savoy-carousel__control,
.lombard-page .savoy-carousel__dots button {
  border-color: var(--line);
  background: rgba(255, 248, 236, 0.9);
  color: var(--ink);
}

.lombard-page .contact-footer {
  background:
    linear-gradient(90deg, rgba(143, 73, 61, 0.26), transparent 48%),
    var(--ink);
}

.lombard-page .contact-footer .kicker {
  color: var(--champagne);
}

.lombard-page .contact-footer h2,
.lombard-page .contact-footer a {
  color: var(--ivory);
}

.lombard-page .contact-footer p:not(.kicker),
.lombard-page .contact-footer a small,
.lombard-page .contact-footer .brochure-disclaimer {
  color: rgba(251, 242, 226, 0.66);
}

.lombard-page .contact-footer address {
  border-top-color: rgba(251, 242, 226, 0.2);
}

.lombard-page .contact-footer a {
  border-bottom-color: rgba(251, 242, 226, 0.16);
}

.lombard-contact-popup {
  position: fixed;
  right: clamp(14px, 2vw, 28px);
  bottom: clamp(74px, 7vw, 98px);
  z-index: 90;
  width: min(390px, calc(100% - 28px));
  padding: 24px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: color-mix(in srgb, var(--surface-strong) 97%, white);
  color: var(--ink);
  box-shadow: 0 28px 90px rgba(23, 17, 15, 0.3);
  opacity: 0;
  pointer-events: none;
  transform: translateY(18px);
  transition: opacity 220ms ease, transform 220ms ease;
}

.lombard-contact-popup.is-visible {
  opacity: 1;
  pointer-events: auto;
  transform: translateY(0);
}

.lombard-contact-popup__close {
  position: absolute;
  top: 12px;
  right: 12px;
  min-height: 30px;
  padding: 6px 9px;
  border: 1px solid var(--line);
  border-radius: 999px;
  background: transparent;
  color: var(--muted);
  font-size: 0.62rem;
  font-weight: 900;
  letter-spacing: 0;
  text-transform: uppercase;
}

.lombard-contact-popup h2 {
  max-width: 290px;
  margin-bottom: 12px;
  padding-right: 44px;
  font-size: clamp(2rem, 5vw, 3rem);
}

.lombard-contact-popup p:not(.kicker) {
  margin-bottom: 18px;
  color: var(--muted);
}

.lombard-contact-popup__actions {
  display: grid;
  gap: 8px;
}

.lombard-contact-popup__actions a {
  display: flex;
  min-height: 42px;
  align-items: center;
  justify-content: center;
  padding: 10px 14px;
  border: 1px solid var(--line);
  border-radius: 999px;
  color: var(--ink);
  font-size: 0.72rem;
  font-weight: 900;
  text-decoration: none;
  text-transform: uppercase;
}

.lombard-contact-popup__actions a:first-child {
  background: var(--accent);
  color: var(--white);
}

@media (max-width: 1080px) {
  .lombard-floors__intro,
  .lombard-floor,
  .lombard-floor--sixth {
    grid-template-columns: 1fr;
    max-width: 760px;
  }

  .lombard-floors__intro .kicker {
    margin-bottom: 0;
  }

  .lombard-floors__intro p:not(.kicker),
  .lombard-floor__copy h3,
  .lombard-floor__copy p:not(.lombard-floor__eyebrow) {
    max-width: 660px;
  }

  .lombard-floor--sixth .lombard-floor__copy,
  .lombard-floor--sixth .lombard-floor__media {
    order: initial;
  }

  .lombard-intel__intro {
    grid-template-columns: 1fr;
    max-width: 760px;
  }

  .lombard-intel__intro p:not(.kicker) {
    max-width: 660px;
  }

  .lombard-page .lombard-intel .intel-grid {
    grid-template-columns: 1fr;
    max-width: 760px;
  }

  .lombard-arrival-panel {
    grid-template-columns: 1fr;
    max-width: 760px;
  }

  .lombard-station-strip {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .lombard-page .lombard-intel .micro-card {
    min-height: auto;
    grid-template-rows: auto auto auto;
  }

  .lombard-page .lombard-intel .arrival-map,
  .lombard-page .lombard-intel .telemetry,
  .lombard-page .lombard-intel .week-grid,
  .lombard-page .lombard-intel .commute-diagram {
    min-height: 250px;
  }
}

@media (max-width: 860px) {
  .lombard-spec-section .chapter-copy {
    position: static;
  }
}

@media (max-width: 620px) {
  .lombard-page .site-top {
    position: sticky;
    top: 0;
    z-index: 80;
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 8px 10px;
    padding: 10px 12px;
    border-bottom: 1px solid rgba(36, 27, 23, 0.12);
    backdrop-filter: blur(14px);
  }

  body.lombard-page section[id],
  body.lombard-page footer[id] {
    scroll-margin-top: 132px;
  }

  .lombard-page .wordmark {
    min-width: 0;
    min-height: 44px;
  }

  .lombard-page .wordmark span {
    width: 34px;
    height: 34px;
    font-size: 14px;
  }

  .lombard-page .wordmark strong {
    overflow: hidden;
    font-size: 13px;
    text-overflow: ellipsis;
    white-space: nowrap;
  }

  .lombard-page .site-top nav {
    display: grid;
    grid-column: 1 / -1;
    grid-template-columns: repeat(5, minmax(0, 1fr));
    gap: 4px;
    width: 100%;
    padding: 0;
    overflow-x: clip;
  }

  .lombard-page .site-top nav a {
    justify-content: center;
    min-width: 0;
    min-height: 44px;
    padding: 10px 8px;
    font-size: 0.72rem;
    line-height: 1.1;
    text-align: center;
    white-space: nowrap;
  }

  .lombard-page .top-cta {
    width: auto;
    min-height: 44px;
    padding: 10px 12px;
    font-size: 0.72rem;
    line-height: 1.1;
  }

  .lombard-page .heritage-hero {
    display: grid;
    min-height: 0;
    background: var(--obsidian);
  }

  .lombard-page .heritage-hero::before {
    background:
      linear-gradient(180deg, rgba(23, 17, 15, 0.12) 0%, rgba(23, 17, 15, 0.62) 100%);
  }

  .lombard-page .heritage-hero img {
    height: clamp(220px, 58vw, 330px);
    min-height: 0;
    opacity: 0.78;
    object-position: center 34%;
  }

  .lombard-page .heritage-title {
    position: relative;
    left: auto;
    right: auto;
    bottom: auto;
    padding: 20px 14px 22px;
    text-shadow: none;
  }

  .lombard-page .heritage-title .kicker {
    margin-bottom: 9px;
    font-size: 10px;
  }

  .lombard-page .heritage-title h1 {
    max-width: 11ch;
    margin-bottom: 12px;
    font-size: clamp(40px, 12vw, 50px);
    line-height: 0.93;
  }

  .lombard-page .heritage-title p:not(.kicker) {
    max-width: 34ch;
    margin-bottom: 0;
    font-size: 15px;
    line-height: 1.42;
  }

  .lombard-page .heritage-ledger {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 1px;
    margin-top: 16px;
    padding: 1px;
  }

  .lombard-page .heritage-ledger div {
    min-width: 0;
    padding: 10px 8px;
  }

  .lombard-page .heritage-ledger dt {
    margin-bottom: 6px;
    font-size: 8.5px;
    line-height: 1;
  }

  .lombard-page .heritage-ledger dd {
    font-size: clamp(15px, 4.6vw, 18px);
    line-height: 1.05;
    overflow-wrap: anywhere;
  }

  .lombard-page .heritage-title .lombard-cta-row {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 8px;
    margin-top: 16px;
  }

  .lombard-page .heritage-title .lombard-cta {
    width: 100%;
    min-height: 38px;
    padding: 9px 8px;
    font-size: 10px;
  }

  .lombard-page .chapter,
  .lombard-page .details-chapter,
  .lombard-page .location-roll,
  .lombard-page .site-map-section,
  .lombard-page .savoy-carousel,
  .lombard-page .contact-footer {
    padding-right: 14px;
    padding-left: 14px;
  }

  .lombard-page .heritage-arrival,
  .lombard-page .lombard-spec-section {
    padding-top: 38px;
    padding-bottom: 42px;
  }

  .lombard-page .chapter-copy .kicker,
  .lombard-page .lombard-floors__intro .kicker {
    margin-bottom: 8px;
    font-size: 10px;
  }

  .lombard-page .chapter-copy h2 {
    margin-bottom: 12px;
    font-size: clamp(32px, 10vw, 42px);
    line-height: 0.98;
  }

  .lombard-page .chapter-copy p:not(.kicker) {
    max-width: 36ch;
    font-size: 15px;
    line-height: 1.42;
  }

  .lombard-spec-section .chapter-copy {
    margin-bottom: 18px;
  }

  .lombard-floors {
    padding: 42px 14px 54px;
  }

  .lombard-floors__intro {
    gap: 14px;
    margin-bottom: 22px;
  }

  .lombard-floors__intro h2 {
    font-size: clamp(34px, 12vw, 48px);
  }

  .lombard-floor {
    gap: 22px;
    padding: 34px 0;
  }

  .lombard-floor__copy h3 {
    font-size: clamp(31px, 10vw, 42px);
  }

  .lombard-floor__spec,
  .lombard-floor__media {
    grid-template-columns: 1fr;
  }

  .lombard-floor__spec li {
    min-height: 0;
    padding: 14px 15px;
  }

  .lombard-floor-plan {
    padding: 10px;
  }

  .lombard-floor-photo {
    aspect-ratio: 4 / 3;
  }

  .lombard-floor-plan figcaption,
  .lombard-floor-photo figcaption {
    left: 10px;
    bottom: 10px;
    max-width: calc(100% - 20px);
    font-size: 0.6rem;
  }

  .lombard-spec-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 8px;
  }

  .lombard-spec-grid li {
    grid-template-columns: 34px minmax(0, 1fr);
    gap: 4px 9px;
    min-height: 96px;
    padding: 10px;
  }

  .lombard-spec-grid .spec-icon {
    width: 34px;
    height: 34px;
    border-radius: 6px;
  }

  .lombard-spec-grid svg {
    width: 20px;
    height: 20px;
  }

  .lombard-spec-grid li > span:not(.spec-icon) {
    font-size: 8.5px;
  }

  .lombard-spec-grid strong {
    font-size: 13px;
    line-height: 1.08;
  }

  .lombard-spec-grid small {
    max-width: none;
    font-size: 11px;
    line-height: 1.22;
  }

  .lombard-page .lombard-intel {
    padding: 18px 12px 34px;
  }

  .lombard-intel__intro {
    gap: 14px;
    margin-bottom: 18px;
  }

  .lombard-intel__intro h2 {
    font-size: clamp(34px, 10vw, 46px);
  }

  .lombard-intel__intro p:not(.kicker) {
    font-size: 15px;
  }

  .lombard-station-strip {
    grid-template-columns: 1fr;
  }

  .lombard-arrival-panel .arrival-map {
    min-height: 0;
  }

  .lombard-station-strip div {
    min-height: 112px;
    padding: 18px;
  }

  .lombard-station-strip strong {
    font-size: 34px;
  }

  .lombard-page .lombard-intel .intel-grid {
    gap: 12px;
  }

  .lombard-page .lombard-intel .micro-card {
    padding: 16px;
  }

  .lombard-page .lombard-intel .micro-head {
    gap: 10px;
    margin-bottom: 16px;
    font-size: 11px;
  }

  .lombard-page .lombard-intel .arrival-map,
  .lombard-page .lombard-intel .telemetry,
  .lombard-page .lombard-intel .week-grid,
  .lombard-page .lombard-intel .commute-diagram {
    min-height: 0;
  }

  .lombard-page .lombard-intel .arrival-map {
    height: clamp(236px, 76vw, 300px);
  }

  .lombard-page .lombard-intel .commute-diagram {
    height: clamp(258px, 82vw, 320px);
  }

  .lombard-page .lombard-intel .arrival-pin {
    max-width: 44%;
    gap: 5px;
    padding: 6px 7px;
    font-size: 8.5px;
  }

  .lombard-page .lombard-arrival-map .arrival-pin {
    max-width: none;
    padding: 6px 7px;
    font-size: 8px;
  }

  .lombard-page .lombard-intel .arrival-pin::before {
    width: 5px;
    height: 5px;
    box-shadow: 0 0 0 4px rgba(195, 154, 95, 0.14);
  }

  .lombard-page .lombard-intel .telemetry {
    gap: 10px;
    padding: 16px;
    font-size: 14px;
  }

  .lombard-page .lombard-intel .amenity-notes strong {
    font-size: 24px;
  }

  .lombard-page .lombard-intel .week-grid {
    gap: 6px;
    padding: 12px;
  }

  .lombard-page .lombard-intel .week-grid span,
  .lombard-page .lombard-intel .week-grid button {
    min-height: 42px;
    font-size: 10px;
  }

  .lombard-page .lombard-intel .week-grid svg {
    width: 32px;
  }

  .lombard-page .lombard-intel .commute-node {
    max-width: 46%;
    padding: 7px 8px;
  }

  .lombard-page .lombard-intel .commute-node strong {
    font-size: 10px;
  }

  .lombard-page .lombard-intel .commute-node small {
    font-size: 7.5px;
  }

  .lombard-page .lombard-intel .commute-node--hub {
    left: 33%;
    top: 44%;
    max-width: 82px;
  }

  .lombard-page .lombard-intel .commute-node--bank {
    left: 52%;
    top: 40%;
  }

  .lombard-page .lombard-intel .commute-node--monument {
    right: 4%;
    top: 8%;
  }

  .lombard-page .lombard-intel .commute-node--cannon {
    left: 5%;
    bottom: 10%;
  }

  .lombard-page .lombard-intel .commute-node--liverpool {
    right: 5%;
    bottom: 9%;
  }

  .lombard-cta-row {
    align-items: stretch;
    flex-direction: column;
  }

  .lombard-cta {
    width: 100%;
  }

  .lombard-page .global-email-cta {
    display: none;
  }

  .lombard-page .arrival-pin--building {
    left: 7%;
    bottom: 8%;
  }

  .lombard-page .arrival-pin--bank {
    left: 43%;
    top: 43%;
  }

  .lombard-page .arrival-pin--monument {
    right: 5%;
    top: 10%;
  }

  .lombard-page .arrival-pin--cannon {
    right: 5%;
    bottom: 15%;
  }

  .lombard-page .arrival-pin--liverpool {
    left: 8%;
    top: 10%;
  }

  .lombard-contact-popup {
    right: 14px;
    bottom: 72px;
    padding: 22px 18px 18px;
  }
}

@media (max-width: 860px) {
  body.lombard-page .site-top {
    position: sticky;
    top: 0;
    z-index: 80;
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 10px 12px;
    align-items: center;
    padding: 10px 16px;
    border-bottom: 1px solid rgba(36, 27, 23, 0.12);
    background: color-mix(in srgb, var(--paper) 91%, var(--surface-strong));
    backdrop-filter: blur(18px);
  }

  body.lombard-page section[id],
  body.lombard-page footer[id] {
    scroll-margin-top: 132px;
  }

  body.lombard-page .wordmark {
    min-width: 0;
    min-height: 44px;
  }

  body.lombard-page .wordmark strong {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
  }

  body.lombard-page .site-top nav {
    grid-column: 1 / -1;
    display: flex;
    flex-wrap: nowrap;
    justify-content: flex-start;
    gap: 6px;
    overflow-x: auto;
    padding: 0 0 3px;
    scrollbar-width: none;
  }

  body.lombard-page .site-top nav::-webkit-scrollbar {
    display: none;
  }

  body.lombard-page .site-top nav a {
    flex: 0 0 auto;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 44px;
    padding: 10px 12px;
    font-size: 0.72rem;
    line-height: 1.1;
  }

  body.lombard-page .top-cta {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 44px;
    padding: 10px 14px;
    font-size: 0.72rem;
    line-height: 1.1;
  }
}

@media (max-width: 720px) {
  body.lombard-page .heritage-hero {
    display: grid;
    min-height: auto;
    background: var(--obsidian);
  }

  body.lombard-page .heritage-hero::before {
    background:
      linear-gradient(180deg, rgba(23, 17, 15, 0.04) 0%, rgba(23, 17, 15, 0.7) 100%);
  }

  body.lombard-page .heritage-hero-media {
    position: relative;
    z-index: 0;
    overflow: hidden;
  }

  body.lombard-page .heritage-hero img {
    height: clamp(235px, 64vw, 360px);
    min-height: 0;
    opacity: 0.86;
    object-position: center 36%;
  }

  body.lombard-page .heritage-title {
    position: relative;
    left: auto;
    right: auto;
    bottom: auto;
    display: grid;
    gap: 16px;
    padding: 24px 18px 28px;
    background:
      linear-gradient(180deg, rgba(23, 17, 15, 0.82), var(--obsidian)),
      var(--obsidian);
    text-shadow: none;
  }

  body.lombard-page .heritage-title .kicker {
    margin: 0;
    font-size: 0.64rem;
  }

  body.lombard-page .heritage-title h1 {
    max-width: 10ch;
    margin: 0;
    font-size: clamp(2.7rem, 13vw, 4rem);
    line-height: 0.92;
  }

  body.lombard-page .heritage-title p:not(.kicker) {
    max-width: 34rem;
    margin: 0;
    color: rgba(251, 242, 226, 0.82);
    font-size: 1rem;
    line-height: 1.46;
  }

  body.lombard-page .heritage-ledger {
    display: grid;
    grid-auto-columns: minmax(136px, 44vw);
    grid-auto-flow: column;
    grid-template-columns: none;
    gap: 8px;
    overflow-x: auto;
    margin: 0;
    padding: 0 0 4px;
    background: transparent;
    scroll-snap-type: x mandatory;
    scrollbar-width: thin;
  }

  body.lombard-page .heritage-ledger div {
    min-height: 88px;
    padding: 13px;
    border: 1px solid rgba(251, 242, 226, 0.16);
    border-radius: 8px;
    background: rgba(251, 242, 226, 0.08);
    scroll-snap-align: start;
  }

  body.lombard-page .heritage-ledger dt {
    margin-bottom: 10px;
    font-size: 0.58rem;
  }

  body.lombard-page .heritage-ledger dd {
    font-size: clamp(1.25rem, 6vw, 1.6rem);
  }

  body.lombard-page .heritage-title .lombard-cta-row,
  body.lombard-page .lombard-cta-row {
    display: grid;
    grid-template-columns: 1fr;
    gap: 8px;
    margin: 0;
  }

  body.lombard-page .lombard-cta {
    width: 100%;
    min-height: 42px;
    border-radius: 8px;
  }

  body.lombard-page .chapter,
  body.lombard-page .details-chapter,
  body.lombard-page .location-roll,
  body.lombard-page .site-map-section,
  body.lombard-page .savoy-carousel,
  body.lombard-page .contact-footer {
    padding: 46px 18px;
  }

  body.lombard-page .heritage-arrival,
  body.lombard-page .lombard-spec-section {
    gap: 24px;
    padding-top: 44px;
    padding-bottom: 44px;
  }

  body.lombard-page .chapter-copy h2,
  body.lombard-page .heritage-editorial-copy h2,
  body.lombard-page .lombard-floors__intro h2,
  body.lombard-page .lombard-floor__copy h3,
  body.lombard-page .location-roll h2,
  body.lombard-page .site-map-section h2,
  body.lombard-page .savoy-carousel__copy h2,
  body.lombard-page .contact-footer h2 {
    font-size: clamp(2.25rem, 10.5vw, 3.35rem);
    line-height: 0.98;
  }

  body.lombard-page .chapter-copy p:not(.kicker),
  body.lombard-page .heritage-editorial-copy p,
  body.lombard-page .lombard-floors__intro p:not(.kicker),
  body.lombard-page .lombard-floor__copy p:not(.lombard-floor__eyebrow),
  body.lombard-page .location-roll > p:not(.kicker),
  body.lombard-page .site-map-copy p:not(.site-map-kicker),
  body.lombard-page .savoy-carousel__copy p:not(.kicker),
  body.lombard-page .contact-footer p:not(.kicker) {
    max-width: 36rem;
    font-size: 0.98rem;
    line-height: 1.48;
  }

  body.lombard-page .stacked-media,
  body.lombard-page .image-timeline,
  body.lombard-page .full-image-gallery {
    display: grid;
    grid-auto-flow: column;
    overflow-x: auto;
    overscroll-behavior-inline: contain;
    scroll-snap-type: x mandatory;
    scrollbar-width: thin;
  }

  body.lombard-page .stacked-media figure,
  body.lombard-page .image-timeline figure,
  body.lombard-page .full-image-gallery img {
    scroll-snap-align: start;
  }

  body.lombard-page .lombard-spec-grid,
  body.lombard-page .lombard-floor__media,
  body.lombard-page .lombard-floor__spec,
  body.lombard-page .roll-grid,
  body.lombard-page .site-map-points {
    display: grid;
    grid-auto-flow: row;
    grid-template-columns: 1fr;
    overflow: visible;
    scroll-snap-type: none;
  }

  body.lombard-page .lombard-floor__tags {
    display: flex;
    flex-wrap: wrap;
    overflow: visible;
    padding-bottom: 0;
  }

  body.lombard-page .lombard-spec-grid {
    gap: 10px;
    padding-bottom: 0;
  }

  body.lombard-page .lombard-floor__media {
    gap: 12px;
    padding-bottom: 0;
  }

  body.lombard-page .lombard-floor__spec {
    gap: 8px;
    border: 0;
    background: transparent;
  }

  body.lombard-page .lombard-floor__spec li {
    border: 1px solid var(--line);
    border-radius: 8px;
  }

  body.lombard-page .lombard-floor__tags {
    gap: 8px;
  }

  body.lombard-page .lombard-floor__tags span {
    width: auto;
    white-space: normal;
  }

  body.lombard-page .roll-grid {
    gap: 10px;
    margin-top: 24px;
    background: transparent;
  }

  body.lombard-page .site-map-points {
    gap: 8px;
    margin-top: 20px;
    padding-bottom: 0;
  }

  body.lombard-page .stacked-media img,
  body.lombard-page .stacked-media img:nth-child(2) {
    height: 310px;
  }

  body.lombard-page .heritage-editorial-copy {
    justify-items: start;
    padding: 46px 18px 30px;
    text-align: left;
  }

  body.lombard-page .heritage-editorial-statement img {
    height: clamp(260px, 66vw, 360px);
    min-height: 0;
  }

  body.lombard-page .image-timeline {
    gap: 12px;
    padding: 12px 18px 18px;
  }

  body.lombard-page .image-timeline img {
    height: 310px;
  }

  body.lombard-page .lombard-spec-grid {
    grid-template-columns: 1fr;
  }

  body.lombard-page .lombard-spec-grid li {
    min-height: 132px;
    border: 1px solid var(--line);
    border-radius: 8px;
  }

  body.lombard-page .lombard-floors {
    padding: 46px 18px 54px;
  }

  body.lombard-page .lombard-floors__intro {
    gap: 16px;
    margin-bottom: 18px;
  }

  body.lombard-page .lombard-floor {
    gap: 22px;
    max-width: none;
    padding: 34px 0;
  }

  body.lombard-page .lombard-floor__eyebrow {
    margin-bottom: 12px;
    font-size: 0.68rem;
  }

  body.lombard-page .lombard-floor__media {
    grid-template-columns: 1fr;
  }

  body.lombard-page .lombard-floor-plan,
  body.lombard-page .lombard-floor-photo {
    aspect-ratio: 4 / 3;
  }

  body.lombard-page .lombard-floor-plan {
    padding: 12px;
  }

  body.lombard-page .lombard-floor__spec {
    grid-template-columns: 1fr;
  }

  body.lombard-page .lombard-floor__tags {
    gap: 8px;
  }

  body.lombard-page .lombard-floor__tags span {
    width: 100%;
    white-space: normal;
  }

  body.lombard-page .location-roll {
    padding-bottom: 36px;
  }

  body.lombard-page .roll-grid {
    grid-template-columns: 1fr;
  }

  body.lombard-page .roll-grid article {
    min-height: 170px;
    padding: 18px;
    border: 1px solid var(--line);
    border-radius: 8px;
    background: var(--surface-strong);
  }

  body.lombard-page .full-image-gallery {
    grid-auto-columns: minmax(255px, 80vw);
    grid-template-columns: none;
    gap: 12px;
    padding: 12px 18px 18px;
  }

  body.lombard-page .full-image-gallery img {
    height: 300px;
    border: 1px solid rgba(251, 242, 226, 0.12);
    border-radius: 8px;
  }

  body.lombard-page .site-map-section {
    gap: 24px;
  }

  body.lombard-page .site-map-points {
    grid-template-columns: 1fr;
  }

  body.lombard-page .site-map-points span {
    border-radius: 8px;
  }

  body.lombard-page .site-map-wrap {
    min-height: 340px;
    border-radius: 8px;
  }

  body.lombard-page .savoy-carousel {
    gap: 22px;
  }

  body.lombard-page .savoy-carousel__stage {
    grid-template-columns: 1fr 1fr;
    gap: 10px;
  }

  body.lombard-page .savoy-carousel__track {
    grid-column: 1 / -1;
    min-height: 300px;
    border-radius: 8px;
  }

  body.lombard-page .savoy-carousel__control {
    grid-row: 2;
    width: 100%;
    min-height: 44px;
    height: 44px;
    border-radius: 8px;
  }

  body.lombard-page .savoy-carousel__dots button {
    width: 44px;
    height: 44px;
  }

  body.lombard-page .savoy-carousel__dots {
    right: 14px;
    bottom: 58px;
  }

  body.lombard-page .contact-footer {
    gap: 24px;
  }

  body.lombard-page .contact-footer address {
    display: grid;
    gap: 0;
  }

  body.lombard-page .contact-footer a {
    grid-template-columns: 1fr;
    gap: 4px;
    min-height: 58px;
    padding: 13px 0;
  }

  body.lombard-page .contact-footer a small {
    max-width: none;
    text-align: left;
  }

  body.lombard-page .contact-footer .brochure-disclaimer {
    font-size: 0.72rem;
  }

  body.lombard-page .global-email-cta {
    display: none;
  }

  body.lombard-page .lombard-contact-popup {
    right: 12px;
    bottom: 12px;
    width: calc(100% - 24px);
    max-height: min(430px, calc(100svh - 24px));
    overflow: auto;
    padding: 20px 16px 16px;
  }

  body.lombard-page .lombard-contact-popup__close {
    top: 10px;
    right: 10px;
    min-width: 44px;
    min-height: 44px;
    padding: 10px 12px;
    font-size: 0.72rem;
    line-height: 1;
  }
}

/* Thirty Eight Lombard Street v2 */
body.lombard-page.lombard-v2 {
  --paper: #f4eee4;
  --ink: #2a2521;
  --muted: #6b6157;
  --line: rgba(42, 37, 33, 0.14);
  --accent: #c9503c;
  --accent-dark: #8f493d;
  --accent-soft: var(--accent);
  --ivory: #fff8ec;
  --surface: #eee5d8;
  --surface-strong: #fbf5ea;
  --obsidian: #221e1a;
  --lombard-brand-size: 34px;
  --lux-ease: cubic-bezier(0.32, 0.72, 0, 1);
  background: var(--paper);
  color: var(--ink);
}

body.lombard-page.lombard-v2 .site-top {
  min-height: 76px;
  border-bottom-color: rgba(42, 37, 33, 0.1);
  background: color-mix(in srgb, var(--paper) 88%, white);
  color: var(--ink);
  box-shadow: none;
  transition: min-height 320ms var(--lux-ease), padding 320ms var(--lux-ease), background 320ms var(--lux-ease), box-shadow 320ms var(--lux-ease);
}

body.lombard-page.lombard-v2 .site-top nav {
  transition: max-height 320ms var(--lux-ease), padding 320ms var(--lux-ease), opacity 260ms var(--lux-ease), transform 320ms var(--lux-ease), filter 320ms var(--lux-ease);
  max-height: 160px;
  overflow-y: hidden;
}

body.lombard-page.lombard-v2 .site-top__actions {
  position: relative;
  justify-self: end;
  align-self: stretch;
  display: flex;
  align-items: center;
  overflow: visible;
}

body.lombard-page.lombard-v2 .wordmark {
  gap: 12px;
  min-height: 40px;
  color: var(--ink);
}

body.lombard-page.lombard-v2 .wordmark__badge {
  position: relative;
  display: grid;
  width: var(--lombard-brand-size);
  height: var(--lombard-brand-size);
  border: 0;
  background: none;
  color: inherit;
}

body.lombard-page.lombard-v2 .wordmark__badge-outline,
body.lombard-page.lombard-v2 .wordmark__badge-solid,
body.lombard-page.lombard-v2 .lombard-v2-brand-pull {
  display: grid;
  width: var(--lombard-brand-size);
  height: var(--lombard-brand-size);
  place-items: center;
  border: 1px solid var(--ink);
  border-radius: 4px;
  background: none;
  font-family: "Fraunces", Georgia, "Times New Roman", serif;
  font-optical-sizing: auto;
  font-size: calc(var(--lombard-brand-size) * 0.58);
  font-weight: 600;
  line-height: 1;
}

body.lombard-page.lombard-v2 .wordmark__badge-outline,
body.lombard-page.lombard-v2 .wordmark__badge-solid {
  grid-area: 1 / 1;
}

body.lombard-page.lombard-v2 .wordmark__badge-outline {
  background: transparent;
  color: var(--ink);
  opacity: 1;
  transition: opacity 320ms var(--lux-ease);
}

body.lombard-page.lombard-v2 .wordmark__badge-solid {
  border-color: var(--obsidian);
  background: var(--obsidian);
  color: var(--ivory);
  opacity: 0;
  pointer-events: none;
  transition: opacity 320ms var(--lux-ease);
}

body.lombard-page.lombard-v2 .wordmark strong {
  color: var(--ink);
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.19em;
}

body.lombard-page.lombard-v2 .site-top nav a {
  color: #4a4239;
  letter-spacing: 0.08em;
}

body.lombard-page.lombard-v2 .site-top nav a:hover,
body.lombard-page.lombard-v2 .site-top nav a:focus-visible {
  border-color: rgba(201, 80, 60, 0.28);
  color: var(--accent);
}

body.lombard-page.lombard-v2 .top-cta,
body.lombard-page.lombard-v2 .lombard-cta {
  border-color: var(--accent);
  border-radius: 4px;
  background: var(--accent);
  color: var(--ivory);
}

body.lombard-page.lombard-v2 .top-cta {
  position: relative;
  display: inline-flex;
  min-width: 0;
  align-items: center;
  justify-content: center;
  gap: 0;
  min-height: 40px;
  padding: 10px 20px;
  overflow: visible;
  white-space: nowrap;
  border-radius: 4px;
  align-self: center;
  transition: border-radius 320ms var(--lux-ease), padding 320ms var(--lux-ease), transform 320ms var(--lux-ease), background 320ms var(--lux-ease), border-color 320ms var(--lux-ease), color 320ms var(--lux-ease);
}

body.lombard-page.lombard-v2 .top-cta__label {
  position: relative;
  z-index: 2;
}

/* Mobile header: no CTA (the sticky bottom bar owns conversion) - brand + nav only,
   collapsing on scroll into a slim brand-only bar with the landed 38 badge.
   Desktop keeps the full header row and just condenses with a soft shadow. */
@media (max-width: 900px) {
  body.lombard-page.lombard-v2 .site-top {
    position: sticky;
  }

  body.lombard-page.lombard-v2 .site-top__actions {
    display: none;
  }

  body.lombard-page.lombard-v2 .site-top.is-scrolled {
    gap: 0;
    padding-block: 7px;
    background: color-mix(in srgb, var(--paper) 72%, white);
    box-shadow: 0 18px 34px -24px rgba(42, 37, 33, 0.5);
  }

  body.lombard-page.lombard-v2 .site-top.is-scrolled > .wordmark {
    grid-row: 1;
    grid-column: 1;
    display: flex;
    align-items: center;
    min-height: 42px;
  }

  body.lombard-page.lombard-v2 .site-top.is-scrolled .wordmark__badge-outline {
    opacity: 0;
  }

  body.lombard-page.lombard-v2 .site-top.is-scrolled .wordmark__badge-solid {
    opacity: 1;
  }

  body.lombard-page.lombard-v2 .site-top.is-scrolled nav {
    max-height: 0;
    margin: 0;
    padding-top: 0;
    padding-bottom: 0;
    opacity: 0;
    transform: translateY(-6px);
    filter: blur(1px);
    pointer-events: none;
  }
}

@media (min-width: 901px) {
  body.lombard-page.lombard-v2 .site-top.is-scrolled {
    min-height: 64px;
    background: color-mix(in srgb, var(--paper) 78%, white);
    box-shadow: 0 18px 40px -28px rgba(42, 37, 33, 0.4);
  }
}

body.lombard-page.lombard-v2 .top-cta:hover,
body.lombard-page.lombard-v2 .top-cta:focus-visible,
body.lombard-page.lombard-v2 .lombard-cta:hover,
body.lombard-page.lombard-v2 .lombard-cta:focus-visible {
  border-color: var(--obsidian);
  background: var(--obsidian);
  color: var(--ivory);
}

body.lombard-page.lombard-v2 .lombard-cta--ghost {
  border-color: currentColor;
  background: transparent;
  color: inherit;
}

body.lombard-page.lombard-v2 .lombard-cta--ghost:hover,
body.lombard-page.lombard-v2 .lombard-cta--ghost:focus-visible {
  border-color: var(--accent);
  background: var(--accent);
  color: var(--ivory);
}

body.lombard-page.lombard-v2 .lombard-v2-brand-pull {
  position: absolute;
  left: 0;
  top: 0;
  z-index: 3;
  border-color: var(--obsidian);
  background: var(--obsidian);
  color: var(--ivory);
  pointer-events: none;
  opacity: 0;
  display: none;
}

.lombard-v2-frieze {
  position: absolute;
  left: 0;
  right: 0;
  top: 0;
  z-index: 1;
  display: flex;
  height: 46px;
  align-items: end;
  gap: 0;
  overflow: hidden;
  padding: 0;
  border-bottom: 1px solid rgba(201, 80, 60, 0.18);
  background: color-mix(in srgb, var(--paper) 92%, white);
  pointer-events: none;
}

.lombard-v2-frieze span {
  flex: 1 1 0;
  min-width: 0;
  height: 40px;
  border: 1px solid rgba(201, 80, 60, 0.35);
  border-bottom: 0;
  border-radius: 18px 18px 0 0;
}

.lombard-v2-hero {
  position: relative;
  display: grid;
  grid-template-rows: minmax(0, 1fr) auto;
  min-height: calc(100svh - 122px);
  align-items: end;
  overflow: hidden;
  background: var(--obsidian);
  color: var(--ivory);
  isolation: isolate;
}

.lombard-v2-hero__media,
.lombard-v2-hero__media img,
.lombard-v2-hero__shade {
  position: absolute;
  inset: 0;
}

.lombard-v2-hero__media {
  z-index: -3;
  margin: 0;
}

.lombard-v2-hero__media img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center 38%;
  opacity: 0.9;
  filter: saturate(0.94) contrast(1.03);
}

/* Desktop shade darkens the left edge so the copy sits over the darkened side
   and the Portland stone facade, panned right, stays visible. Mobile overrides this. */
.lombard-v2-hero__shade {
  z-index: -2;
  background:
    linear-gradient(90deg, rgba(34, 30, 26, 0.96) 0%, rgba(34, 30, 26, 0.72) 34%, rgba(34, 30, 26, 0.28) 66%, rgba(34, 30, 26, 0.08) 100%),
    linear-gradient(0deg, rgba(34, 30, 26, 0.96) 0%, rgba(34, 30, 26, 0.35) 56%, rgba(34, 30, 26, 0.18) 100%);
}

.lombard-v2-hero__content {
  width: min(1120px, 100%);
  padding: clamp(76px, 10vw, 132px) clamp(22px, 6vw, 88px) clamp(34px, 5vw, 62px);
}

.lombard-v2-hero__content .kicker,
.lombard-v2-gallery .kicker,
.lombard-v2-contact .kicker {
  color: var(--accent);
}

.lombard-v2-hero__content h1 {
  max-width: 760px;
  margin-bottom: 26px;
  color: var(--ivory);
  font-size: clamp(3.1rem, 6.6vw, 6.2rem);
  line-height: 0.94;
}

.lombard-v2-hero__content p:not(.kicker) {
  max-width: 650px;
  margin-bottom: 0;
  color: rgba(255, 248, 236, 0.82);
  font-size: clamp(1.04rem, 1.5vw, 1.32rem);
  line-height: 1.55;
}

/* Desktop only: the facade sits mid-frame in the photo, so zoom the crop and pan
   it right; the left-aligned copy is width-capped so it barely grazes the stone
   building's shaded edge. */
@media (min-width: 901px) {
  .lombard-v2-hero {
    min-height: clamp(660px, calc(100svh - 120px), 850px);
  }

  .lombard-v2-hero__media img {
    width: 140%;
    max-width: none;
  }

  .lombard-v2-hero__content {
    width: min(1240px, 100%);
    padding-top: clamp(64px, 7.4vw, 104px);
    padding-bottom: clamp(26px, 3.4vw, 42px);
  }

  .lombard-v2-hero__content h1 {
    max-width: 820px;
  }

  .lombard-v2-hero__content p:not(.kicker) {
    max-width: 620px;
  }

  body.lombard-page.lombard-v2 .lombard-v2-hero .lombard-cta-row {
    margin-top: 22px;
  }
}

.lombard-v2-hero__facts {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  margin: 0;
  padding: 1px;
  background: rgba(255, 248, 236, 0.22);
}

.lombard-v2-hero__facts div {
  min-height: 112px;
  padding: 18px clamp(18px, 3vw, 36px);
  background: rgba(34, 30, 26, 0.74);
  backdrop-filter: blur(18px);
}

.lombard-v2-hero__facts dt,
.lombard-v2-hero__facts dd {
  margin: 0;
}

.lombard-v2-hero__facts dt {
  margin-bottom: 14px;
  color: rgba(255, 248, 236, 0.58);
  font-size: 0.72rem;
  font-weight: 900;
  line-height: 1.1;
  text-transform: uppercase;
}

.lombard-v2-hero__facts dd {
  color: var(--ivory);
  font-family: "Fraunces", Georgia, "Times New Roman", serif;
  font-optical-sizing: auto;
  font-weight: 560;
  letter-spacing: -0.01em;
  font-size: clamp(1.75rem, 3vw, 2.2rem);
  line-height: 1.05;
}

.lombard-v2-section {
  display: grid;
  grid-template-columns: minmax(280px, 0.68fr) minmax(0, 1fr);
  gap: clamp(36px, 7vw, 118px);
  align-items: center;
  padding: clamp(72px, 9vw, 138px) clamp(22px, 6vw, 88px);
}

.lombard-v2-copy h2,
.lombard-v2-location__intro h2 {
  max-width: 780px;
  color: var(--ink);
  font-size: clamp(2.75rem, 5.5vw, 5.25rem);
  line-height: 0.96;
}

.lombard-v2-copy p:not(.kicker),
.lombard-v2-location__intro p {
  max-width: 620px;
  margin-bottom: 0;
  color: var(--muted);
  font-size: clamp(1rem, 1.25vw, 1.14rem);
  line-height: 1.6;
}

.lombard-v2-opportunity {
  overflow: hidden;
  background:
    radial-gradient(100% 86% at 100% 0%, rgba(201, 80, 60, 0.16), transparent 58%),
    linear-gradient(180deg, var(--obsidian) 0%, #171411 100%);
  color: var(--ivory);
}

.lombard-v2-opportunity .kicker {
  color: var(--accent);
}

.lombard-v2-opportunity .lombard-v2-copy h2 {
  color: var(--ivory);
}

.lombard-v2-opportunity .lombard-v2-copy p:not(.kicker) {
  color: rgba(255, 248, 236, 0.76);
}

.lombard-v2-pill-list {
  display: flex;
  flex-wrap: wrap;
  gap: 9px;
  margin: 32px 0 0;
  padding: 0;
  list-style: none;
}

.lombard-v2-pill-list li {
  min-height: 34px;
  padding: 8px 11px;
  border: 1px solid rgba(201, 80, 60, 0.28);
  border-radius: 4px;
  background: rgba(255, 255, 255, 0.48);
  color: color-mix(in srgb, var(--ink) 82%, var(--accent));
  font-size: 0.74rem;
  font-weight: 900;
  line-height: 1.2;
  text-transform: uppercase;
}

.lombard-v2-opportunity .lombard-v2-pill-list li {
  border-color: rgba(255, 248, 236, 0.18);
  background: rgba(255, 248, 236, 0.08);
  color: rgba(255, 248, 236, 0.9);
}

.lombard-v2-media-pair {
  display: grid;
  grid-template-columns: 1fr 0.72fr;
  gap: clamp(14px, 2vw, 24px);
  align-items: end;
}

.lombard-v2-media-pair figure {
  position: relative;
  margin: 0;
  overflow: hidden;
  border-radius: 6px;
  background: var(--obsidian);
  box-shadow: 0 24px 70px rgba(42, 37, 33, 0.12);
}

.lombard-v2-opportunity .lombard-v2-media-pair figure {
  border: 1px solid rgba(255, 248, 236, 0.12);
  box-shadow: 0 28px 80px rgba(0, 0, 0, 0.28);
}

.lombard-v2-media-pair figure:first-child {
  aspect-ratio: 4 / 5;
}

.lombard-v2-media-pair figure:last-child {
  aspect-ratio: 4 / 3;
}

.lombard-v2-media-pair img {
  height: 100%;
  object-fit: cover;
}

.lombard-v2-media-pair figcaption {
  position: absolute;
  left: 14px;
  bottom: 14px;
  max-width: calc(100% - 28px);
  padding: 9px 12px;
  border-radius: 4px;
  background: rgba(34, 30, 26, 0.78);
  color: var(--ivory);
  font-size: 0.66rem;
  font-weight: 900;
  line-height: 1;
  text-transform: uppercase;
  backdrop-filter: blur(12px);
}

.lombard-v2-availability {
  grid-template-columns: minmax(280px, 0.52fr) minmax(0, 1fr);
  align-items: start;
  background:
    radial-gradient(130% 110% at 0% 0%, rgba(201, 80, 60, 0.07), transparent 62%),
    var(--paper);
}

.lombard-v2-availability-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 1px;
  grid-column: 2;
  padding: 1px;
  background: var(--line);
}

.lombard-v2-availability-grid article {
  min-width: 0;
  min-height: 214px;
  padding: clamp(18px, 2.2vw, 28px);
  background: var(--surface-strong);
  container-type: inline-size;
}

.lombard-v2-availability-grid span,
.lombard-v2-availability-grid small {
  display: block;
  color: var(--muted);
  font-size: 0.74rem;
  font-weight: 900;
  line-height: 1.25;
  text-transform: uppercase;
}

.lombard-v2-availability-grid strong {
  display: block;
  margin: clamp(34px, 5vw, 62px) 0 12px;
  color: var(--accent);
  font-family: "Fraunces", Georgia, "Times New Roman", serif;
  font-variation-settings: "opsz" 144;
  letter-spacing: -0.01em;
  font-size: clamp(2.55rem, 5.4vw, 5rem);
  /* Container-aware size so the large figures never clip inside their cards. */
  font-size: clamp(2rem, 30cqi, 5rem);
  font-weight: 560;
  line-height: 1.02;
}

.lombard-v2-fitout-note {
  display: flex;
  grid-column: 2;
  gap: 14px;
  max-width: 920px;
  align-items: start;
  padding-top: 22px;
  border-top: 1px solid var(--line);
  color: var(--muted);
}

.lombard-v2-fitout-note span {
  width: 12px;
  height: 12px;
  flex: 0 0 auto;
  margin-top: 7px;
  border: 2px solid var(--accent);
  border-bottom: 0;
  border-radius: 6px 6px 0 0;
}

.lombard-v2-fitout-note p {
  max-width: 760px;
  margin: 0;
  font-size: clamp(1rem, 1.18vw, 1.1rem);
  line-height: 1.55;
}

body.lombard-page.lombard-v2 .lombard-floors {
  background: linear-gradient(180deg, var(--paper) 0%, var(--surface) 30%, var(--surface) 100%);
}

body.lombard-page.lombard-v2 .lombard-floor {
  border-top-color: rgba(42, 37, 33, 0.16);
}

body.lombard-page.lombard-v2 .lombard-floor-plan,
body.lombard-page.lombard-v2 .lombard-floor-photo {
  border-radius: 6px;
}

.lombard-v2-floor-divider {
  display: flex;
  max-width: 1480px;
  align-items: center;
  gap: clamp(16px, 3vw, 32px);
  margin: clamp(18px, 4vw, 42px) auto 0;
  color: var(--accent);
  font-size: 0.74rem;
  font-weight: 900;
  letter-spacing: 0.12em;
  text-transform: uppercase;
}

.lombard-v2-floor-divider::before,
.lombard-v2-floor-divider::after {
  height: 1px;
  flex: 1;
  content: "";
  background: rgba(42, 37, 33, 0.18);
}

.lombard-v2-floor-divider span {
  display: inline-flex;
  align-items: center;
  gap: 12px;
}

.lombard-v2-floor-divider span::before {
  width: 14px;
  height: 14px;
  border: 2px solid var(--accent);
  border-bottom: 0;
  border-radius: 7px 7px 0 0;
  content: "";
}

.lombard-v2-gallery {
  position: relative;
  isolation: isolate;
  min-height: 100dvh;
  margin-top: clamp(-56px, -4vw, -28px);
  padding: 0;
  overflow: hidden;
  background:
    radial-gradient(100% 70% at 78% 28%, rgba(201, 80, 60, 0.2), transparent 58%),
    linear-gradient(180deg, #171411 0%, var(--obsidian) 46%, #171411 100%);
  color: var(--ivory);
}

.lombard-v2-gallery::before,
.lombard-v2-gallery::after {
  position: absolute;
  inset: 0;
  z-index: -1;
  content: "";
  pointer-events: none;
}

.lombard-v2-gallery::before {
  background:
    linear-gradient(90deg, rgba(23, 20, 17, 0.82) 0%, transparent 28%, transparent 72%, rgba(23, 20, 17, 0.72) 100%),
    linear-gradient(180deg, rgba(23, 20, 17, 0.92) 0%, transparent 20%, transparent 76%, rgba(23, 20, 17, 0.9) 100%);
}

.lombard-v2-gallery::after {
  opacity: 0.22;
  background-image:
    linear-gradient(rgba(255, 248, 236, 0.055) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255, 248, 236, 0.04) 1px, transparent 1px);
  background-size: 44px 44px;
  mask-image: radial-gradient(circle at 50% 45%, black, transparent 76%);
}

.lombard-v2-gallery__intro {
  position: absolute;
  top: clamp(22px, 4vw, 46px);
  left: clamp(22px, 4vw, 76px);
  z-index: 3;
  max-width: 1480px;
  margin: 0;
}

.lombard-v2-gallery__intro .kicker {
  margin: 0;
}

.lombard-v2-gallery__grid {
  --gallery-overlap: clamp(34px, 4vw, 76px);
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(280px, 25vw);
  grid-template-rows: repeat(3, minmax(0, 1fr));
  gap: 0;
  width: 100vw;
  min-height: 100dvh;
  height: clamp(720px, 100dvh, 1020px);
  margin: 0;
  padding-left: 0;
}

.lombard-v2-gallery__grid img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  filter: saturate(0.9) contrast(1.08);
}

.lombard-v2-gallery__grid img:first-child {
  grid-row: span 3;
  object-position: center 42%;
}

.lombard-v2-gallery__grid img:not(:first-child) {
  position: relative;
  z-index: 2;
  width: calc(100% + var(--gallery-overlap));
  margin-left: calc(var(--gallery-overlap) * -1);
  border-left: 1px solid rgba(23, 20, 17, 0.42);
  box-shadow: -24px 0 54px rgba(0, 0, 0, 0.34);
}

.lombard-v2-location {
  padding: clamp(68px, 9vw, 138px) clamp(22px, 6vw, 88px);
  background:
    radial-gradient(120% 100% at 0% 8%, rgba(201, 80, 60, 0.06), transparent 60%),
    var(--paper);
  color: var(--ink);
}

.lombard-v2-location__intro {
  display: grid;
  grid-template-columns: minmax(280px, 0.72fr) minmax(280px, 0.58fr);
  gap: clamp(24px, 5vw, 78px);
  max-width: 1480px;
  align-items: end;
  margin: 0 auto clamp(38px, 5.5vw, 76px);
}

.lombard-v2-location__intro .kicker {
  grid-column: 1 / -1;
  margin-bottom: -6px;
}

.lombard-v2-location__intro h2 {
  margin: 0;
}

.lombard-v2-location__intro p {
  margin: 0;
}

.lombard-v2-location__grid {
  display: grid;
  grid-template-columns: minmax(0, 1.5fr) minmax(300px, 0.7fr);
  gap: clamp(28px, 4.5vw, 60px);
  max-width: 1480px;
  align-items: stretch;
  margin: 0 auto clamp(40px, 5vw, 68px);
}

body.lombard-page.lombard-v2 .lombard-v2-location .site-map-wrap {
  min-height: clamp(360px, 38vw, 510px);
  border-color: rgba(42, 37, 33, 0.16);
  border-radius: 6px;
  box-shadow: 0 24px 60px rgba(42, 37, 33, 0.14);
}

body.lombard-page.lombard-v2 .site-map-pin,
body.lombard-page.lombard-v2 .savoy-map-marker span {
  border-color: var(--ivory);
  background: var(--accent);
  color: var(--ivory);
}

/* Stations read as ledger rows (hairline top rules, no boxes) so the map stays
   the only framed element in the location grid. */
.lombard-v2-stations {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  column-gap: clamp(24px, 3vw, 44px);
  row-gap: 0;
}

.lombard-v2-stations div {
  display: grid;
  min-height: 132px;
  align-content: center;
  padding: clamp(20px, 2.6vw, 30px) 0;
  border-top: 1px solid rgba(42, 37, 33, 0.16);
}

.lombard-v2-stations strong {
  display: block;
  color: var(--accent);
  font-family: "Fraunces", Georgia, "Times New Roman", serif;
  font-variation-settings: "opsz" 144;
  letter-spacing: -0.01em;
  font-size: clamp(2rem, 3.8vw, 3.6rem);
  font-weight: 560;
  line-height: 1.02;
}

.lombard-v2-stations span {
  display: block;
  margin-top: 12px;
  color: var(--ink);
  font-size: 0.78rem;
  font-weight: 900;
  line-height: 1.25;
  text-transform: uppercase;
}

.lombard-v2-place-lists {
  display: grid;
  grid-template-columns: 1.06fr 0.82fr 1.12fr;
  gap: clamp(24px, 4vw, 54px);
  max-width: 1480px;
  margin: 0 auto;
  padding-top: clamp(30px, 4vw, 48px);
  border-top: 1px solid rgba(42, 37, 33, 0.14);
}

.lombard-v2-place-lists article {
  color: var(--muted);
  font-size: 0.95rem;
  line-height: 1.55;
}

.lombard-v2-place-lists span {
  display: flex;
  align-items: center;
  gap: 8px;
  margin-bottom: 16px;
  color: var(--ink);
  font-size: 0.76rem;
  font-weight: 900;
  line-height: 1.2;
  text-transform: uppercase;
}

.lombard-v2-place-lists span::before {
  width: 9px;
  height: 9px;
  flex: 0 0 auto;
  border-radius: 50%;
  background: var(--accent);
  content: "";
}

.lombard-v2-place-lists article:nth-child(2) span::before {
  background: #3f8f5b;
}

.lombard-v2-place-lists article:nth-child(3) span::before {
  background: #d4732e;
}

body.lombard-page.lombard-v2 .contact-footer.lombard-v2-contact {
  position: relative;
  overflow: hidden;
  grid-template-columns: minmax(0, 0.95fr) minmax(0, 1.05fr);
  gap: clamp(32px, 4vw, 56px) clamp(40px, 5vw, 88px);
  align-items: center;
  padding: clamp(64px, 7vw, 112px) max(clamp(20px, 6vw, 88px), calc((100% - 1360px) / 2)) clamp(72px, 7vw, 120px);
  background:
    radial-gradient(120% 130% at 80% -10%, rgba(255, 248, 236, 0.08), transparent 56%),
    linear-gradient(180deg, var(--accent) 0%, color-mix(in srgb, var(--accent) 84%, var(--accent-dark)) 100%);
  color: var(--ivory);
}

body.lombard-page.lombard-v2 .lombard-v2-contact::after {
  position: absolute;
  right: 0;
  bottom: -2px;
  left: 0;
  height: 52px;
  pointer-events: none;
  content: "";
  opacity: 0.18;
  background:
    radial-gradient(36px 52px at 18px 52px, transparent 15px, var(--ivory) 16px 17px, transparent 18px) left bottom / 44px 52px repeat-x;
}

body.lombard-page.lombard-v2 .lombard-v2-contact .kicker,
body.lombard-page.lombard-v2 .lombard-v2-contact h2,
body.lombard-page.lombard-v2 .lombard-v2-contact a {
  color: var(--ivory);
}

body.lombard-page.lombard-v2 .lombard-v2-contact p:not(.kicker) {
  color: rgba(255, 248, 236, 0.76);
}

body.lombard-page.lombard-v2 .lombard-v2-contact address {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 20px;
  align-self: center;
  border-top: 0;
}

body.lombard-page.lombard-v2 .lombard-v2-contact-card {
  display: flex;
  flex-direction: column;
  min-width: 0;
  padding: 20px 24px 8px;
  border: 1px solid rgba(255, 248, 236, 0.18);
  border-radius: 10px;
  background: rgba(255, 248, 236, 0.08);
}

body.lombard-page.lombard-v2 .lombard-v2-contact-card h3 {
  margin: 0 0 14px;
  font-family: inherit;
  font-size: 1.18rem;
  font-weight: 800;
  letter-spacing: 0.01em;
  line-height: 1.25;
}

body.lombard-page.lombard-v2 .lombard-v2-contact-card a {
  display: flex;
  flex-direction: column;
  gap: 3px;
  align-items: flex-start;
  justify-content: center;
  min-height: 56px;
  padding: 10px 0 12px;
  border-top: 1px solid rgba(255, 248, 236, 0.16);
  border-bottom: 0;
}

body.lombard-page.lombard-v2 .lombard-v2-contact-card a::after {
  content: none;
}

body.lombard-page.lombard-v2 .lombard-v2-contact-card a small,
body.lombard-page.lombard-v2 .lombard-v2-contact-brochure small {
  max-width: none;
  color: rgba(255, 248, 236, 0.58);
  font-size: 0.62rem;
  font-weight: 800;
  letter-spacing: 0.14em;
  line-height: 1.2;
  text-align: left;
  text-transform: uppercase;
}

body.lombard-page.lombard-v2 .lombard-v2-contact-card a span {
  flex: 0 0 auto;
  min-width: 0;
  max-width: 100%;
  font-size: 0.98rem;
  line-height: 1.35;
}

body.lombard-page.lombard-v2 .lombard-v2-contact-card a[href^="mailto:"] span {
  overflow-wrap: anywhere;
}

body.lombard-page.lombard-v2 .lombard-v2-contact-brochure {
  grid-column: 1 / -1;
  display: flex;
  flex-direction: row;
  gap: 20px;
  align-items: center;
  justify-content: space-between;
  min-height: 52px;
  padding: 14px 24px;
  border: 1px solid rgba(255, 248, 236, 0.18);
  border-bottom: 1px solid rgba(255, 248, 236, 0.18);
  border-radius: 10px;
  background: rgba(255, 248, 236, 0.08);
  font-size: 0.98rem;
}

body.lombard-page.lombard-v2 .lombard-v2-contact-brochure::after {
  color: rgba(255, 248, 236, 0.58);
}

body.lombard-page.lombard-v2 .lombard-v2-contact .brochure-disclaimer {
  max-width: none;
  margin: 0;
  padding-top: 16px;
  border-top: 1px solid rgba(255, 248, 236, 0.16);
  color: rgba(255, 248, 236, 0.55);
  font-size: 0.78rem;
}

@media (max-width: 1240px) {
  body.lombard-page.lombard-v2 .contact-footer.lombard-v2-contact {
    grid-template-columns: minmax(0, 1fr);
    gap: clamp(28px, 4vw, 44px);
  }
}

@media (max-width: 900px) {
  body.lombard-page.lombard-v2 .lombard-v2-contact address {
    grid-template-columns: minmax(0, 1fr);
    gap: 14px;
  }
}

@media (max-width: 1180px) {
  .lombard-v2-section,
  .lombard-v2-availability,
  .lombard-v2-location__intro,
  .lombard-v2-location__grid {
    grid-template-columns: 1fr;
  }

  .lombard-v2-availability-grid,
  .lombard-v2-fitout-note {
    grid-column: auto;
  }

  .lombard-v2-availability-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .lombard-v2-location__intro .kicker {
    margin-bottom: 0;
  }
}

@media (max-width: 900px) {
  body.lombard-page.lombard-v2 {
    --lombard-brand-size: 32px;
  }

  body.lombard-page.lombard-v2 .site-top {
    min-height: 0;
    grid-template-columns: minmax(0, 1fr) auto;
  }

  body.lombard-page.lombard-v2 .site-top nav {
    grid-column: 1 / -1;
    justify-content: flex-start;
    overflow-x: auto;
    padding-bottom: 3px;
  }

  .lombard-v2-frieze {
    height: 30px;
  }

  .lombard-v2-frieze span {
    width: auto;
    min-width: 18px;
    height: 26px;
    border-radius: 13px 13px 0 0;
  }

  .lombard-v2-frieze span:nth-child(n + 25) {
    display: none;
  }

  .lombard-v2-hero {
    min-height: calc(100svh - 96px);
  }

  .lombard-v2-hero__content {
    padding-top: 60px;
  }

  .lombard-v2-media-pair {
    grid-template-columns: 1fr;
  }

  .lombard-v2-place-lists {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 720px) {
  body.lombard-page.lombard-v2 {
    --lombard-brand-size: 32px;
  }

  body.lombard-page.lombard-v2 .site-top {
    position: sticky;
    min-height: 0;
    gap: 8px;
    padding: 8px 16px;
  }

  body.lombard-page.lombard-v2 .site-top nav {
    gap: 6px;
    padding-bottom: 2px;
  }

  body.lombard-page.lombard-v2 .site-top nav a {
    min-height: 36px;
    padding: 8px 9px;
    font-size: 0.66rem;
  }

  body.lombard-page.lombard-v2 .site-top.is-scrolled > .wordmark {
    min-height: 52px;
  }

  body.lombard-page.lombard-v2 .wordmark strong {
    max-width: 136px;
  }

  /* Full-bleed mobile hero: facade fills the frame, copy bottom-anchored on the shade */
  .lombard-v2-hero {
    min-height: max(80svh, 540px);
  }

  .lombard-v2-hero__shade {
    background:
      linear-gradient(180deg, rgba(34, 30, 26, 0.34) 0%, rgba(34, 30, 26, 0.1) 32%, rgba(34, 30, 26, 0.5) 58%, rgba(34, 30, 26, 0.92) 100%);
  }

  .lombard-v2-hero__content {
    padding: 96px 20px 24px;
  }

  .lombard-v2-hero__content .kicker {
    margin-bottom: 10px;
    font-size: 0.62rem;
    letter-spacing: 0.14em;
  }

  .lombard-v2-hero__content h1 {
    margin-bottom: 16px;
    font-size: clamp(2.35rem, 10.4vw, 3.1rem);
    line-height: 1.02;
  }

  .lombard-v2-hero__content p:not(.kicker) {
    color: rgba(255, 248, 236, 0.86);
    font-size: 0.98rem;
    line-height: 1.55;
  }

  body.lombard-page.lombard-v2 .lombard-v2-hero .lombard-cta-row {
    display: none;
  }

  body.lombard-page.lombard-v2 .lombard-v2-hero .lombard-cta {
    width: 100%;
    min-height: 48px;
    border-radius: 4px;
  }

  body.lombard-page.lombard-v2 .lombard-v2-hero .lombard-cta--ghost {
    border-color: rgba(255, 248, 236, 0.55);
    background: rgba(34, 30, 26, 0.25);
    color: var(--ivory);
  }

  /* Facts: slim single-row strip attached to the base of the hero image */
  .lombard-v2-hero__facts {
    grid-template-columns: repeat(3, minmax(0, 1fr));
    margin: 0;
    padding: 0;
    border-top: 1px solid rgba(255, 248, 236, 0.18);
    background: rgba(34, 30, 26, 0.88);
    backdrop-filter: blur(14px);
  }

  .lombard-v2-hero__facts div {
    min-height: 0;
    padding: 16px 8px 16px 16px;
    background: none;
    backdrop-filter: none;
  }

  .lombard-v2-hero__facts div + div {
    border-left: 1px solid rgba(255, 248, 236, 0.14);
  }

  .lombard-v2-hero__facts dt {
    margin-bottom: 4px;
    color: rgba(255, 248, 236, 0.56);
    font-size: 0.62rem;
    font-weight: 800;
    letter-spacing: 0.08em;
  }

  .lombard-v2-hero__facts dd {
    font-size: 1.05rem;
  }

  .lombard-v2-availability-grid,
  .lombard-v2-stations {
    grid-template-columns: 1fr;
  }

  .lombard-v2-stations {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .lombard-v2-availability-grid article {
    min-height: 84px;
    padding: 14px;
  }

  .lombard-v2-stations div {
    min-height: 84px;
    padding: 14px 0;
  }

  .lombard-v2-availability-grid span,
  .lombard-v2-availability-grid small,
  .lombard-v2-stations span {
    font-size: 0.78rem;
  }

  .lombard-v2-section,
  .lombard-v2-location,
  .lombard-v2-gallery {
    padding: 36px 16px;
  }

  .lombard-v2-gallery {
    min-height: auto;
    margin-top: -22px;
    padding: 0 0 44px;
  }

  .lombard-v2-gallery__intro {
    position: absolute;
    top: 18px;
    left: 14px;
    padding: 0;
  }

  .lombard-v2-copy h2,
  .lombard-v2-location__intro h2 {
    margin-bottom: 14px;
    font-size: clamp(2rem, 9.4vw, 3rem);
  }

  .lombard-v2-copy p:not(.kicker),
  .lombard-v2-location__intro p {
    font-size: 0.96rem;
    line-height: 1.5;
  }

  body.lombard-page.lombard-v2 .lombard-floors {
    padding: 36px 16px 44px;
  }

  body.lombard-page.lombard-v2 .lombard-floor {
    gap: 18px;
    padding: 26px 0;
  }

  body.lombard-page.lombard-v2 .lombard-floor__spec {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 1px;
    margin-bottom: 18px;
  }

  body.lombard-page.lombard-v2 .lombard-floor__spec li {
    min-height: 0;
    padding: 12px 12px;
    font-size: 0.7rem;
    line-height: 1.18;
  }

  body.lombard-page.lombard-v2 .lombard-floor__tags {
    gap: 6px;
  }

  .lombard-v2-pill-list {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 8px;
    margin-top: 22px;
  }

  .lombard-v2-pill-list li {
    display: flex;
    align-items: center;
    justify-content: center;
    min-height: 32px;
    padding: 7px 10px;
    width: auto;
    font-size: 0.71rem;
    text-align: center;
  }

  .lombard-v2-pill-list li:last-child {
    grid-column: 1 / -1;
  }

  .lombard-v2-media-pair {
    gap: 12px;
  }

  .lombard-v2-media-pair figure:first-child,
  .lombard-v2-media-pair figure:last-child {
    aspect-ratio: 4 / 3;
  }

  .lombard-v2-media-pair figcaption {
    font-size: 0.72rem;
  }

  .lombard-v2-opportunity .lombard-v2-media-pair {
    grid-template-columns: 1fr;
  }

  .lombard-v2-opportunity .lombard-v2-media-pair figure:last-child {
    display: none;
  }

  .lombard-v2-availability-grid article {
    padding: 14px;
  }

  .lombard-v2-availability-grid strong {
    margin: 24px 0 8px;
    font-size: clamp(2.1rem, 10vw, 3.2rem);
  }

  .lombard-v2-fitout-note {
    gap: 12px;
    padding-top: 18px;
  }

  .lombard-v2-fitout-note p {
    font-size: 0.95rem;
  }

  .lombard-v2-gallery__grid {
    display: grid;
    grid-auto-flow: row;
    grid-auto-columns: unset;
    grid-template-columns: 1fr;
    grid-template-rows: none;
    gap: 0;
    height: auto;
    min-height: 0;
    padding: 0;
    overflow: visible;
    overscroll-behavior-inline: auto;
    scroll-snap-type: none;
  }

  .lombard-v2-gallery__grid::-webkit-scrollbar {
    display: none;
  }

  .lombard-v2-gallery__grid img,
  .lombard-v2-gallery__grid img:first-child,
  .lombard-v2-gallery__grid img:not(:first-child) {
    grid-row: auto;
    width: 100%;
    height: clamp(180px, 50vw, 280px);
    margin-left: 0;
    border: 0;
    border-radius: 0;
    box-shadow: none;
    scroll-snap-align: none;
  }

  .lombard-v2-gallery__grid img:first-child {
    height: clamp(440px, 76svh, 640px);
  }

  .lombard-v2-location__grid {
    gap: 12px;
    margin-bottom: 30px;
  }

  body.lombard-page.lombard-v2 .lombard-v2-location .site-map-wrap {
    min-height: 300px;
  }

  .lombard-v2-stations {
    column-gap: 18px;
  }

  .lombard-v2-stations div {
    padding: 16px 0;
  }

  .lombard-v2-stations strong {
    font-size: clamp(1.8rem, 9vw, 2.7rem);
  }

  .lombard-v2-place-lists {
    gap: 16px;
    padding-top: 20px;
  }

  .lombard-v2-place-lists article {
    font-size: 0.92rem;
  }

  .lombard-v2-place-lists span {
    margin-bottom: 12px;
    font-size: 0.78rem;
  }

  .lombard-v2-floor-divider {
    margin-top: 0;
  }

  body.lombard-page.lombard-v2 .contact-footer.lombard-v2-contact {
    gap: 24px;
    padding: 40px 16px calc(104px + env(safe-area-inset-bottom, 0px));
  }

  body.lombard-page.lombard-v2 .lombard-v2-contact::after {
    height: 40px;
  }

  body.lombard-page.lombard-v2 .lombard-v2-contact p:not(.kicker) {
    font-size: 0.94rem;
  }


  body.lombard-page.lombard-v2 .lombard-v2-contact address {
    grid-template-columns: 1fr;
    gap: 12px;
  }

  body.lombard-page.lombard-v2 .lombard-v2-contact-card {
    padding: 16px 18px 4px;
  }

  body.lombard-page.lombard-v2 .lombard-v2-contact-card h3 {
    margin-bottom: 10px;
    font-size: 1.08rem;
  }

  body.lombard-page.lombard-v2 .lombard-v2-contact-card a {
    min-height: 48px;
    padding: 8px 0 10px;
  }

  body.lombard-page.lombard-v2 .lombard-v2-contact-brochure {
    min-height: 48px;
    padding: 12px 18px;
  }

  body.lombard-page.lombard-v2 .lombard-v2-contact .brochure-disclaimer {
    margin-top: 0;
    padding-top: 12px;
    font-size: 0.74rem;
  }
}

@media (max-width: 560px) {
  body.lombard-page.lombard-v2 {
    --lombard-brand-size: 30px;
  }

  body.lombard-page.lombard-v2 .site-top {
    min-height: 0;
    gap: 8px;
    padding: 8px 16px;
  }

  body.lombard-page.lombard-v2 .site-top nav a {
    min-height: 34px;
    padding: 7px 8px;
    font-size: 0.64rem;
  }

  .lombard-v2-hero__content {
    padding: 88px 16px 24px;
  }

  .lombard-v2-section,
  .lombard-v2-location,
  .lombard-v2-gallery {
    padding: 32px 14px;
  }

  .lombard-v2-gallery {
    padding: 0 0 50px;
  }

  body.lombard-page.lombard-v2 .lombard-floors {
    padding: 30px 14px 38px;
  }

  body.lombard-page.lombard-v2 .lombard-floor {
    gap: 16px;
    padding: 22px 0;
  }

  body.lombard-page.lombard-v2 .lombard-floor__spec {
    margin-bottom: 16px;
  }

  body.lombard-page.lombard-v2 .lombard-floor__spec li {
    padding: 10px 10px;
    font-size: 0.68rem;
    line-height: 1.16;
  }

  .lombard-v2-location__intro {
    gap: 16px;
    margin-bottom: 28px;
  }

  .lombard-v2-gallery__intro {
    padding: 0;
    margin-bottom: 0;
  }

  body.lombard-page.lombard-v2 .lombard-v2-location .site-map-wrap {
    min-height: 270px;
  }

  body.lombard-page.lombard-v2 .contact-footer.lombard-v2-contact {
    padding: 32px 14px calc(100px + env(safe-area-inset-bottom, 0px));
  }
}

@media (max-width: 480px) {
  body.lombard-page.lombard-v2 {
    --lombard-brand-size: 28px;
  }

  body.lombard-page.lombard-v2 .wordmark strong {
    max-width: 112px;
  }

  .lombard-v2-frieze {
    height: 24px;
    top: 0;
  }

  .lombard-v2-frieze span {
    min-width: 16px;
    height: 20px;
    border-width: 1px;
    border-radius: 12px 12px 0 0;
  }

  .lombard-v2-frieze span:nth-child(n + 17) {
    display: none;
  }

  .lombard-v2-availability-grid span,
  .lombard-v2-availability-grid small,
  .lombard-v2-stations span,
  .lombard-v2-place-lists span,
  .lombard-v2-media-pair figcaption {
    font-size: 0.76rem;
  }

  .lombard-v2-availability-grid strong {
    font-size: 1.75rem;
  }

  .lombard-v2-hero__facts div {
    padding: 14px 6px 14px 12px;
  }

  .lombard-v2-hero__facts dd {
    font-size: 0.98rem;
  }

  .lombard-v2-gallery__grid {
    grid-auto-columns: unset;
  }
}

@media (max-width: 420px) {
  body.lombard-page .site-top {
    padding-inline: 12px;
  }

  body.lombard-page .heritage-title,
  body.lombard-page .chapter,
  body.lombard-page .details-chapter,
  body.lombard-page .location-roll,
  body.lombard-page .site-map-section,
  body.lombard-page .savoy-carousel,
  body.lombard-page .contact-footer,
  body.lombard-page .lombard-floors {
    padding-right: 14px;
    padding-left: 14px;
  }

  body.lombard-page .heritage-title h1 {
    font-size: 2.55rem;
  }

  body.lombard-page .heritage-ledger {
    grid-auto-columns: minmax(130px, 58vw);
  }

  body.lombard-page .lombard-spec-grid {
    grid-template-columns: 1fr;
  }

  body.lombard-page .site-map-wrap {
    min-height: 310px;
  }
}

.contact-footer a span {
  flex: 1 1 auto;
}

.contact-footer a small {
  max-width: 190px;
  color: rgba(255, 250, 242, 0.56);
  font-size: 0.68rem;
  font-weight: 700;
  line-height: 1.25;
  text-align: right;
}

.contact-footer a[href^="tel:"]::after {
  content: "Call";
}

.contact-footer a[href$=".pdf"]::after {
  content: "PDF";
}

.contact-footer .brochure-disclaimer {
  grid-column: 1 / -1;
  max-width: 1040px;
  margin: 8px 0 0;
  color: rgba(255, 250, 242, 0.5);
  font-size: 0.78rem;
  line-height: 1.55;
}

@media (max-width: 980px) {
  .selector-hero__copy,
  .selector-email-library__intro,
  .selector-legacy {
    grid-template-columns: 1fr;
  }

  .selector-grid,
  .newsletter-template-grid,
  .legacy-links {
    grid-template-columns: 1fr;
  }

  .selector-card {
    min-height: 0;
  }

  .selector-card figure {
    aspect-ratio: 16 / 9;
  }
}

@media (max-width: 680px) {
  .selector-top {
    align-items: flex-start;
    flex-direction: column;
    gap: 12px;
  }

  .selector-hero {
    min-height: 0;
    padding: 30px 18px 42px;
  }

  .selector-hero h1 {
    font-size: 42px;
  }

  .selector-legacy {
    padding: 38px 18px;
  }

  .selector-email-library {
    padding: 38px 18px 46px;
  }

  .newsletter-template-card__summary {
    padding: 18px;
  }

  .newsletter-template-card__summary h3 {
    font-size: 30px;
  }

  .newsletter-template-card__summary dl,
  .newsletter-proof-strip,
  .newsletter-facts,
  .newsletter-contact-band {
    grid-template-columns: 1fr;
  }

  .newsletter-template-card__summary dl div,
  .newsletter-proof-strip div,
  .newsletter-facts div {
    min-height: 0;
  }

  .newsletter-preview {
    padding: 10px;
  }

  .newsletter-download-btn {
    width: 100%;
  }

  .newsletter-hero,
  .newsletter-hero__overlay {
    min-height: 430px;
  }

  .newsletter-hero__overlay {
    align-content: end;
    gap: 14px;
    padding: 26px 18px;
  }

  .newsletter-hero__overlay h4,
  .newsletter-lux-hero__overlay h4,
  .newsletter-deck h5,
  .newsletter-story-panel h5 {
    font-size: 32px;
  }

  .newsletter-story-panel,
  .newsletter-deck {
    padding: 26px 18px;
  }

  .newsletter-lux-hero,
  .newsletter-lux-hero__overlay {
    min-height: 430px;
  }

  .newsletter-lux-hero__overlay {
    gap: 14px;
    padding: 26px 18px;
  }

  .newsletter-overlay-cta,
  .newsletter-email--lombard .newsletter-overlay-cta {
    width: 100%;
  }

  .selector-card {
    min-height: 0;
  }

  .selector-card figure {
    aspect-ratio: 4 / 3;
  }

  .selector-card__body {
    min-height: 0;
  }

  .selector-card__facts {
    grid-template-columns: 1fr;
  }

  .selector-card__facts div {
    min-height: 0;
  }
}

/* Effective mobile remediation for Lombard Street and NBS.
   This final layer overrides the older overlapping breakpoint blocks above. */
body.workspace-page main > section,
body.workspace-page .savoy-carousel,
body.workspace-page .workspace-footer,
body.lombard-page main > section,
body.lombard-page .savoy-carousel,
body.lombard-page .contact-footer {
  scroll-margin-top: 96px;
}

.lombard-contact-popup__close {
  min-width: 44px;
  min-height: 44px;
  padding: 10px 13px;
}

.lombard-contact-popup__actions a {
  min-height: 44px;
}

@media (max-width: 860px) {
  body.workspace-page main > section,
  body.workspace-page .savoy-carousel,
  body.workspace-page .workspace-footer,
  body.lombard-page main > section,
  body.lombard-page .savoy-carousel,
  body.lombard-page .contact-footer {
    scroll-margin-top: 132px;
  }

  body.workspace-page .site-top,
  body.lombard-page .site-top {
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 10px 12px;
    padding: 10px 16px 12px;
  }

  body.workspace-page .site-top nav,
  body.lombard-page .site-top nav {
    grid-column: 1 / -1;
    display: flex;
    flex-wrap: nowrap;
    justify-content: flex-start;
    gap: 8px;
    width: 100%;
    overflow-x: auto;
    padding: 0 0 4px;
    scroll-padding-inline: 16px;
    scrollbar-width: none;
  }

  body.workspace-page .site-top nav::-webkit-scrollbar,
  body.lombard-page .site-top nav::-webkit-scrollbar {
    display: none;
  }

  body.workspace-page .site-top nav a,
  body.workspace-page .top-cta,
  body.lombard-page .site-top nav a,
  body.lombard-page .top-cta {
    min-height: 44px;
    align-items: center;
    justify-content: center;
    padding: 11px 13px;
    font-size: 0.72rem;
    line-height: 1.1;
    white-space: nowrap;
  }

  body.workspace-page .site-top nav a,
  body.lombard-page .site-top nav a {
    flex: 0 0 auto;
  }
}

@media (max-width: 720px) {
  body.workspace-page .availability-board,
  body.workspace-page .workspace-service-suite .rows,
  body.workspace-page .workspace-media-wall,
  body.workspace-page .transport-grid,
  body.workspace-page .workspace-arrival-images,
  body.workspace-page .floor-plan-pair,
  body.workspace-page .workspace-suite-copy,
  body.workspace-page .occupier-section dl,
  body.workspace-page .workspace-arrival-duo {
    display: grid;
    grid-auto-flow: row;
    grid-auto-columns: initial;
    grid-template-columns: 1fr;
    overflow-x: visible;
    overscroll-behavior-inline: auto;
    scroll-snap-type: none;
  }

  body.workspace-page .availability-board,
  body.workspace-page .workspace-service-suite .rows,
  body.workspace-page .transport-grid,
  body.workspace-page .occupier-section dl {
    gap: 10px;
    padding-bottom: 0;
    background: transparent;
  }

  body.workspace-page .availability-board {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 1px;
    padding: 1px;
  }

  body.workspace-page .availability-board div,
  body.workspace-page .availability-board div:first-child,
  body.workspace-page .availability-board div:nth-child(odd),
  body.workspace-page .workspace-service-suite .rows p,
  body.workspace-page .occupier-section dl > div,
  body.workspace-page .transport-card {
    min-height: 0;
    border: 1px solid rgba(37, 42, 27, 0.14);
    border-radius: 8px;
    scroll-snap-align: none;
  }

  body.workspace-page .availability-board div,
  body.workspace-page .availability-board div:first-child,
  body.workspace-page .availability-board div:nth-child(odd) {
    min-height: 126px;
    padding: 15px 12px 14px;
    background: rgba(255, 250, 240, 0.94);
    color: var(--workspace-green);
  }

  body.workspace-page .availability-board div:first-child {
    background: #1a2d29;
    color: var(--workspace-ivory);
  }

  body.workspace-page .availability-board div::before {
    top: 12px;
    right: 12px;
    width: 28px;
    height: 28px;
    font-size: 0.68rem;
  }

  body.workspace-page .availability-board span,
  body.workspace-page .availability-board small {
    color: #5f6d64;
    font-size: 0.67rem;
    line-height: 1.25;
  }

  body.workspace-page .availability-board div:first-child span,
  body.workspace-page .availability-board div:first-child small {
    color: rgba(255, 250, 240, 0.66);
  }

  body.workspace-page .availability-board strong {
    max-width: none;
    margin: 28px 0 8px;
    color: var(--workspace-green);
    font-size: clamp(1.18rem, 5.8vw, 1.55rem);
    line-height: 1;
    overflow-wrap: anywhere;
  }

  body.workspace-page .availability-board div:first-child strong {
    color: var(--workspace-ivory);
  }

  body.workspace-page .workspace-media-wall,
  body.workspace-page .floor-plan-pair,
  body.workspace-page .workspace-suite-copy,
  body.workspace-page .workspace-arrival-duo {
    gap: 14px;
    padding-bottom: 0;
  }

  body.workspace-page .workspace-arrival-images {
    display: grid;
    grid-auto-flow: column;
    grid-auto-columns: minmax(245px, 82vw);
    grid-template-columns: none;
    gap: 12px;
    width: calc(100% + 18px);
    margin-top: 2px;
    margin-right: -18px;
    overflow-x: auto;
    overscroll-behavior-inline: contain;
    padding: 0 18px 6px 0;
    scroll-padding-inline: 0 18px;
    scroll-snap-type: inline mandatory;
    scrollbar-width: none;
  }

  body.workspace-page .workspace-arrival-images::-webkit-scrollbar {
    display: none;
  }

  body.workspace-page .workspace-arrival-editorial {
    grid-template-columns: minmax(0, 1fr);
    overflow-x: clip;
  }

  body.workspace-page .workspace-arrival-editorial > * {
    min-width: 0;
    max-width: 100%;
  }

  body.workspace-page .workspace-arrival-heading h2 {
    overflow-wrap: anywhere;
  }

  body.workspace-page .workspace-media-wall figure:nth-child(n),
  body.workspace-page .workspace-arrival-images figure,
  body.workspace-page .floor-plan-pair .floor-plan-figure,
  body.workspace-page .workspace-suite-copy article,
  body.workspace-page .workspace-arrival-duo img {
    min-height: 0;
    scroll-snap-align: none;
  }

  body.workspace-page .workspace-arrival-images figure {
    border-radius: 8px;
    scroll-snap-align: start;
  }

  body.workspace-page .workspace-arrival-duo img,
  body.workspace-page .workspace-arrival-duo img:nth-child(2) {
    height: auto;
    max-height: none;
    aspect-ratio: 4 / 3;
    object-fit: cover;
  }

  body.workspace-page .workspace-arrival-images img {
    height: auto;
    max-height: none;
    aspect-ratio: 4 / 3;
    object-fit: cover;
  }

  body.workspace-page .workspace-arrival-mobile-cta {
    display: inline-flex;
    min-height: 46px;
    align-items: center;
    justify-content: center;
    justify-self: start;
    margin-top: 2px;
    padding: 13px 18px;
    border: 1px solid rgba(26, 45, 41, 0.26);
    border-radius: 999px;
    background: #1a2d29;
    color: var(--workspace-ivory);
    font-size: 0.76rem;
    font-weight: 900;
    letter-spacing: 0;
    line-height: 1.1;
    text-decoration: none;
    text-transform: uppercase;
  }

  body.workspace-page .workspace-media-wall figure img,
  body.workspace-page .workspace-media-wall figure:nth-child(n) img {
    height: auto;
    aspect-ratio: 4 / 3;
  }

  body.workspace-page .workspace-suite-copy article {
    padding: 20px 0 0;
    border: 0;
    border-top: 1px solid rgba(255, 250, 240, 0.18);
    border-radius: 0;
    background: transparent;
  }

  body.workspace-page .plan-benefits {
    display: grid;
    grid-template-columns: 1fr;
    overflow-x: visible;
    padding-bottom: 0;
  }

  /* NBS-only (2026-07-07 audit fix): the shared rule above stacks each pill as
     a full-width grey bar. Override (extra .nbs-page class wins on specificity
     regardless of source order) to a compact inline-wrap pill row instead -
     workspace.html keeps the stacked-bar rule untouched. */
  body.workspace-page.nbs-page .plan-benefits {
    display: flex;
    flex-wrap: wrap;
    overflow-x: visible;
    padding-bottom: 0;
  }

  body.workspace-page.nbs-page .plan-benefits span {
    flex: 0 1 auto;
    min-height: 30px;
    padding: 6px 10px;
    font-size: 11px;
  }

  body.lombard-page .lombard-spec-grid,
  body.lombard-page .lombard-floor__spec,
  body.lombard-page .lombard-floor__tags,
  body.lombard-page .roll-grid,
  body.lombard-page .site-map-points {
    display: grid;
    grid-auto-flow: row;
    grid-auto-columns: initial;
    grid-template-columns: 1fr;
    overflow-x: visible;
    overscroll-behavior-inline: auto;
    scroll-snap-type: none;
  }

  body.lombard-page .lombard-spec-grid,
  body.lombard-page .lombard-floor__spec,
  body.lombard-page .roll-grid,
  body.lombard-page .site-map-points {
    gap: 10px;
    padding-bottom: 0;
    background: transparent;
  }

  body.lombard-page .lombard-spec-grid li,
  body.lombard-page .lombard-floor__spec li,
  body.lombard-page .roll-grid article,
  body.lombard-page .site-map-points span {
    min-height: 0;
    scroll-snap-align: none;
  }

  body.lombard-page .lombard-spec-grid {
    grid-template-columns: 1fr;
  }

  body.lombard-page .lombard-spec-grid li {
    grid-template-columns: 42px minmax(0, 1fr);
    padding: 14px;
  }

  body.lombard-page .lombard-floor__tags {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
  }

  body.lombard-page .lombard-floor__tags span {
    width: auto;
    min-height: 38px;
    white-space: normal;
  }

  body.lombard-page .lombard-cta,
  body.lombard-page .savoy-carousel__control {
    min-height: 44px;
  }
}

@media (max-width: 560px) {
  body.workspace-page .workspace-hero-ledger {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  body.workspace-page .workspace-hero-ledger div {
    min-height: 0;
    padding: 12px;
  }

  body.workspace-page .workspace-hero-ledger dt {
    margin-bottom: 9px;
    font-size: 0.62rem;
    line-height: 1.1;
  }

  body.workspace-page .workspace-hero-ledger dd {
    font-size: clamp(1rem, 4.4vw, 1.24rem);
    line-height: 1.05;
    overflow-wrap: anywhere;
  }
}

@media (max-width: 720px) {
  body.lombard-page.lombard-v2 .lombard-floors {
    padding: 48px 18px 58px;
  }

  body.lombard-page.lombard-v2 .lombard-floors__intro {
    gap: 18px;
    margin-bottom: 44px;
  }

  body.lombard-page.lombard-v2 .lombard-floors__intro h2 {
    line-height: 0.98;
  }

  body.lombard-page.lombard-v2 .lombard-floors__intro p:not(.kicker) {
    max-width: 32rem;
    line-height: 1.62;
  }

  body.lombard-page.lombard-v2 .lombard-floors__intro-cta {
    margin-top: 8px;
  }

  body.lombard-page.lombard-v2 .lombard-floor {
    gap: 28px;
    padding: 38px 0 44px;
  }

  body.lombard-page.lombard-v2 .lombard-floor__eyebrow {
    margin-bottom: 17px;
  }

  body.lombard-page.lombard-v2 .lombard-floor__copy h3 {
    margin-bottom: 19px;
    line-height: 1.02;
  }

  body.lombard-page.lombard-v2 .lombard-floor__copy p:not(.lombard-floor__eyebrow) {
    margin-bottom: 30px;
    line-height: 1.64;
  }

  body.lombard-page.lombard-v2 .lombard-floor__spec {
    /* Two columns on mobile (see lombard-mobile-layout spec) - keep the card
       styling below, but don't collapse to a single column. */
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 10px;
    margin-bottom: 30px;
    padding: 0;
    border: 0;
    background: transparent;
  }

  body.lombard-page.lombard-v2 .lombard-floor__spec li {
    min-height: 46px;
    padding: 14px 16px;
    border: 1px solid rgba(42, 37, 33, 0.1);
    border-radius: 7px;
    background: color-mix(in srgb, var(--surface-strong) 84%, var(--surface));
    font-size: 0.72rem;
    line-height: 1.22;
  }

  body.lombard-page.lombard-v2 .lombard-floor__tags {
    gap: 10px;
  }

  body.lombard-page.lombard-v2 .lombard-floor__tags span {
    min-height: 40px;
    padding: 9px 12px;
    line-height: 1.2;
  }
}

@media (max-width: 560px) {
  body.lombard-page.lombard-v2 .lombard-floors {
    padding: 44px 16px 56px;
  }

  body.lombard-page.lombard-v2 .lombard-floor {
    padding: 36px 0 42px;
  }
}

/* NBS hero image as full-background treatment. */
body.workspace-page .workspace-hero {
  min-height: calc(100svh - 72px);
  align-content: end;
  padding: clamp(54px, 8vw, 108px) clamp(22px, 7vw, 108px);
}

body.workspace-page .workspace-hero::before {
  background:
    linear-gradient(90deg, rgba(8, 18, 16, 0.9) 0%, rgba(8, 18, 16, 0.72) 34%, rgba(8, 18, 16, 0.34) 68%, rgba(8, 18, 16, 0.16) 100%),
    linear-gradient(0deg, rgba(8, 18, 16, 0.88) 0%, rgba(8, 18, 16, 0.28) 46%, rgba(8, 18, 16, 0.18) 100%);
}

body.workspace-page .workspace-hero-media {
  position: absolute;
  inset: 0;
  z-index: 1;
  order: initial;
  height: auto;
  min-height: 0;
  margin: 0;
  border: 0;
  border-radius: 0;
  background: #091311;
  box-shadow: none;
}

body.workspace-page .workspace-hero-media::before {
  display: block;
  background:
    linear-gradient(90deg, rgba(8, 18, 16, 0.86) 0%, rgba(8, 18, 16, 0.48) 42%, rgba(8, 18, 16, 0) 78%),
    linear-gradient(0deg, rgba(8, 18, 16, 0.78) 0%, rgba(8, 18, 16, 0.18) 58%, rgba(8, 18, 16, 0.08) 100%);
}

body.workspace-page .workspace-hero-media img {
  height: 100%;
  opacity: 1;
  object-position: 66% center;
  transform: none;
}

body.workspace-page .workspace-hero-content {
  grid-template-columns: minmax(440px, 720px) minmax(280px, 470px);
  align-items: end;
  width: min(100%, 1500px);
}

body.workspace-page .workspace-hero h1 {
  max-width: 720px;
  font-size: clamp(4.8rem, 7vw, 7.5rem);
}

body.workspace-page .workspace-hero-copy > p:not(.kicker) {
  max-width: 650px;
}

body.workspace-page .workspace-hero-ledger {
  align-self: end;
  background: rgba(255, 250, 240, 0.2);
}

body.workspace-page .workspace-hero-ledger div {
  background: rgba(8, 18, 16, 0.54);
}

@media (max-width: 980px) {
  body.workspace-page .workspace-hero {
    min-height: calc(100svh - 132px);
    padding: clamp(42px, 8vw, 76px) clamp(18px, 6vw, 52px);
  }

  body.workspace-page .workspace-hero-content {
    grid-template-columns: 1fr;
    align-content: end;
  }

  body.workspace-page .workspace-hero h1 {
    font-size: clamp(3.35rem, 10vw, 5.6rem);
  }
}

@media (max-width: 720px) {
  body.workspace-page .global-email-cta {
    display: none;
  }

  body.workspace-page .workspace-hero {
    min-height: calc(100svh - 132px);
    padding: 36px 18px 28px;
  }

  body.workspace-page .workspace-hero::before {
    background:
      linear-gradient(0deg, rgba(8, 18, 16, 0.94) 0%, rgba(8, 18, 16, 0.8) 46%, rgba(8, 18, 16, 0.26) 100%),
      linear-gradient(90deg, rgba(8, 18, 16, 0.82), rgba(8, 18, 16, 0.24));
  }

  body.workspace-page .workspace-hero-media {
    position: absolute;
    inset: 0;
    height: auto;
    margin: 0;
    border: 0;
    border-radius: 0;
  }

  body.workspace-page .workspace-hero-media img {
    height: 100%;
    object-position: 58% center;
    transform: none;
  }

  body.workspace-page .workspace-hero h1 {
    font-size: clamp(3rem, 13.5vw, 4.8rem);
  }

body.workspace-page .workspace-hero-ledger {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}
}

/* NBS palette and finish pass. */
body.workspace-page {
  --paper: #e3e0cc;
  --ink: #252a1b;
  --muted: #686957;
  --line: rgba(37, 42, 27, 0.16);
  --white: #f4f0df;
  --accent: #252a1b;
  --gold: #a88f5e;
  --workspace-green: #252a1b;
  --workspace-mist: #d7d6c5;
  --workspace-ivory: #f4f0df;
  --workspace-clay: #384432;
  --workspace-obsidian: #151a13;
  --surface: #d7d6c5;
  --surface-strong: #ece8d8;
  --surface-muted: #d7d6c5;
  background:
    linear-gradient(180deg, var(--paper) 0%, var(--surface) 46%, var(--surface-strong) 100%);
  color: var(--ink);
  font-family: var(--brand-font);
}

body.workspace-page section[id],
body.workspace-page footer[id] {
  scroll-margin-top: 96px;
}

body.workspace-page .site-top {
  border-bottom-color: var(--line);
  background: color-mix(in srgb, var(--paper) 91%, var(--surface-strong));
  color: var(--ink);
}

body.workspace-page .wordmark span {
  border-color: color-mix(in srgb, var(--workspace-ivory) 70%, transparent);
  background: var(--ink);
  color: var(--workspace-ivory);
}

body.workspace-page .top-cta,
body.workspace-page .global-email-cta {
  border-color: var(--accent);
  background: var(--accent);
  color: var(--white);
}

body.workspace-page .top-cta:hover,
body.workspace-page .top-cta:focus-visible,
body.workspace-page .global-email-cta:hover,
body.workspace-page .global-email-cta:focus-visible {
  background: var(--ink);
  color: var(--white);
}

body.workspace-page .workspace-hero {
  background: var(--workspace-obsidian);
  color: var(--workspace-ivory);
}

body.workspace-page .workspace-hero::before {
  background:
    linear-gradient(90deg, rgba(21, 26, 19, 0.92) 0%, rgba(37, 42, 27, 0.72) 36%, rgba(56, 68, 50, 0.24) 58%, rgba(56, 68, 50, 0) 76%),
    linear-gradient(0deg, rgba(21, 26, 19, 0.48) 0%, rgba(21, 26, 19, 0.12) 40%, rgba(21, 26, 19, 0) 100%);
}

body.workspace-page .workspace-hero-media,
body.workspace-page .suite-image,
body.workspace-page .workspace-media-wall figure {
  background: var(--workspace-obsidian);
}

body.workspace-page .workspace-hero-media::before {
  display: none;
}

body.workspace-page .workspace-hero-media img {
  filter: saturate(1.02) contrast(1.04) brightness(1.06);
}

/* 2026-07-28: the shared hero forces min-height: calc(100svh - 72px), filling
   the viewport right down to the header and pushing the availability stats
   fully below the fold at 1440x900. The ledger panel and the longer copy that
   used to justify a full-viewport hero are already gone here, so let the
   hero size to its own content instead and reclaim that empty space. Scoped
   to min-width so the ≤980px and ≤720px hero rules below (tablet stack,
   mobile photo-over-card layout) are untouched. */
@media (min-width: 981px) {
  /* 2026-07-28 follow-up: pure content height cropped the facade photo too
     tightly (the cover crop lost the top of the building). User then sized it
     up twice (+20% each time): the availability cards are MEANT to sit
     slightly cut off at the fold to invite scrolling. Still capped to the
     viewport minus the header so short screens never scroll inside the hero. */
  body.workspace-page.nbs-page .workspace-hero {
    min-height: min(830px, calc(100svh - 72px));
    padding: clamp(36px, 4.5vw, 60px) clamp(22px, 7vw, 108px);
  }

  /* Address-led headline (2026-07-28) runs two full sentences, so it needs a
     smaller size than the old three-word hero line to hold two lines. */
  body.workspace-page.nbs-page .workspace-hero h1 {
    margin-bottom: 18px;
    max-width: 900px;
    font-size: clamp(3.2rem, 4.7vw, 4.75rem);
  }

  body.workspace-page.nbs-page .nbs-h1-line {
    display: block;
  }

  /* 2026-07-28: the wide hero band crops the 3:2 photo vertically; centred,
     that clipped the ornate gable at the top of the building. Bias the crop
     window upward so the roofline always stays in frame (the loss moves to
     street level, which was already cut). Desktop only — mobile keeps its
     own object-position. */
  body.workspace-page.nbs-page .workspace-hero-media img {
    object-position: 50% 30%;
  }

  body.workspace-page.nbs-page .workspace-hero-actions {
    margin-top: 22px;
  }
}

/* NBS-only (2026-07-07 Tara feedback): facade photo replaces the exterior shot, the
   scrim is lightened so the building reads clearly, and the hero ledger is gone (markup
   removed) so no hide rule is needed. Scoped to .nbs-page - workspace.html keeps the
   older exterior photo + heavier scrim untouched. */
/* 2026-07-08 round: crop shifted right (was 63% - the client wants the image
   itself sitting further right in frame) and the scrim now lives on the photo
   only. The hero-wide ::before (which also tinted the solid green copy panel)
   is gone; the gradient sits on .workspace-hero-media::before instead, fading
   out from the panel colour so the panel/photo seam stays soft. */
body.workspace-page.nbs-page .workspace-hero-media img {
  object-position: 50% center;
}

body.workspace-page.nbs-page .workspace-hero::before {
  background: none;
}

/* Deepened 2026-07-28: the previous stops faded to near-nothing by 52-68%,
   which left the far ends of the subhead's lines sitting almost directly on
   the sunlit facade with no scrim under them. Darker, longer-reaching stops
   keep the copy column legible while still clearing by ~80%, so the right
   side of the photo stays largely uncovered. */
body.workspace-page.nbs-page .workspace-hero-media::before {
  display: block;
  /* 2026-07-28: the shared ::before rule (~6406) draws a 1px hairline border,
     which framed the scrim 1px inside the photo and read as a stray outline
     around the hero. Zero it so the gradient runs edge to edge. */
  border: 0;
  inset: 0;
  background:
    linear-gradient(90deg, rgba(18, 17, 12, 0.95) 0%, rgba(18, 17, 12, 0.82) 30%, rgba(18, 17, 12, 0.5) 50%, rgba(18, 17, 12, 0.15) 68%, rgba(18, 17, 12, 0) 82%),
    linear-gradient(0deg, rgba(21, 26, 19, 0.48) 0%, rgba(21, 26, 19, 0.12) 38%, rgba(21, 26, 19, 0) 100%);
}

body.workspace-page.nbs-page .workspace-hero-content {
  grid-template-columns: minmax(0, 720px);
}

body.workspace-page.nbs-page .workspace-hero-copy {
  position: relative;
  z-index: 2;
}

/* (2026-07-08: the radial wash that sat behind the text container is gone -
   client asked for the gradient to live on the photo, never the copy block.
   Legibility over the image edge comes from the media::before scrim above
   plus the text-shadow rule below.) */

/* Kicker pill: short mobile copy is hidden by default, swapped in at
   ≤720px (see the .nbs-kicker-full / .nbs-kicker-short rules below). */
body.workspace-page.nbs-page .nbs-kicker-short {
  display: none;
}

/* The hero figcaption rendered as an unwanted grey box over the photo -
   visually hide it (screen readers still get it) rather than removing it. */
body.workspace-page.nbs-page .workspace-hero-media figcaption {
  position: absolute;
  width: 1px;
  height: 1px;
  margin: -1px;
  padding: 0;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
  background: none;
}

body.workspace-page.nbs-page .workspace-hero .kicker,
body.workspace-page.nbs-page .workspace-hero h1,
body.workspace-page.nbs-page .workspace-hero-copy > p:not(.kicker) {
  text-shadow: 0 2px 20px rgba(8, 12, 8, 0.5);
}

body.workspace-page .workspace-hero .kicker,
body.workspace-page .workspace-footer .kicker,
body.workspace-page .workspace-service-suite .kicker,
body.workspace-page .workspace-suite-copy .kicker,
body.workspace-page .site-map-kicker {
  color: var(--gold);
}

body.workspace-page .workspace-hero-media figcaption,
body.workspace-page .suite-image-main figcaption,
body.workspace-page .workspace-media-wall figcaption {
  border: 1px solid rgba(251, 242, 226, 0.18);
  background: rgba(21, 26, 19, 0.76);
  color: var(--workspace-ivory);
}

body.workspace-page .workspace-hero-media figcaption {
  right: auto;
  left: clamp(22px, 4vw, 64px);
}

body.workspace-page .workspace-hero-actions .primary-action {
  border-color: var(--workspace-ivory);
  background: var(--workspace-ivory);
  color: var(--ink);
}

body.workspace-page .workspace-hero-actions .secondary-action {
  border-color: rgba(251, 242, 226, 0.72);
  background: rgba(251, 242, 226, 0.08);
  color: var(--workspace-ivory);
}

body.workspace-page .workspace-hero-ledger {
  border-color: rgba(251, 242, 226, 0.2);
  background: rgba(251, 242, 226, 0.2);
}

body.workspace-page .workspace-hero-ledger div {
  background: rgba(21, 26, 19, 0.58);
}

body.workspace-page .availability-board {
  background:
    linear-gradient(90deg, rgba(37, 42, 27, 0.16), transparent 42%),
    var(--workspace-green);
}

body.workspace-page .availability-board div,
body.workspace-page .availability-board div:nth-child(odd) {
  background: rgba(255, 248, 236, 0.92);
  color: var(--ink);
}

body.workspace-page .availability-board div:first-child {
  background: var(--workspace-green);
  color: var(--workspace-ivory);
}

body.workspace-page .availability-board div::before {
  border-color: rgba(37, 42, 27, 0.32);
  color: var(--accent);
}

body.workspace-page .availability-board div:first-child::before {
  border-color: rgba(251, 242, 226, 0.24);
  color: var(--gold);
}

body.workspace-page .availability-board strong,
body.workspace-page .workspace-program dd,
body.workspace-page .workspace-breathing-points strong {
  color: var(--workspace-green);
}

body.workspace-page .availability-board div:first-child strong {
  color: var(--workspace-ivory);
}

body.workspace-page .workspace-arrival-editorial {
  background:
    linear-gradient(90deg, rgba(37, 42, 27, 0.08), transparent 44%),
    var(--surface);
  color: var(--ink);
}

body.workspace-page .workspace-arrival-heading h2 {
  color: var(--ink);
}

body.workspace-page .workspace-arrival-copy span {
  background: var(--accent);
}

body.workspace-page .workspace-arrival-copy p,
body.workspace-page .workspace-breathing-detail > p,
body.workspace-page .workspace-breathing-points span,
body.workspace-page .workspace-copy-panel p:not(.kicker),
body.workspace-page .occupier-section dd,
body.workspace-page .transport-card__station em,
body.workspace-page .workspace-connection-table em {
  color: var(--muted);
}

body.workspace-page .workspace-arrival-images {
  grid-template-columns: minmax(220px, 0.72fr) minmax(320px, 1.08fr) minmax(220px, 0.82fr);
}

body.workspace-page .workspace-breathing-room,
body.workspace-page .occupier-section {
  background:
    linear-gradient(90deg, rgba(37, 42, 27, 0.08), transparent 38%),
    var(--workspace-ivory);
}

body.workspace-page .workspace-breathing-copy h2 {
  color: var(--ink);
}

body.workspace-page .workspace-plan-suite {
  background:
    linear-gradient(90deg, rgba(32, 71, 61, 0.08), transparent 42%),
    var(--surface-strong);
}

body.workspace-page .workspace-copy-panel h2,
body.workspace-page .occupier-section h2,
body.workspace-page .workspace-connection-table .commute-heading h2 {
  color: var(--ink);
}

body.workspace-page .floor-plan-figure,
body.workspace-page .workspace-program div,
body.workspace-page .plan-benefits span,
body.workspace-page .transport-card {
  border-color: var(--line);
  background: color-mix(in srgb, var(--surface-strong) 78%, var(--surface));
  color: var(--ink);
}

/* NBS-only (2026-07-07 Tara feedback): #workspace-plan restructured into two
   floor panels (First / Sixth) behind a no-JS radio-driven tab control, each led by
   the client's plan board image. New nbs- prefixed classes only; workspace.html keeps
   the old floor-plan-pair CGI layout untouched. */
/* The plan panels are a grid item of the section's 1fr track; without this,
   its automatic minimum size is its min-content size, which the mobile
   carousel's fixed-width tracks (see .nbs-plan-gallery below) inflate to the
   full unrolled carousel width - bursting the section and the page out
   horizontally instead of scrolling inside .nbs-plan-gallery. */
body.workspace-page.nbs-page .nbs-plan-panels {
  min-width: 0;
}

/* 2026-07-08 declutter: calmer headline scale for this section (the shared
   clamp tops out at 6.3rem, which crowded the narrow copy column against the
   dense plan column), and the copy panel rides along on desktop instead of
   leaving a long dead gutter under itself. */
body.workspace-page.nbs-page .workspace-plan-suite {
  align-items: start;
}

body.workspace-page.nbs-page .workspace-plan-suite .workspace-copy-panel h2 {
  max-width: 520px;
  font-size: clamp(2.5rem, 3.9vw, 4.1rem);
  line-height: 1.02;
}

body.workspace-page.nbs-page .workspace-plan-suite .workspace-copy-panel p:not(.kicker) {
  max-width: 440px;
  font-size: 1.02rem;
}

/* Client 2026-07-09 round 4 "looks good across ALL screen sizes": the shared
   layout goes two-column at 981px, but between 981 and ~1180 the plan/gallery
   column was squeezed to ~520px - gallery tiles shrank to 164px stamps with
   oversized caption chips. Keep the suite single-column through that band
   (matching the good ≤980 layout) and only split once there is real room,
   with the copy panel taking a smaller share than the shared 0.5fr. */
@media (min-width: 981px) and (max-width: 1180px) {
  body.workspace-page.nbs-page .workspace-plan-suite {
    grid-template-columns: 1fr;
  }
}

@media (min-width: 1181px) {
  body.workspace-page.nbs-page .workspace-plan-suite {
    grid-template-columns: minmax(320px, 0.42fr) minmax(0, 1fr);
    gap: clamp(34px, 5vw, 84px);
  }

  body.workspace-page.nbs-page .workspace-plan-suite .workspace-copy-panel {
    position: sticky;
    top: 104px;
  }
}

/* Tara 2026-07-09 "too much empty white space on left under text" - the
   sticky copy panel above still left a dead gutter under the pills while
   the plan/gallery column scrolled past. Fill it with a compact recap card
   (availability figures, viewing CTA, contact line) instead of leaving it
   blank - no filler copy, real numbers already used elsewhere on the page. */
body.workspace-page.nbs-page .plan-copy-recap {
  display: grid;
  gap: 20px;
  margin-top: clamp(32px, 4vw, 48px);
  padding-top: clamp(24px, 3vw, 32px);
  border-top: 1px solid var(--line);
}

body.workspace-page.nbs-page .plan-copy-recap-stats {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 0 24px;
  margin: 0;
}

body.workspace-page.nbs-page .plan-copy-recap-stats dt {
  margin-bottom: 4px;
  color: var(--muted);
  font-size: 10.5px;
  font-weight: 800;
  letter-spacing: 0.05em;
  text-transform: uppercase;
}

body.workspace-page.nbs-page .plan-copy-recap-stats dd {
  margin: 0;
  color: var(--ink);
  font-size: 1.15rem;
  font-weight: 700;
}

body.workspace-page.nbs-page .plan-copy-cta {
  display: inline-flex;
  width: fit-content;
  align-items: center;
  justify-content: center;
  padding: 15px 28px;
  border: 1px solid var(--accent);
  border-radius: 0;
  color: var(--white);
  font-size: 13px;
  font-weight: 800;
  letter-spacing: 0.05em;
  text-transform: uppercase;
  text-decoration: none;
  transition: background 200ms ease, border-color 200ms ease;
}

/* Mobile owns conversion through the sticky bottom bar (same rationale as
   the hidden header CTA) - the in-plan button would be a duplicate. */
@media (max-width: 720px) {
  body.workspace-page.nbs-page .plan-copy-cta {
    display: none;
  }
}

body.workspace-page.nbs-page .plan-copy-recap-contact {
  margin: -8px 0 0;
  color: var(--muted);
  font-size: 0.85rem;
}

body.workspace-page.nbs-page .nbs-plan-tabs-label {
  position: absolute;
  width: 1px;
  height: 1px;
  margin: -1px;
  padding: 0;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}

body.workspace-page.nbs-page .nbs-plan-tab-input,
body.workspace-page.nbs-page .nbs-plan-view-input {
  position: absolute;
  width: 1px;
  height: 1px;
  margin: -1px;
  padding: 0;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}

/* Tara 2026-07-09: "this button needs to be more prominent" - the quiet
   pill toggle becomes a full-width square segmented control with a solid
   ink active cell (coral is CTA-only, see the selected-state rule below). */
body.workspace-page.nbs-page .nbs-plan-tab-list {
  display: flex;
  width: 100%;
  max-width: 620px;
  gap: 0;
  padding: 0;
  margin-bottom: clamp(24px, 3vw, 34px);
  border: 1px solid var(--ink);
  border-radius: 0;
  background: #ffffff;
}

body.workspace-page.nbs-page .nbs-plan-tab-btn {
  display: inline-flex;
  flex: 1 1 0;
  min-height: 58px;
  align-items: center;
  justify-content: center;
  padding: 0 24px;
  border-radius: 0;
  color: var(--ink);
  font-size: 15px;
  font-weight: 800;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  cursor: pointer;
  transition: background 200ms ease, color 200ms ease;
}

body.workspace-page.nbs-page .nbs-plan-tab-btn + .nbs-plan-tab-btn {
  border-left: 1px solid var(--ink);
}

body.workspace-page.nbs-page .nbs-plan-tab-input:focus-visible ~ .nbs-plan-tab-list {
  outline: 2px solid var(--ink);
  outline-offset: 3px;
}

body.workspace-page.nbs-page #nbs-plan-tab-first:checked ~ .nbs-plan-tab-list label[for="nbs-plan-tab-first"],
body.workspace-page.nbs-page #nbs-plan-tab-sixth:checked ~ .nbs-plan-tab-list label[for="nbs-plan-tab-sixth"] {
  /* Ink fill, not coral: coral is CTA-only, the active floor tab reads its
     "selected" state through weight/contrast instead. */
  background: var(--ink);
  color: #ffffff;
  font-weight: 900;
}

body.workspace-page.nbs-page .nbs-plan-panel {
  display: none;
}

body.workspace-page.nbs-page #nbs-plan-tab-first:checked ~ .nbs-plan-panel[data-floor="first"],
body.workspace-page.nbs-page #nbs-plan-tab-sixth:checked ~ .nbs-plan-panel[data-floor="sixth"] {
  display: block;
}

/* 2026-07-09 space efficiency: each floor panel stacked plan board + stats +
   a full photo grid (~3 screens per floor). A second CSS-only radio pair
   under the floor control flips ONE media slot between the plan board and a
   photo strip, so the whole section reads in about a screen. The pair is
   shared across both floors - flipping floors keeps the chosen view. Quieter
   than the coral floor control on purpose (ink active cell, smaller cells):
   floor choice is the primary decision, view is secondary. Same reveal-free
   rule as the floor panels: everything here is display:none while unselected. */
body.workspace-page.nbs-page .nbs-plan-view-list {
  display: inline-flex;
  margin: calc(-1 * clamp(8px, 1.2vw, 14px)) 0 clamp(18px, 2.4vw, 26px);
  border: 1px solid var(--ink);
  background: #ffffff;
}

body.workspace-page.nbs-page .nbs-plan-view-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 40px;
  padding: 0 22px;
  color: var(--ink);
  font-size: 11.5px;
  font-weight: 800;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  cursor: pointer;
  transition: background 200ms ease, color 200ms ease;
}

body.workspace-page.nbs-page .nbs-plan-view-btn + .nbs-plan-view-btn {
  border-left: 1px solid var(--ink);
}

body.workspace-page.nbs-page #nbs-plan-view-plan:checked ~ .nbs-plan-view-list label[for="nbs-plan-view-plan"],
body.workspace-page.nbs-page #nbs-plan-view-today:checked ~ .nbs-plan-view-list label[for="nbs-plan-view-today"] {
  background: var(--ink);
  color: #ffffff;
}

body.workspace-page.nbs-page .nbs-plan-view-input:focus-visible ~ .nbs-plan-view-list {
  outline: 2px solid var(--ink);
  outline-offset: 3px;
}

body.workspace-page.nbs-page .nbs-plan-view-panel {
  display: none;
  margin: 0 0 clamp(22px, 3vw, 30px);
}

body.workspace-page.nbs-page #nbs-plan-view-plan:checked ~ .nbs-plan-panel .nbs-plan-view-panel[data-view="plan"],
body.workspace-page.nbs-page #nbs-plan-view-today:checked ~ .nbs-plan-panel .nbs-plan-view-panel[data-view="today"] {
  display: block;
}

body.workspace-page.nbs-page .nbs-plan-board {
  margin: 0; /* the .nbs-plan-view-panel wrapper owns the gap to the stats */
  overflow: hidden;
  border: 1px solid var(--line);
  border-radius: 0;
  background: #ffffff;
  box-shadow: var(--shadow);
}

body.workspace-page.nbs-page .nbs-plan-board img {
  display: block;
  width: 100%;
  height: auto;
}

body.workspace-page.nbs-page .nbs-plan-board figcaption {
  padding: 12px 18px;
  border-top: 1px solid var(--line);
  background: var(--surface-strong);
  color: var(--muted);
  font-size: 12px;
  font-weight: 800;
  letter-spacing: 0.04em;
  text-transform: uppercase;
}

/* 2026-07-08 declutter: the stats moved from a boxed 2-col card grid to a
   bare 3-col hairline ledger (same treatment as the Lombard stations) - the
   right column was carrying too many framed blocks stacked on top of each
   other. Transparent rows mean the sixth floor's odd item count leaves no
   visible dead cell. */
body.workspace-page.nbs-page .nbs-plan-stats {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 0 clamp(20px, 2.4vw, 36px);
  margin: 0 0 clamp(26px, 3vw, 34px);
  border: 0;
  background: transparent;
}

body.workspace-page.nbs-page .nbs-plan-stats div {
  padding: 12px 0 14px;
  border-top: 1px solid var(--line);
  background: transparent;
}

body.workspace-page.nbs-page .nbs-plan-stats div:last-child:nth-child(odd) {
  grid-column: auto;
}

@media (max-width: 720px) {
  body.workspace-page.nbs-page .nbs-plan-stats {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0 20px;
  }
}

body.workspace-page.nbs-page .nbs-plan-stats dt {
  margin-bottom: 4px;
  color: var(--muted);
  font-size: 10.5px;
  font-weight: 800;
  letter-spacing: 0.05em;
  text-transform: uppercase;
}

body.workspace-page.nbs-page .nbs-plan-stats dd {
  margin: 0;
  color: var(--ink);
  font-size: 15px;
  font-weight: 700;
}

/* 2026-07-09 space efficiency: the gallery lives behind the Photos view now,
   sharing the plan board's media slot, so the old feature + 3-up grid (a full
   extra screen) becomes a horizontal scroll-snap strip at EVERY viewport -
   one card nearly fills the slot with the next card's edge peeking in to
   invite the swipe. Fixed, non-shrinkable auto-columns are required so the
   row actually overflows and scrolls (a minmax track would split the width
   evenly instead - see the note that used to live in the ≤720px block). */
body.workspace-page.nbs-page .nbs-plan-gallery {
  display: grid;
  grid-auto-flow: column;
  grid-auto-columns: min(78%, 640px);
  gap: clamp(10px, 1.4vw, 16px);
  overflow-x: auto;
  overscroll-behavior-inline: contain;
  scroll-snap-type: x mandatory;
  scrollbar-width: thin;
  padding-bottom: 8px;
  -webkit-overflow-scrolling: touch;
}

body.workspace-page.nbs-page .nbs-plan-gallery::-webkit-scrollbar {
  height: 3px;
}

body.workspace-page.nbs-page .nbs-plan-gallery::-webkit-scrollbar-thumb {
  background: var(--line);
  border-radius: 999px;
}

body.workspace-page.nbs-page .nbs-plan-gallery .floor-plan-figure {
  width: 100%;
  margin: 0;
  aspect-ratio: 3 / 2;
  scroll-snap-align: start;
}

body.workspace-page.nbs-page .nbs-plan-gallery .floor-plan-figure img {
  /* A percentage height doesn't reliably resolve against a parent sized only
     via aspect-ratio (no explicit height) - Chromium was falling back to the
     img's own intrinsic aspect ratio instead, doubling its rendered height
     and defeating object-position entirely (verified via computed style: an
     img inside a 4:3 figure was rendering at its native 1400x2100 ratio).
     position:absolute + inset:0 against the figure's own position:relative
     sizes it unambiguously. */
  position: absolute;
  inset: 0;
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

/* The entrance-door shot is a 1400x2100 portrait dropped into a 4:3 landscape
   tile - a centred crop lands mid-facade. Bias toward the bottom so the
   arched doorway itself reads instead of the pediment above it. */
body.workspace-page.nbs-page .nbs-plan-gallery .floor-plan-figure img[src*="nbs-entrance-door"] {
  object-position: 50% 88%;
}

/* Portrait Cat A photo whose centre band is nearly all ceiling grid - bias the
   4:3 crop down so the room itself (walls + carpet) reads in the tile. */
body.workspace-page.nbs-page .nbs-plan-gallery .floor-plan-figure img[src*="nbs-first-open-plan"] {
  object-position: 50% 68%;
}

/* White square caption chips (2026-07-09 - the shared dark glass pill is
   off-palette now). */
body.workspace-page.nbs-page .nbs-plan-gallery .floor-plan-figure figcaption {
  padding: clamp(5px, 0.55vw, 8px) clamp(8px, 0.8vw, 12px);
  border: 1px solid var(--line);
  border-radius: 0;
  background: rgba(255, 255, 255, 0.92);
  color: var(--ink);
  backdrop-filter: none;
  font-size: clamp(0.56rem, 0.5vw + 0.28rem, 0.66rem);
}

@media (max-width: 720px) {
  body.workspace-page.nbs-page .nbs-plan-tab-list {
    display: flex;
    width: 100%;
  }

  body.workspace-page.nbs-page .nbs-plan-tab-btn {
    flex: 1;
    min-height: 52px;
    padding: 0 12px;
    font-size: 13px;
  }

  /* The strip is the base .nbs-plan-gallery layout at every viewport now;
     mobile only widens the card so one photo owns the frame. */
  body.workspace-page.nbs-page .nbs-plan-gallery {
    grid-auto-columns: 85%;
    gap: 12px;
  }

  body.workspace-page.nbs-page .nbs-plan-view-btn {
    flex: 1;
    min-height: 44px;
    padding: 0 12px;
  }

  body.workspace-page.nbs-page .nbs-plan-view-list {
    display: flex;
    width: 100%;
  }
}

body.workspace-page .workspace-scroll-suite {
  background:
    linear-gradient(90deg, rgba(56, 68, 50, 0.18), transparent 45%),
    var(--workspace-green);
  color: var(--workspace-ivory);
}

body.workspace-page .suite-image-inset {
  border-color: var(--workspace-green);
}

body.workspace-page .workspace-service-suite {
  background:
    linear-gradient(90deg, rgba(56, 68, 50, 0.26), transparent 44%),
    var(--workspace-obsidian);
  color: var(--workspace-ivory);
}

body.workspace-page .workspace-service-suite .rows p::before {
  border-color: rgba(174, 128, 81, 0.44);
  color: var(--gold);
}

body.workspace-page .workspace-media-wall {
  background:
    linear-gradient(90deg, rgba(37, 42, 27, 0.08), transparent 42%),
    var(--paper);
}

body.workspace-page .workspace-connection-table {
  background:
    linear-gradient(90deg, rgba(32, 71, 61, 0.1), transparent 42%),
    var(--surface-muted);
}

body.workspace-page .transport-card p span {
  border-color: var(--line);
  background: rgba(255, 248, 236, 0.54);
  color: var(--ink);
}

body.workspace-page .site-map-section {
  --map-ink: var(--workspace-obsidian);
  --map-paper: var(--surface);
  --map-ivory: var(--workspace-ivory);
  --map-muted: rgba(251, 242, 226, 0.7);
  --map-gold: var(--gold);
  --map-oxide: var(--accent);
  background:
    linear-gradient(90deg, rgba(56, 68, 50, 0.24), transparent 48%),
    var(--workspace-obsidian);
  color: var(--workspace-ivory);
}

body.workspace-page .site-map-wrap {
  border-color: rgba(251, 242, 226, 0.18);
  background: var(--surface-muted);
}

/* NBS-only (2026-07-07 Tara feedback): the commute-table and site-map-section were
   merged into one section (.nbs-location-map, reusing .workspace-connection-table for
   its cream panel + transport-card styling) with the client's illustrated static map
   replacing the interactive Leaflet embed, plus two editorial numbered landmark lists.
   workspace.html is untouched - it still renders the old two-section Leaflet layout. */
/* NBS-only (2026-07-07 audit fix): relaid out as a single composed brochure
   spread instead of a lone floating map beside a taller card column (which
   left a large dead cream gap under the map). The annotated aerial photo
   leads full-width - its label text needs the room to stay legible - with
   the illustrated map and transport cards forming a second, denser row
   underneath so nothing is left half-empty. */
body.workspace-page.nbs-page .nbs-location-map-body {
  display: flex;
  flex-direction: column;
  gap: clamp(24px, 4vw, 40px);
  padding: 0;
  border-top: 0;
}

/* Client 2026-07-09 round 3: the two stacked maps became a tabbed viewer
   (same CSS-only radio mechanics as the floor-plan tabs, reusing the coral
   .nbs-plan-tab-list segmented control) so both assets can be selected and
   each gets the full spread to itself. This supersedes the earlier "make
   maps smaller" 640px cap - one big map at a time replaces two small ones.
   The illustrated neighbourhood map pairs with its numbered legend in a
   3/4 map + 1/4 legend split from desktop up; the aerial runs full width. */
body.workspace-page.nbs-page .nbs-map-panel {
  display: none;
}

body.workspace-page.nbs-page #nbs-map-tab-street:checked ~ .nbs-map-panel[data-map="street"],
body.workspace-page.nbs-page #nbs-map-tab-aerial:checked ~ .nbs-map-panel[data-map="aerial"] {
  display: block;
}

body.workspace-page.nbs-page #nbs-map-tab-street:checked ~ .nbs-plan-tab-list label[for="nbs-map-tab-street"],
body.workspace-page.nbs-page #nbs-map-tab-aerial:checked ~ .nbs-plan-tab-list label[for="nbs-map-tab-aerial"] {
  background: var(--accent);
  color: #ffffff;
}

/* Round 4: quieter tab control than the floor-plan one - the maps are a
   secondary selector, not the section's hero moment. The extra class on
   the button selector out-ranks both the base and ≤720 shared rules. */
body.workspace-page.nbs-page .nbs-map-tab-list {
  max-width: 440px;
  margin-bottom: clamp(20px, 2.5vw, 30px);
}

body.workspace-page.nbs-page .nbs-map-tab-list .nbs-plan-tab-btn {
  min-height: 42px;
  padding: 0 16px;
  font-size: 12.5px;
}

body.workspace-page.nbs-page .nbs-map-spread {
  display: grid;
  grid-template-columns: 1fr;
  gap: clamp(28px, 4vw, 48px);
  align-items: start;
}

@media (min-width: 981px) {
  body.workspace-page.nbs-page .nbs-map-spread {
    grid-template-columns: minmax(0, 3fr) minmax(0, 1fr);
    gap: clamp(40px, 4.5vw, 72px);
  }
}

body.workspace-page.nbs-page .nbs-location-map-figure {
  width: 100%;
  margin: 0; /* the UA's default figure margin otherwise pushes it off-grid */
  overflow: hidden;
  border: 1px solid var(--line);
  border-radius: 4px;
  background: var(--surface-strong);
  box-shadow: var(--shadow);
}

body.workspace-page.nbs-page .nbs-location-map-figure img {
  display: block;
  width: 100%;
  height: auto;
}

body.workspace-page.nbs-page .nbs-location-map-figure figcaption {
  padding: 10px 16px;
  border-top: 1px solid var(--line);
  color: var(--muted);
  font-size: 11px;
  font-weight: 800;
  letter-spacing: 0.06em;
  text-transform: uppercase;
}

body.workspace-page.nbs-page .nbs-location-map-figure--aerial img {
  aspect-ratio: 1400 / 788;
  object-fit: cover;
}

body.workspace-page.nbs-page .nbs-location-map-body .transport-grid {
  gap: 12px;
}

/* Legend sidebar (client 2026-07-09 round 3): the numbered Restaurants /
   Cafes lists moved from a standalone block under the section into the 1/4
   column NEXT to the illustrated map they index. Stacked single-file in the
   sidebar; side by side when the spread collapses under the map. */
body.workspace-page.nbs-page .nbs-map-legend {
  display: grid;
  grid-template-columns: 1fr;
  gap: clamp(20px, 3vw, 30px);
  align-content: start;
}

/* Legend sub-tabs (user 2026-07-09: "this is taking up too much vertical
   space on mobile"): ≤980px the legend stacks under the map, so only the
   selected list renders - the Restaurants/Cafés radio tabs pick it. From
   981px up the sidebar has room for both lists and the tab strip hides.
   Sized a step below the map tabs (38px vs 42px) - it's a sub-control. */
body.workspace-page.nbs-page .nbs-legend-tab-list {
  max-width: 320px;
  margin-bottom: 4px;
}

body.workspace-page.nbs-page .nbs-legend-tab-list .nbs-plan-tab-btn {
  min-height: 38px;
  padding: 0 14px;
  font-size: 11.5px;
}

body.workspace-page.nbs-page #nbs-legend-tab-restaurants:checked ~ .nbs-legend-tab-list label[for="nbs-legend-tab-restaurants"],
body.workspace-page.nbs-page #nbs-legend-tab-cafes:checked ~ .nbs-legend-tab-list label[for="nbs-legend-tab-cafes"] {
  background: var(--accent);
  color: #ffffff;
}

@media (max-width: 980px) {
  body.workspace-page.nbs-page #nbs-legend-tab-restaurants:checked ~ .nbs-landmark-col--cafes,
  body.workspace-page.nbs-page #nbs-legend-tab-cafes:checked ~ .nbs-landmark-col--restaurants {
    display: none;
  }

  /* The selected list's own heading repeats the active tab - drop it. */
  body.workspace-page.nbs-page .nbs-landmark-col h3 {
    position: absolute;
    width: 1px;
    height: 1px;
    margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
    border: 0;
  }
}

@media (min-width: 981px) {
  body.workspace-page.nbs-page .nbs-legend-tab-list {
    display: none;
  }
}

body.workspace-page.nbs-page .nbs-landmark-col h3 {
  margin: 0 0 10px;
  padding-bottom: 8px;
  border-bottom: 1px solid var(--line);
  color: var(--ink);
  font-size: 16px;
  font-weight: 800;
  letter-spacing: 0.06em;
  text-transform: uppercase;
}

body.workspace-page.nbs-page .nbs-landmark-col ol {
  display: grid;
  gap: 1px;
  margin: 0;
  padding: 0;
  list-style: none;
  background: var(--line);
}

body.workspace-page.nbs-page .nbs-landmark-col li {
  display: flex;
  align-items: baseline;
  gap: 14px;
  padding: 10px 6px;
  background: color-mix(in srgb, var(--surface-strong) 82%, white);
  color: var(--ink);
  font-size: 0.95rem;
}

body.workspace-page.nbs-page .nbs-landmark-col li span {
  min-width: 24px;
  color: var(--muted);
  font-family: Georgia, "Times New Roman", serif;
  font-size: 0.8rem;
  font-weight: 700;
}

/* 640-980 the single visible (tabbed) list still runs tall - CSS columns
   halve it (columns, not a 2-col grid: the numbered map keys must read
   DOWN). Must sit AFTER the base ol rule above - its display:grid would
   win the cascade and silently disable the columns. */
@media (min-width: 640px) and (max-width: 980px) {
  body.workspace-page.nbs-page .nbs-landmark-col ol {
    display: block;
    columns: 2;
    column-gap: clamp(24px, 4vw, 44px);
  }

  body.workspace-page.nbs-page .nbs-landmark-col li {
    break-inside: avoid;
  }
}

/* Two columns from the smallest phone up (the shared .transport-grid rule
   collapses to a single column ≤720px) - six cards read better as a
   compact 2-col block than a long single-column scroll. */
body.workspace-page.nbs-page .nbs-location-map-body .transport-grid {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

@media (max-width: 720px) {
  /* The shared mobile rule sizes "strong" (the minutes figure) for a
     full-width single-column card (clamp(2rem, 12vw, 3.15rem) + nowrap) -
     at half that width in our 2-col grid it overflowed the card ("12 mins"
     clipped past the edge). Scale it down and allow wrapping. */
  body.workspace-page.nbs-page .nbs-location-map-body .transport-card strong {
    font-size: clamp(1.5rem, 7vw, 2.2rem);
    white-space: normal;
  }
}

/* 2026-07-08 round: the illustrated map is the feature now - full container
   width (it was a 34% side column), with the transport cards sitting UNDER
   the map as a compact strip. The cards themselves shrink to fact-chips so
   six of them read as one row of station icons rather than a card wall. */
body.workspace-page.nbs-page .transport-card {
  grid-template-columns: 40px minmax(0, 1fr);
  gap: 10px 12px;
  min-height: 0;
  padding: 16px 18px;
}

/* Corrected TfL roundel (user 2026-07-09: shared drawing had the colours
   inverted - blue ring, red bar). Real proportions: red ring (Pantone 485,
   #dc241f), blue bar (Pantone 072, #0019a8) at ~25% of the diameter,
   overhanging the circle by a few px each side - which the old background
   gradient could never do, hence the ::after bar. */
body.workspace-page.nbs-page .transport-card .tube-roundel {
  position: relative;
  width: 40px;
  height: 40px;
  border: 7px solid #dc241f;
  background: transparent;
  box-shadow: none;
}

body.workspace-page.nbs-page .transport-card .tube-roundel::after {
  content: "";
  position: absolute;
  top: 50%;
  left: -10px;
  right: -10px;
  height: 9px;
  transform: translateY(-50%);
  background: #0019a8;
}

body.workspace-page.nbs-page .transport-card__station span {
  font-size: 1rem;
}

body.workspace-page.nbs-page .transport-card__station em {
  margin-top: 3px;
  font-size: 0.68rem;
  /* The shared rule's overflow-wrap:anywhere split "UNDERGROUND" mid-word
     in the tight 2-up mobile cards. */
  overflow-wrap: normal;
  letter-spacing: 0.01em;
}

body.workspace-page.nbs-page .transport-card strong {
  padding-top: 2px;
  font-size: clamp(1.55rem, 1.8vw, 2.1rem);
}

body.workspace-page.nbs-page .transport-card p span {
  min-height: 24px;
  padding: 4px 8px;
  font-size: 0.68rem;
}

@media (min-width: 1100px) {
  body.workspace-page.nbs-page .nbs-location-map-body .transport-grid {
    grid-template-columns: repeat(6, minmax(0, 1fr));
  }
}

@media (min-width: 721px) and (max-width: 1099px) {
  body.workspace-page.nbs-page .nbs-location-map-body .transport-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
}

body.workspace-page .workspace-footer {
  background:
    linear-gradient(90deg, rgba(56, 68, 50, 0.24), transparent 48%),
    var(--ink);
  color: var(--workspace-ivory);
}

body.workspace-page .workspace-footer a {
  color: var(--workspace-ivory);
}

body.workspace-page .workspace-footer a::after {
  color: var(--gold);
}

/* NBS-only: transparent ink lockup above the contact heading (user
   2026-07-09: solid coral badge reverted; ink replaces the old gold mark,
   which is too faint on the cream footer). */
body.workspace-page.nbs-page .nbs-footer-badge {
  display: block;
  width: clamp(160px, 16vw, 220px);
  height: auto;
  margin: 0 0 clamp(18px, 2.4vw, 26px);
}

/* NBS contact cards (2026-07-08 round): the footer's hairline contact rows
   became translucent glass cards - one per agent (name + firm + email/call
   pills) plus a brochure card. Resets below neutralise the shared
   .contact-footer / .workspace-footer link rules (row grid, border-bottom,
   the appended "Email" ::after label). */
body.workspace-page.nbs-page .workspace-footer address.nbs-contact-cards {
  display: grid;
  gap: 14px;
  align-self: center;
  border-top: 0;
}

/* 2026-07-09: solid white cards on the cream footer (the ivory glass went
   with the dark ground), ink text, square corners. */
body.workspace-page.nbs-page .nbs-contact-card {
  display: block;
  min-height: 0;
  padding: clamp(20px, 2.4vw, 26px) clamp(20px, 2.6vw, 30px);
  border: 0;
  border-radius: 0;
  background: #ffffff;
  box-shadow: 0 0 0 1px rgba(51, 49, 42, 0.12);
  color: var(--ink);
}

body.workspace-page.nbs-page .nbs-contact-card__name {
  margin: 0;
  color: var(--ink);
  font-size: 1.08rem;
  font-weight: 700;
}

body.workspace-page.nbs-page .nbs-contact-card__firm {
  display: block;
  margin: 4px 0 0;
  color: var(--muted);
  font-size: 10.5px;
  font-weight: 800;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

body.workspace-page.nbs-page .nbs-contact-card__actions {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-top: 16px;
}

body.workspace-page.nbs-page .workspace-footer .nbs-contact-card__actions a {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 40px;
  padding: 0 16px;
  border: 0;
  border-radius: 0;
  background: transparent;
  box-shadow: 0 0 0 1px rgba(51, 49, 42, 0.4);
  color: var(--ink);
  font-size: 0.7rem;
  font-weight: 800;
  letter-spacing: 0.04em;
  line-height: 1;
  text-decoration: none;
  text-transform: uppercase;
  transition: background 260ms var(--lux-ease), box-shadow 260ms var(--lux-ease);
}

body.workspace-page.nbs-page .workspace-footer .nbs-contact-card__actions a:hover,
body.workspace-page.nbs-page .workspace-footer .nbs-contact-card__actions a:focus-visible {
  background: var(--surface);
  box-shadow: 0 0 0 1px var(--ink);
  color: var(--ink);
  transform: none;
}

body.workspace-page.nbs-page .workspace-footer .nbs-contact-card__actions a::after,
body.workspace-page.nbs-page .workspace-footer a.nbs-contact-card::after {
  content: none;
}

body.workspace-page.nbs-page .workspace-footer a.nbs-contact-card {
  grid-template-columns: none;
  border-bottom: 0;
  transition: box-shadow 260ms var(--lux-ease), background 260ms var(--lux-ease);
}

body.workspace-page.nbs-page .workspace-footer a.nbs-contact-card:hover,
body.workspace-page.nbs-page .workspace-footer a.nbs-contact-card:focus-visible {
  background: #ffffff;
  box-shadow: 0 0 0 1px var(--ink);
  color: var(--ink);
  transform: none;
}

/* NBS mobile conversion bar (ports the Lombard sticky Call/Book pattern - see
   .lombard-mobile-cta - with NBS's own classes/vars, never reusing lombard-*
   selectors). Fixed to the viewport bottom on phones only; the desktop header
   .top-cta and the .global-email-cta pill (hidden ≤720px above) still cover
   larger breakpoints, so the bar owns mobile conversion instead of duplicating
   the header CTA (which is also hidden ≤720px - see .nbs-page .top-cta below). */
.nbs-mobile-cta {
  display: none;
}

/* Header brand mark (client 2026-07-08): the generic "N" chip is replaced by
   the badge logo's pictorial mark, recoloured to ink so it sits on the cream
   bar (`nbs-logo-mark-ink.*`, cropped from the transparent cream lockup).
   Must stay ABOVE the ≤720px media block below - its 30px override ties on
   specificity and wins by order. */
body.workspace-page.nbs-page .wordmark .nbs-wordmark-mark {
  display: block;
  width: auto;
  height: 40px;
}

@media (max-width: 720px) {
  body.workspace-page.nbs-page {
    padding-bottom: 74px;
  }

  body.workspace-page.nbs-page .top-cta {
    display: none;
  }

  body.workspace-page.nbs-page .nbs-mobile-cta {
    position: fixed;
    inset: auto 0 0 0;
    z-index: 95;
    display: grid;
    grid-template-columns: 1fr 1.35fr;
    gap: 10px;
    padding: 10px 14px calc(10px + env(safe-area-inset-bottom, 0px));
    border-top: 1px solid var(--line);
    background: color-mix(in srgb, var(--surface-strong) 96%, white);
    box-shadow: 0 -12px 34px rgba(18, 22, 16, 0.18);
  }

  body.workspace-page.nbs-page .nbs-mobile-cta a {
    display: flex;
    align-items: center;
    justify-content: center;
    min-height: 46px;
    border-radius: 0;
    font-size: 0.74rem;
    font-weight: 900;
    letter-spacing: 0;
    line-height: 1;
    text-transform: uppercase;
    text-decoration: none;
  }

  body.workspace-page.nbs-page .nbs-mobile-cta__call {
    border: 1px solid var(--ink);
    color: var(--ink);
    background: transparent;
  }

  body.workspace-page.nbs-page .nbs-mobile-cta__book {
    border: 1px solid var(--accent);
    background: var(--accent);
    color: var(--white);
  }

  /* Kicker pill: the full-length copy wraps to two lines at this width -
     swap in a shorter line instead of shrinking type further. */
  body.workspace-page.nbs-page .nbs-kicker-full {
    display: none;
  }

  body.workspace-page.nbs-page .nbs-kicker-short {
    display: inline;
  }

  /* The sticky bottom bar owns mobile conversion (see .nbs-mobile-cta above),
     so the hero carries no buttons at all on phones (client 2026-07-08) -
     the header nav already anchors to the plan. */
  body.workspace-page.nbs-page .workspace-hero-actions {
    display: none;
  }

  /* Header nav: five anchors plus the site-top's own horizontal padding
     don't fit in 375px even as a scroll row with no visible scrollbar
     affordance - Location/Contact end up effectively unreachable. Dropping
     "Specification" (least critical anchor; the section is still reachable
     by scrolling the page) lets the remaining four fit with zero overflow. */
  body.workspace-page.nbs-page .site-top nav a[href="#specification"] {
    display: none;
  }

  /* Header decram (client 2026-07-08): the brand row and nav row were
     sitting tight against each other with the four anchors bunched left.
     Give the bar breathing room, shrink the brand mark a touch, rule the nav
     row off with a hairline and spread the anchors across the full width. */
  body.workspace-page.nbs-page .site-top {
    gap: 6px 12px;
    padding: 13px 18px 6px;
  }

  body.workspace-page.nbs-page .wordmark .nbs-wordmark-mark {
    height: 30px;
  }

  body.workspace-page.nbs-page .site-top nav {
    justify-content: space-between;
    gap: 0;
    margin-top: 4px;
    border-top: 1px solid rgba(51, 49, 42, 0.1);
    padding: 4px 0 0;
  }

  body.workspace-page.nbs-page .site-top nav a {
    min-height: 42px;
    padding: 12px 6px;
    border: 0;
    font-size: 0.72rem;
  }

  body.workspace-page.nbs-page .site-top nav a:first-child {
    padding-left: 0;
  }

  body.workspace-page.nbs-page .site-top nav a:last-child {
    padding-right: 0;
  }
}

/* 2026-07-28: on phones the two-row header (brand + nav) above ran to
   roughly 105px, leaving only a sliver of the facade photo visible before
   the cream hero card. Tighten both rows further so the header settles
   nearer 80px - link text/padding still comfortably clears the four
   anchors at 320px, just with less air around them. No new markup, no
   hamburger, single row of nav links throughout. */
@media (max-width: 480px) {
  body.workspace-page.nbs-page .site-top {
    gap: 4px 10px;
    padding: 8px 16px 4px;
  }

  body.workspace-page.nbs-page .wordmark .nbs-wordmark-mark {
    height: 22px;
  }

  body.workspace-page.nbs-page .wordmark strong {
    font-size: 11px;
  }

  body.workspace-page.nbs-page .site-top nav {
    margin-top: 2px;
    padding-top: 2px;
  }

  body.workspace-page.nbs-page .site-top nav a {
    min-height: 30px;
    padding: 7px 6px;
    font-size: 0.62rem;
  }
}

@media (max-width: 980px) {
  body.workspace-page .workspace-arrival-images {
    grid-template-columns: repeat(3, minmax(220px, 1fr));
  }
}

@media (max-width: 720px) {
  body.workspace-page .workspace-hero::before {
    background:
      linear-gradient(0deg, rgba(21, 26, 19, 0.94) 0%, rgba(21, 26, 19, 0.78) 46%, rgba(21, 26, 19, 0.28) 100%),
      linear-gradient(90deg, rgba(21, 26, 19, 0.82), rgba(21, 26, 19, 0.24));
  }

  body.workspace-page .workspace-hero-media::before {
    display: block;
    background:
      linear-gradient(0deg, rgba(21, 26, 19, 0.58) 0%, rgba(21, 26, 19, 0.18) 58%, rgba(21, 26, 19, 0) 100%);
  }

  body.workspace-page .workspace-arrival-images {
    grid-auto-flow: column;
    grid-auto-columns: minmax(245px, 82vw);
    grid-template-columns: none;
  }

  body.workspace-page .workspace-arrival-heading h2 {
    font-size: clamp(2.55rem, 11vw, 3.1rem);
    line-height: 1;
    overflow-wrap: normal;
    word-break: normal;
  }

  body.workspace-page .availability-board {
    background: var(--paper);
  }
}

/* NBS mobile hero split (client 2026-07-08, replacing the 07-07 overlay
   tweaks): below 720px the full-bleed overlay hero becomes the Lombard-v2
   pattern the client pointed at - the facade photo sits at its natural
   aspect (no crop, no skew, no scrim, no copy over it) and the copy lives
   on a dark panel card pulled up over the photo's bottom edge. Tablet and
   desktop keep the overlay hero from the blocks above. */
@media (max-width: 720px) {
  body.workspace-page.nbs-page .workspace-hero {
    display: block;
    min-height: 0;
    padding: 0 0 30px;
    background: var(--paper);
  }

  body.workspace-page.nbs-page .workspace-hero::before {
    background: none;
  }

  body.workspace-page.nbs-page .workspace-hero-media {
    position: relative;
    inset: auto;
    overflow: hidden; /* the intro's slow photo settle scales the img slightly */
    background: var(--paper);
  }

  /* No copy over the photo - no scrim. */
  body.workspace-page.nbs-page .workspace-hero-media::before {
    display: none;
  }

  body.workspace-page.nbs-page .workspace-hero-media img {
    height: auto; /* intrinsic 3:2 - never cropped or stretched */
    object-position: 50% center;
    box-shadow: none;
  }

  body.workspace-page.nbs-page .workspace-hero-content {
    position: relative;
    z-index: 2;
    display: block;
    width: auto;
    max-width: none;
    margin: -62px 16px 0;
    padding: 0;
  }

  body.workspace-page.nbs-page .workspace-hero-copy {
    padding: 26px 22px 30px;
    background: var(--workspace-green); /* resolves to the cream since 2026-07-09 */
    box-shadow: 0 22px 44px rgba(24, 22, 16, 0.18);
  }

  /* Copy sits on a solid CREAM panel now (2026-07-09) - ink type, no
     over-photo text-shadow. */
  body.workspace-page.nbs-page .workspace-hero .kicker,
  body.workspace-page.nbs-page .workspace-hero h1,
  body.workspace-page.nbs-page .workspace-hero-copy > p:not(.kicker) {
    text-shadow: none;
  }

  body.workspace-page.nbs-page .workspace-hero h1,
  body.workspace-page.nbs-page .workspace-hero-copy > p:not(.kicker) {
    color: var(--ink);
  }

  /* Client 2026-07-09 evening: the floors/available label rendered WHITE
     on the cream card here (the v3 over-photo kicker rule later in the
     file ties this selector's specificity and wins by order) and "looks a
     little off" - drop it on mobile entirely; the availability board right
     below the hero carries the same facts. */
  body.workspace-page.nbs-page .workspace-hero-copy .kicker {
    display: none;
  }

  /* 2026-07-28: stepped down again from clamp(2.4rem, 10vw, 3.4rem) - that
     size still landed 3 lines with "now" dangling alone on line 3 at
     320-480px. The 2.4rem floor and 10vw preferred were both above the
     per-width size that keeps the headline to two lines, so both come
     down; the 3.4rem ceiling (reached ~680px+) is untouched since two
     lines already held there. */
  body.workspace-page.nbs-page .workspace-hero h1 {
    font-size: clamp(1.7rem, 8vw, 3.4rem);
  }

  body.workspace-page.nbs-page .workspace-hero-copy > p:not(.kicker) {
    font-size: 1.05rem;
  }
}

/* ============================================================
   NBS v3 - editorial luxury layer (2026-07-07)
   Ports the Lombard v3 recipe (Fraunces + Plus Jakarta Sans,
   eyebrow pills, double-bezel cards, --lux-ease motion, scroll
   reveals, optional film grain) onto 16-18 New Bridge Street.
   Everything below is scoped to body.workspace-page.nbs-page so
   workspace.html - which shares the plain .workspace-page family -
   is untouched. Reuses the Fraunces / Plus Jakarta Sans @font-face
   rules already declared below for Lombard; no duplicate @font-face.
   ============================================================ */

/* Palette + tokens. Redeclaring these custom properties at the
   nbs-page scope re-points every shared .workspace-page rule that
   reads var(--accent)/var(--gold)/var(--workspace-green) etc, since
   custom properties resolve from the nearest ancestor declaration on
   the same element - no need to touch the shared rules themselves.
   Flattened 2026-07-09 (Tara: "colour scheme - too many going on …
   [cream swatch] and white only"): TWO ground tones sitewide - white
   and the cream she pasted (#e5decb, sampled from her Teams swatch) -
   plus ink text. The dark olive zones are GONE (their tokens now
   resolve to the cream so any stragglers fail light, and every former
   dark section is explicitly restyled below). Coral #e85a47 (the badge
   brand colour) survives on CTA button fills ONLY - not on kickers,
   labels, tab selected-states or decorative accents. */
body.workspace-page.nbs-page {
  --brand-font: "Plus Jakarta Sans", system-ui, -apple-system, "Segoe UI", Arial, sans-serif;
  --lux-ease: cubic-bezier(0.32, 0.72, 0, 1);
  --paper: #ffffff;
  --surface: #e5decb;
  --surface-strong: #ffffff;
  --surface-muted: #e5decb;
  --white: #ffffff;
  --ink: #33312a;
  --muted: #5c5646;
  --line: rgba(51, 49, 42, 0.14);
  /* Coral sampled from the brand badge logo (client 2026-07-08) -
     since 2026-07-09 restricted to CTA fills only. */
  --accent: #e85a47;
  --gold: #5c5646;
  --workspace-green: #e5decb;
  --workspace-mist: #e5decb;
  /* Ivory is BOTH a light section background (breathing/occupier) and the
     text colour of the former dark zones - it must stay light; the former
     dark sections get explicit ink text in their own rules below. */
  --workspace-ivory: #ffffff;
  --workspace-clay: #5c5646;
  --workspace-obsidian: #e5decb;
  --shadow: 0 24px 80px rgba(51, 49, 42, 0.2);
  --soft-shadow: 0 16px 48px rgba(51, 49, 42, 0.16);
  font-family: var(--brand-font);
  font-optical-sizing: auto;
}

body.workspace-page.nbs-page button {
  font-family: inherit;
}

/* Typography - Fraunces on display elements only. The shared
   `body.template-page * { font-family: var(--brand-font) !important }`
   rule (styles.css ~9893) forces every element to the sans stack
   above, so these need !important to reassert the serif, exactly as
   the Lombard v3 layer does two sections below. */
body.workspace-page.nbs-page h1,
body.workspace-page.nbs-page h1 span,
body.workspace-page.nbs-page h2,
body.workspace-page.nbs-page .nbs-plan-stats dd,
body.workspace-page.nbs-page .workspace-program dd,
body.workspace-page.nbs-page .availability-board strong,
body.workspace-page.nbs-page .transport-card strong,
body.workspace-page.nbs-page .nbs-landmark-col li span,
body.workspace-page.nbs-page .floor-stat-figure,
body.workspace-page.nbs-page .plan-copy-recap-stats dd {
  font-family: "Fraunces", Georgia, "Times New Roman", serif !important;
  font-optical-sizing: auto;
}

body.workspace-page.nbs-page h1,
body.workspace-page.nbs-page h2 {
  font-weight: 590;
  font-variation-settings: "opsz" 144;
  letter-spacing: -0.01em;
  line-height: 1.04;
}

/* Eyebrow pills - one coral accent, used sparingly. Default is an
   outline pill for kickers sitting on cream; over photography or dark
   navy sections it flips to a solid / translucent treatment so it
   still reads clearly. */
/* Tara 2026-07-09: coral is CTA-only now - kickers are quiet uppercase
   micro-labels in muted ink, no pill chrome. */
body.workspace-page.nbs-page .kicker {
  display: inline-flex;
  width: fit-content;
  align-items: center;
  margin-bottom: 14px;
  padding: 0;
  border: 0;
  border-radius: 0;
  background: transparent;
  color: var(--muted);
  font-size: 0.68rem;
  font-weight: 700;
  letter-spacing: 0.2em;
  line-height: 1.5;
  text-transform: uppercase;
}

/* Over the hero photo the label reads in white with the existing
   text-shadow for legibility. */
body.workspace-page.nbs-page .workspace-hero .kicker {
  border: 0;
  background: transparent;
  color: #ffffff;
}

/* Section washes - replace the shared horizontal tint bands (banned
   on this pass, same as Lombard) with either a flat surface colour or
   a soft radial wash, always drawn from the coral/navy palette above.
   One accent per zone: only the three dark, feature sections below
   get the coral radial glow, everything else stays flat and calm. */
/* Section grounds - Tara 2026-07-09: two tones only, alternating flat
   white and her cream #e5decb. Every former dark zone below is re-based
   light with explicit ink text (the shared rules paint their text ivory).
   EXCEPTION (Tara 2026-07-09 second pass): the stats band goes back to a
   dark brown ground on client override - see the availability-board card
   rules further down for the matching cream-on-brown text treatment. */
body.workspace-page.nbs-page .availability-board {
  background: #2c2119;
}

body.workspace-page.nbs-page .workspace-arrival-editorial {
  background: var(--surface);
}

body.workspace-page.nbs-page .workspace-breathing-room,
body.workspace-page.nbs-page .occupier-section {
  background: var(--paper);
}

body.workspace-page.nbs-page .workspace-plan-suite {
  background: var(--surface-strong);
}

body.workspace-page.nbs-page .workspace-media-wall {
  background: var(--paper);
}

body.workspace-page.nbs-page .workspace-connection-table {
  background: var(--surface-muted);
}

body.workspace-page.nbs-page .workspace-scroll-suite {
  background: var(--surface);
  color: var(--ink);
}

/* Base (mobile/tablet) tightening: with a single static image the shared
   layout's reserved 48vh per copy article reads as dead space. Desktop
   restores scroll pacing in the scroll-stack block further down. */
body.workspace-page.nbs-page .workspace-suite-copy {
  gap: clamp(36px, 5vh, 64px);
  padding-top: clamp(40px, 6vw, 84px);
}

body.workspace-page.nbs-page .workspace-suite-copy article {
  min-height: 0;
  padding-bottom: clamp(24px, 4vh, 48px);
}

body.workspace-page.nbs-page .workspace-suite-media {
  min-height: 0;
  align-self: start;
}

/* Scroll-stack (client 2026-07-13): both workspace shots run full column
   width, stacked on top of each other; as you scroll, the meeting-room
   card slides over the first and settles 36px lower so the card beneath
   still peeks out. Desktop only - at 980px and below the section is
   single column and shows the main shot alone. */
@media (min-width: 981px) {
  body.workspace-page.nbs-page .workspace-suite-media {
    position: static;
    top: auto;
    align-self: stretch;
    padding: clamp(70px, 9vw, 132px) 0 clamp(52px, 7vw, 96px);
  }

  body.workspace-page.nbs-page .suite-image-main,
  body.workspace-page.nbs-page .suite-image-inset {
    position: sticky;
    width: auto;
    height: min(70vh, 700px);
  }

  body.workspace-page.nbs-page .suite-image-main {
    top: 96px;
    z-index: 1;
  }

  body.workspace-page.nbs-page .suite-image-inset {
    top: 132px;
    right: auto;
    bottom: auto;
    z-index: 2;
    margin-top: 36vh;
  }

  /* The copy column needs its scroll pacing back (it was tightened when
     this section held two static images) so the second card has travel
     room while the articles pass. */
  body.workspace-page.nbs-page .workspace-suite-copy {
    gap: clamp(60px, 10vh, 120px);
    padding-top: clamp(88px, 12vw, 168px);
  }

  body.workspace-page.nbs-page .workspace-suite-copy article {
    min-height: 40vh;
  }
}

@media (max-width: 980px) {
  body.workspace-page.nbs-page .suite-image-inset {
    display: none;
  }
}

body.workspace-page.nbs-page .workspace-service-suite {
  background: var(--paper);
  color: var(--ink);
}

body.workspace-page.nbs-page .workspace-footer {
  background: var(--surface);
  color: var(--ink);
}

/* Ink type for the former dark zones (Tara 2026-07-09): the shared template
   still paints their body copy, links, spec hairlines and figures in
   translucent ivory / green tones that vanish on the new light grounds. */
body.workspace-page.nbs-page .workspace-suite-copy p:not(.kicker),
body.workspace-page.nbs-page .workspace-service-suite .table-heading p:not(.kicker),
body.workspace-page.nbs-page .contact-footer p:not(.kicker) {
  color: var(--muted);
}

body.workspace-page.nbs-page .workspace-footer a {
  color: var(--ink);
}

body.workspace-page.nbs-page .workspace-program dd,
body.workspace-page.nbs-page .workspace-breathing-points strong {
  color: var(--ink);
}

/* Tara 2026-07-09 "can this be more exciting" - the plain two-column
   definition list becomes a stat ledger: a numbered hairline chip, a big
   Fraunces figure and the supporting copy, on hairline rules. Cream/white/
   ink only, no coral. */
body.workspace-page.nbs-page .workspace-breathing-points {
  border-top-color: var(--line);
}

body.workspace-page.nbs-page .workspace-breathing-points li {
  position: relative;
  grid-template-columns: minmax(84px, 0.24fr) 1fr;
  align-items: center;
  column-gap: clamp(20px, 3vw, 40px);
  padding: clamp(24px, 2.8vw, 32px) 0 clamp(24px, 2.8vw, 32px) 46px;
  border-bottom-color: var(--line);
}

body.workspace-page.nbs-page .workspace-breathing-points li::before {
  content: attr(data-icon);
  position: absolute;
  left: 0;
  top: clamp(24px, 2.8vw, 32px);
  display: grid;
  width: 27px;
  height: 27px;
  place-items: center;
  border: 1px solid var(--line);
  color: var(--muted);
  font-size: 10px;
  font-weight: 800;
  letter-spacing: 0.02em;
}

body.workspace-page.nbs-page .floor-stat-figure {
  font-size: clamp(2.3rem, 3.4vw, 3.3rem);
  font-weight: 590;
  font-variation-settings: "opsz" 144;
  line-height: 0.94;
  letter-spacing: -0.01em;
  color: var(--ink);
}

body.workspace-page.nbs-page .floor-stat-figure--text {
  font-size: clamp(1.05rem, 1.5vw, 1.28rem);
  font-weight: 700;
  font-variation-settings: normal;
  line-height: 1.16;
  letter-spacing: 0.01em;
  text-transform: uppercase;
}

body.workspace-page.nbs-page .floor-stat-copy {
  display: grid;
  gap: 6px;
}

body.workspace-page.nbs-page .workspace-breathing-points strong {
  font-size: 0.82rem;
  font-weight: 800;
  letter-spacing: 0.06em;
  text-transform: uppercase;
}

@media (max-width: 720px) {
  body.workspace-page.nbs-page .workspace-breathing-points li {
    grid-template-columns: minmax(60px, 0.3fr) 1fr;
    column-gap: 18px;
    padding: 22px 0 22px 40px;
  }

  body.workspace-page.nbs-page .workspace-breathing-points li::before {
    top: 22px;
    width: 24px;
    height: 24px;
  }

  body.workspace-page.nbs-page .floor-stat-figure {
    font-size: clamp(1.9rem, 8vw, 2.4rem);
  }

  body.workspace-page.nbs-page .floor-stat-figure--text {
    font-size: 1rem;
  }
}

/* The stat rows made the right column much taller than the short
   heading column; keep the heading in view while they scroll. */
@media (min-width: 981px) {
  body.workspace-page.nbs-page .workspace-breathing-copy {
    position: sticky;
    top: 104px;
  }

  /* Client 2026-07-09 round 4: "the main focus is the stat list" - flip
     the shared 0.88fr/0.55fr split so the heading column narrows and the
     floor-stat ledger carries the section. */
  body.workspace-page.nbs-page .workspace-breathing-room {
    grid-template-columns: minmax(0, 0.4fr) minmax(0, 0.6fr);
    gap: clamp(34px, 6vw, 96px);
  }
}

body.workspace-page.nbs-page .workspace-service-suite .rows {
  border-top-color: var(--line);
}

body.workspace-page.nbs-page .workspace-service-suite .rows p {
  border-bottom-color: var(--line);
  color: var(--muted);
}

body.workspace-page.nbs-page .workspace-service-suite .rows span {
  color: var(--ink);
}

body.workspace-page.nbs-page .workspace-service-suite .rows p::before {
  color: var(--muted);
}

/* Spec widgets, reworked (client 2026-07-09 round 3 "the double container
   looks bad"): the white cards floating on a padded cream band collapsed
   into ONE hairline-framed ledger - a 2x2 grid of white cells whose 1px
   gaps paint the frame and internal dividers from the grid background. The
   boxed 56px monogram chip (a third nested container) opened up into a big
   unboxed Fraunces initial, echoing the floor-overview numerals. Markup is
   unchanged from the round-2 swap (.nbs-spec-grid/.nbs-spec-card). */
body.workspace-page.nbs-page .nbs-spec-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 1px;
  margin-top: clamp(28px, 3.5vw, 44px);
  padding: 1px;
  background: var(--line);
}

body.workspace-page.nbs-page .nbs-spec-card {
  display: flex;
  flex-direction: column;
  gap: 10px;
  padding: clamp(28px, 3vw, 40px);
  background: var(--paper);
  transition: background 0.35s var(--lux-ease);
}

body.workspace-page.nbs-page .nbs-spec-card:hover {
  background: color-mix(in srgb, var(--surface) 32%, white);
}

/* Tara 2026-07-16: the CA/VRF/CR/2L letter monograms read as misleading -
   pictogram line icons in a hairline square instead, and the location list's
   AR/CO chips get the identical treatment (.nbs-loc-icon below) so the two
   sections match. */
body.workspace-page.nbs-page .nbs-spec-card__chip,
body.workspace-page.nbs-page .nbs-loc-icon {
  display: grid;
  width: 44px;
  height: 44px;
  place-items: center;
  border: 1px solid var(--line);
  color: var(--accent);
}

body.workspace-page.nbs-page .nbs-spec-card__chip svg,
body.workspace-page.nbs-page .nbs-loc-icon svg {
  width: 22px;
  height: 22px;
}

/* The shared template draws the location chips as attr(data-icon) pseudo
   boxes - suppress them here, the inline SVG chip takes their spot. */
body.workspace-page.nbs-page .occupier-section dl > div::before {
  content: none;
}

body.workspace-page.nbs-page .nbs-loc-icon {
  position: absolute;
  left: 26px;
  top: 28px;
}

body.workspace-page.nbs-page .nbs-spec-card__label {
  margin: 0;
  color: var(--muted);
  font-size: 12px;
  font-weight: 800;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

body.workspace-page.nbs-page .nbs-spec-card__text {
  margin: 0;
  color: var(--ink);
  font-size: clamp(1.05rem, 1.3vw, 1.2rem);
  font-weight: 500;
  line-height: 1.5;
}

@media (max-width: 720px) {
  body.workspace-page.nbs-page .nbs-spec-grid {
    grid-template-columns: 1fr;
    gap: 1px;
    padding: 1px;
    margin-top: 24px;
  }

  /* Mobile reads as a row: the coral icon chip sits LEFT of the copy
     (user 2026-07-09) instead of stacking above it. Fixed 72px icon
     column so the four ledger cells align. */
  body.workspace-page.nbs-page .nbs-spec-card {
    display: grid;
    grid-template-columns: 72px minmax(0, 1fr);
    gap: 3px 14px;
    align-items: center;
    padding: 18px 16px;
  }

  body.workspace-page.nbs-page .nbs-spec-card__chip {
    grid-row: 1 / span 2;
    align-self: center;
    justify-self: center;
    width: 40px;
    height: 40px;
  }

  body.workspace-page.nbs-page .nbs-spec-card__chip svg {
    width: 20px;
    height: 20px;
  }

  body.workspace-page.nbs-page .nbs-spec-card__text {
    font-size: 1rem;
  }
}

/* Caption chips over photos flip from dark glass to white. */
body.workspace-page.nbs-page .workspace-hero-media figcaption,
body.workspace-page.nbs-page .suite-image-main figcaption,
body.workspace-page.nbs-page .workspace-media-wall figcaption {
  border: 1px solid var(--line);
  background: rgba(255, 255, 255, 0.92);
  color: var(--ink);
}

/* Dark brown fact tiles on the dark brown board (Tara 2026-07-09 second
   pass, client override of the all-cream direction: "dark brown background
   behind this rather than white"). Tiles read one shade lighter than the
   band itself so they still read as cards; text flips to cream/white. */
body.workspace-page.nbs-page .availability-board div,
body.workspace-page.nbs-page .availability-board div:nth-child(odd) {
  border-radius: 0;
  background: #3c2f24;
  box-shadow: none;
}

/* All four cards match: same dark-brown card, same cream text, same icon
   treatment (the data-icon chips themselves stay suppressed below). */
body.workspace-page.nbs-page .availability-board div:first-child {
  background: #3c2f24;
  color: #f4efe2;
  box-shadow: none;
}

body.workspace-page.nbs-page .availability-board div:first-child::before {
  border-color: rgba(229, 222, 203, 0.28);
  color: #f4efe2;
}

body.workspace-page.nbs-page .availability-board div:first-child strong {
  color: #f8f4ea;
}

/* Muted cream labels/captions on the dark brown tiles (was muted ink for
   the cream-tile version; the shared rule hard-codes an olive-grey that
   also fails contrast here). */
body.workspace-page.nbs-page .availability-board span,
body.workspace-page.nbs-page .availability-board small {
  color: rgba(229, 222, 203, 0.72);
}

/* The shared template paints card 01's labels differently via div:first-child
   rules that out-rank the rule above - reassert the same muted cream at
   matching specificity (the shared mobile block repeats its override at
   ≤720, so this must cover first-child explicitly). */
body.workspace-page.nbs-page .availability-board div:first-child span,
body.workspace-page.nbs-page .availability-board div:first-child small {
  color: rgba(229, 222, 203, 0.72);
}

/* 2026-07-08 round: the summary cards were huge (190px+ min-height, poster-size
   figures) - compress the strip into a compact fact bar. The numbered data-icon
   chips go too; at this scale they crowd the corner.
   2026-07-09 second pass (Tara): "less wide and larger text" - the four
   tiles no longer stretch to fill the row; they cap at a fixed width and
   sit centred in the dark brown band, with a bigger value/label scale. */
body.workspace-page.nbs-page .availability-board {
  grid-template-columns: repeat(4, minmax(0, 232px));
  justify-content: center;
  gap: clamp(14px, 1.6vw, 22px);
  padding: clamp(32px, 4vw, 56px) clamp(24px, 8vw, 118px);
  border-top: 0;
  border-bottom: 0;
}

body.workspace-page.nbs-page .availability-board div,
body.workspace-page.nbs-page .availability-board div:first-child,
body.workspace-page.nbs-page .availability-board div:nth-child(odd) {
  min-height: 0;
  padding: 20px 20px 18px;
  border: 0;
  border-radius: 0;
}

body.workspace-page.nbs-page .availability-board div::before,
body.workspace-page.nbs-page .availability-board div:first-child::before {
  content: none;
}

body.workspace-page.nbs-page .availability-board span,
body.workspace-page.nbs-page .availability-board small {
  font-size: 12.5px;
  letter-spacing: 0.05em;
}

body.workspace-page.nbs-page .availability-board strong {
  margin: 14px 0 6px;
  color: #f8f4ea;
  font-size: clamp(1.55rem, 2.3vw, 2.15rem);
  line-height: 1.05;
  overflow-wrap: break-word;
  word-break: break-word;
  hyphens: auto;
}

@media (max-width: 720px) {
  body.workspace-page.nbs-page .availability-board div,
  body.workspace-page.nbs-page .availability-board div:first-child,
  body.workspace-page.nbs-page .availability-board div:nth-child(odd),
  body.workspace-page.nbs-page .occupier-section dl > div,
  body.workspace-page.nbs-page .transport-card {
    border-color: var(--line);
  }

  /* The shared template flips the location chips into the flow at this
     width (the dl rows lose their 82px indent) - match that with the
     inline SVG chip, at the same 40px scale as the spec cards. */
  body.workspace-page.nbs-page .nbs-loc-icon {
    position: static;
    margin-bottom: 14px;
    width: 40px;
    height: 40px;
  }

  body.workspace-page.nbs-page .nbs-loc-icon svg {
    width: 20px;
    height: 20px;
  }

  /* Compress further into ledger rows - label left, figure right (the same
     mobile pattern the Lombard availability grid uses). */
  body.workspace-page.nbs-page .availability-board {
    grid-template-columns: 1fr;
    gap: 10px;
    padding: 26px 20px;
  }

  body.workspace-page.nbs-page .availability-board div,
  body.workspace-page.nbs-page .availability-board div:first-child,
  body.workspace-page.nbs-page .availability-board div:nth-child(odd) {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    grid-template-areas:
      "label figure"
      "caption figure";
    align-items: center;
    column-gap: 16px;
    row-gap: 2px;
    min-height: 0;
    padding: 14px 18px;
    border-radius: 0;
  }

  body.workspace-page.nbs-page .availability-board span {
    grid-area: label;
    align-self: end;
  }

  body.workspace-page.nbs-page .availability-board small {
    grid-area: caption;
    align-self: start;
    font-size: 11px;
  }

  body.workspace-page.nbs-page .availability-board strong {
    grid-area: figure;
    margin: 0;
    font-size: clamp(1.4rem, 5.8vw, 1.85rem);
    text-align: right;
  }
}

/* Flat square cards: plan board, plan gallery frames, transport cards
   (Tara 2026-07-09: no rounded corners; bezel highlights gone). */
body.workspace-page.nbs-page .nbs-plan-board,
body.workspace-page.nbs-page .transport-card,
body.workspace-page.nbs-page .floor-plan-figure {
  border: 0;
  border-radius: 0;
  box-shadow:
    0 0 0 1px rgba(51, 49, 42, 0.08),
    0 20px 44px -24px rgba(51, 49, 42, 0.22);
}

body.workspace-page.nbs-page .nbs-plan-board figcaption {
  border-top-color: var(--line);
}

body.workspace-page.nbs-page .nbs-plan-gallery .floor-plan-figure {
  border-radius: 0;
  overflow: hidden;
}

/* One frame language for every photographic / plan / map asset (client
   2026-07-08 "borders/shadows consistent across all assets"; Tara
   2026-07-09 "don't like circular borders" - the shared 14px radius is
   now SQUARE): hairline ring painted as shadow, one soft drop, no radius. */
body.workspace-page.nbs-page .workspace-arrival-images figure,
body.workspace-page.nbs-page .suite-image,
body.workspace-page.nbs-page .workspace-media-wall figure,
body.workspace-page.nbs-page .nbs-location-map-figure,
body.workspace-page.nbs-page .nbs-plan-board,
body.workspace-page.nbs-page .nbs-plan-gallery .floor-plan-figure {
  border: 0;
  border-radius: 0;
  overflow: hidden;
  background: #ffffff; /* shared template paints dark panels behind these */
  box-shadow:
    0 0 0 1px rgba(51, 49, 42, 0.1),
    0 20px 44px -24px rgba(51, 49, 42, 0.22);
}

body.workspace-page.nbs-page .nbs-plan-tab-list {
  box-shadow: none;
}

/* Client 2026-07-09 round 4: the illustrated (vector) neighbourhood map
   loses the unified frame - no ring, no drop, no caption bar; it sits as
   free artwork on the cream ground. The aerial PHOTO keeps its frame.
   Must stay AFTER the unified frame block above (equal specificity). */
body.workspace-page.nbs-page .nbs-location-map-figure--illustrated {
  background: transparent;
  box-shadow: none;
  overflow: visible;
}

body.workspace-page.nbs-page .nbs-location-map-figure--illustrated figcaption {
  border-top: 0;
  padding: 12px 2px 0;
}

body.workspace-page.nbs-page .nbs-plan-tab-btn:hover {
  color: var(--ink);
}

/* Landmark lists (since 2026-07-09 round 3 they live in the .nbs-map-legend
   sidebar next to the illustrated map): hairline ledger rows, one column
   reading straight down like a map key. Sized so 21 entries plus two
   headings roughly track the height of the 3/4-width map beside them -
   noticeably tighter than the old full-width block, deliberately. */
body.workspace-page.nbs-page .nbs-landmark-col ol {
  gap: 0;
  background: transparent;
}

body.workspace-page.nbs-page .nbs-landmark-col li {
  padding: 6px 4px;
  background: transparent;
  border-bottom: 1px solid var(--line);
  font-size: 1rem;
  line-height: 1.35;
}

body.workspace-page.nbs-page .nbs-landmark-col li span {
  font-size: 0.85rem;
  font-weight: 700;
}

/* Spec table - icon chips read as quiet hairline rings on the light ground. */
body.workspace-page.nbs-page .workspace-service-suite .rows p::before {
  border-color: var(--line);
}

/* Mobile spec ledger (client 2026-07-08): the shared mobile treatment boxes
   each spec row into a card with the icon chip on its own line - four rows
   ran the section well past a full screen. Collapse to compact hairline
   ledger rows with no chips; desktop/tablet keep the boxed rows above. */
@media (max-width: 720px) {
  body.workspace-page.nbs-page .workspace-service-suite .rows {
    gap: 0;
    padding-bottom: 0;
    border-top: 1px solid var(--line);
  }

  body.workspace-page.nbs-page .workspace-service-suite .rows p {
    min-height: 0;
    padding: 13px 0 14px;
    border: 0;
    border-bottom: 1px solid var(--line);
    border-radius: 0;
    background: transparent;
    font-size: 0.9rem;
    line-height: 1.5;
  }

  body.workspace-page.nbs-page .workspace-service-suite .rows p::before {
    content: none;
  }

  body.workspace-page.nbs-page .workspace-service-suite .rows span {
    display: block;
    margin-bottom: 3px;
  }
}

/* Single button colour (client request 2026-07-08): every filled CTA on the
   page - header, floating email pill, hero primary, arrival CTA, sticky
   mobile "book" - uses the one accent clay. No second button colour exists;
   the hero's "Explore the plan" and the mobile "Call" stay as quiet outline
   links, not competing fills. */
body.workspace-page.nbs-page .top-cta,
body.workspace-page.nbs-page .global-email-cta,
body.workspace-page.nbs-page .workspace-hero-actions .primary-action,
body.workspace-page.nbs-page .workspace-arrival-mobile-cta,
body.workspace-page.nbs-page .nbs-mobile-cta__book,
body.workspace-page.nbs-page .plan-copy-cta {
  border-color: var(--accent);
  background: var(--accent);
  color: var(--white);
}

body.workspace-page.nbs-page .top-cta:hover,
body.workspace-page.nbs-page .top-cta:focus-visible,
body.workspace-page.nbs-page .global-email-cta:hover,
body.workspace-page.nbs-page .global-email-cta:focus-visible,
body.workspace-page.nbs-page .workspace-hero-actions .primary-action:hover,
body.workspace-page.nbs-page .workspace-hero-actions .primary-action:focus-visible,
body.workspace-page.nbs-page .workspace-arrival-mobile-cta:hover,
body.workspace-page.nbs-page .workspace-arrival-mobile-cta:focus-visible,
body.workspace-page.nbs-page .plan-copy-cta:hover,
body.workspace-page.nbs-page .plan-copy-cta:focus-visible {
  border-color: color-mix(in srgb, var(--accent) 82%, black);
  background: color-mix(in srgb, var(--accent) 82%, black);
  color: var(--white);
}

/* Tara 2026-07-09 "don't like circular borders": the floating email pill
   squares off, and the small info chips (plan benefits, tube line names)
   drop their accent tints for quiet hairline neutrals - coral is CTA-only. */
body.workspace-page.nbs-page .global-email-cta {
  border-radius: 0;
}

/* First-screen CTA competition: the floating pill used to sit visible from
   the first paint, stacked against the header's "Arrange a viewing" and the
   hero's own two buttons. It now starts hidden and only fades/slides in once
   script.js (IntersectionObserver on .workspace-hero) adds .is-visible,
   i.e. once the hero has scrolled fully out of view. Below 720px the pill
   is already display:none (see the shared mobile rule above), so this only
   affects tablet/desktop widths. */
body.workspace-page.nbs-page .global-email-cta {
  opacity: 0;
  transform: translateY(14px);
  pointer-events: none;
  transition: opacity 320ms var(--lux-ease), transform 320ms var(--lux-ease);
}

body.workspace-page.nbs-page .global-email-cta.is-visible {
  opacity: 1;
  transform: none;
  pointer-events: auto;
}

@media (prefers-reduced-motion: reduce) {
  body.workspace-page.nbs-page .global-email-cta {
    transition: none;
  }
}

body.workspace-page.nbs-page .plan-benefits span {
  border-color: var(--line);
  background: #ffffff;
  color: var(--muted);
}

body.workspace-page.nbs-page .transport-card p span {
  border-color: var(--line);
  background: #ffffff;
  color: var(--muted);
}

/* Scroll-spun conic borders (client 2026-07-08, "google style"): every filled
   CTA wears a fine gradient ring whose hue sweep rotates as the page scrolls.
   script.js writes --nbs-scroll-angle onto the body on scroll frames, so the
   ring visibly spins while scrolling and rests when the page rests. Painted
   as a two-layer background through a transparent 2px border - the accent
   fill clipped to padding-box, the conic to border-box. Ring stops are
   tone-on-tone (2026-07-28, "colours don't suit the page"): deep clay and
   soft blush, both color-mixed from --accent so they track the coral fill -
   the old coral↔cream stripes fought the muted cream/white grounds and the
   cream quarters vanished on cream sections. Reduced-motion visitors keep
   the static ring; the
   angle never moves for them (gated in script.js). NOTE: these must stay
   AFTER the single-button-colour block above - its background shorthand
   would flatten the two layers. */
body.workspace-page.nbs-page {
  --nbs-scroll-angle: 0deg;
  --nbs-ring-deep: color-mix(in srgb, var(--accent) 70%, var(--ink));
  --nbs-ring-soft: color-mix(in srgb, var(--accent) 38%, var(--white));
}

body.workspace-page.nbs-page .top-cta,
body.workspace-page.nbs-page .global-email-cta,
body.workspace-page.nbs-page .workspace-hero-actions .primary-action,
body.workspace-page.nbs-page .nbs-mobile-cta__book,
body.workspace-page.nbs-page .nbs-enquiry__email {
  border: 2px solid transparent;
  background:
    linear-gradient(var(--accent), var(--accent)) padding-box,
    conic-gradient(from var(--nbs-scroll-angle), var(--nbs-ring-deep), var(--nbs-ring-soft) 25%, var(--nbs-ring-deep) 50%, var(--nbs-ring-soft) 75%, var(--nbs-ring-deep)) border-box;
}

body.workspace-page.nbs-page .top-cta:hover,
body.workspace-page.nbs-page .top-cta:focus-visible,
body.workspace-page.nbs-page .global-email-cta:hover,
body.workspace-page.nbs-page .global-email-cta:focus-visible,
body.workspace-page.nbs-page .workspace-hero-actions .primary-action:hover,
body.workspace-page.nbs-page .workspace-hero-actions .primary-action:focus-visible,
body.workspace-page.nbs-page .nbs-mobile-cta__book:hover,
body.workspace-page.nbs-page .nbs-mobile-cta__book:focus-visible,
body.workspace-page.nbs-page .nbs-enquiry__email:hover,
body.workspace-page.nbs-page .nbs-enquiry__email:focus-visible {
  background:
    linear-gradient(color-mix(in srgb, var(--accent) 82%, black), color-mix(in srgb, var(--accent) 82%, black)) padding-box,
    conic-gradient(from var(--nbs-scroll-angle), var(--nbs-ring-deep), var(--nbs-ring-soft) 25%, var(--nbs-ring-deep) 50%, var(--nbs-ring-soft) 75%, var(--nbs-ring-deep)) border-box;
}

/* Arrival "Arrange a viewing" (client 2026-07-09): square like every other
   NBS corner, and no conic ring at all - it stays the one plain filled CTA.
   The base workspace rule pills it (border-radius: 999px), so this override
   must keep the higher nbs specificity. Fill and hover come from the
   single-button-colour block above. */
body.workspace-page.nbs-page .workspace-arrival-mobile-cta {
  border-radius: 0;
}

/* Sticky mobile "Book a viewing" (client 2026-07-08 "make the scroll
   animation more obvious"; reworked 2026-07-09 "too much movement - it
   should pop per section", then again "when there is no pop, remove the
   border"): at rest the button is a plain solid fill - the accent is
   clipped to border-box so the transparent 3.5px border never reads as a
   gap. The clay↔blush ring (same tone-on-tone stops as the desktop conic
   above, 2026-07-28 - the old ink↔cream flash was too stark against the
   coral fill) lives on an ::before overlay that is opacity: 0
   until script.js applies .nbs-cta-pop on a section change; the pop runs
   the ring flash (fade in, hold through the 650ms angle sweep, fade out)
   alongside the scale pulse, so between sections there is no border at
   all. The mask pair carves the overlay down to just the border band. */
@property --nbs-pop-angle {
  syntax: "<angle>";
  inherits: true;
  initial-value: 0deg;
}

@media (max-width: 720px) {
  body.workspace-page.nbs-page {
    --nbs-pop-angle: 0deg;
    transition: --nbs-pop-angle 650ms var(--lux-ease);
  }

  body.workspace-page.nbs-page .nbs-mobile-cta__book {
    position: relative;
    border-width: 3.5px;
    background: linear-gradient(var(--accent), var(--accent)) border-box;
  }

  body.workspace-page.nbs-page .nbs-mobile-cta__book:hover,
  body.workspace-page.nbs-page .nbs-mobile-cta__book:focus-visible {
    background: linear-gradient(color-mix(in srgb, var(--accent) 82%, black), color-mix(in srgb, var(--accent) 82%, black)) border-box;
  }

  body.workspace-page.nbs-page .nbs-mobile-cta__book::before {
    content: "";
    position: absolute;
    inset: -3.5px;
    border: 3.5px solid transparent;
    background: conic-gradient(from var(--nbs-pop-angle), var(--nbs-ring-deep), var(--nbs-ring-soft) 25%, var(--nbs-ring-deep) 50%, var(--nbs-ring-soft) 75%, var(--nbs-ring-deep)) border-box;
    -webkit-mask: linear-gradient(#fff 0 0) padding-box, linear-gradient(#fff 0 0) border-box;
    -webkit-mask-composite: xor;
    mask: linear-gradient(#fff 0 0) padding-box, linear-gradient(#fff 0 0) border-box;
    mask-composite: exclude;
    opacity: 0;
    pointer-events: none;
  }

  body.workspace-page.nbs-page .nbs-mobile-cta__book.nbs-cta-pop {
    animation: nbs-cta-pop 520ms var(--lux-ease);
  }

  body.workspace-page.nbs-page .nbs-mobile-cta__book.nbs-cta-pop::before {
    animation: nbs-ring-flash 1100ms var(--lux-ease);
  }
}

@keyframes nbs-cta-pop {
  0% {
    transform: scale(1);
  }

  38% {
    transform: scale(1.055);
  }

  100% {
    transform: scale(1);
  }
}

@keyframes nbs-ring-flash {
  0% {
    opacity: 0;
  }

  16% {
    opacity: 1;
  }

  64% {
    opacity: 1;
  }

  100% {
    opacity: 0;
  }
}

/* Get-in-contact popup (client 2026-07-08): a native <dialog>, opened once
   per session by script.js after roughly a viewport of scrolling. Escape,
   the ✕, the backdrop and both action links all dismiss it. */
body.workspace-page.nbs-page .nbs-enquiry {
  width: min(92vw, 430px);
  margin: auto;
  padding: clamp(28px, 6vw, 36px) clamp(22px, 5vw, 32px) clamp(22px, 5vw, 28px);
  border: 0;
  border-radius: 0;
  background: var(--paper);
  color: var(--ink);
  box-shadow: 0 34px 90px rgba(20, 17, 12, 0.4);
}

body.workspace-page.nbs-page .nbs-enquiry::backdrop {
  background: rgba(28, 26, 20, 0.46);
  backdrop-filter: blur(5px);
}

body.workspace-page.nbs-page .nbs-enquiry[open] {
  animation: nbs-enquiry-rise 520ms var(--lux-ease) backwards;
}

body.workspace-page.nbs-page .nbs-enquiry__close {
  position: absolute;
  top: 14px;
  right: 14px;
  display: grid;
  place-items: center;
  width: 36px;
  height: 36px;
  padding: 0;
  border: 1px solid var(--line);
  border-radius: 0;
  background: transparent;
  color: var(--ink);
  font-size: 20px;
  line-height: 1;
  cursor: pointer;
}

body.workspace-page.nbs-page .nbs-enquiry__close:hover,
body.workspace-page.nbs-page .nbs-enquiry__close:focus-visible {
  background: rgba(51, 49, 42, 0.08);
}

body.workspace-page.nbs-page .nbs-enquiry__kicker {
  margin: 0 0 10px;
  color: var(--muted);
  font-size: 0.66rem;
  font-weight: 800;
  letter-spacing: 0.16em;
  text-transform: uppercase;
}

body.workspace-page.nbs-page .nbs-enquiry h3 {
  margin: 0 0 12px;
  font-family: "Fraunces", Georgia, "Times New Roman", serif !important;
  font-size: clamp(1.7rem, 5.6vw, 2.1rem);
  font-weight: 600;
  letter-spacing: -0.01em;
  line-height: 1.08;
}

body.workspace-page.nbs-page .nbs-enquiry__note {
  margin: 0 0 22px;
  color: var(--muted);
  font-size: 0.92rem;
  line-height: 1.55;
}

body.workspace-page.nbs-page .nbs-enquiry__actions {
  display: grid;
  gap: 10px;
}

body.workspace-page.nbs-page .nbs-enquiry__actions a {
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: 48px;
  border-radius: 0;
  font-size: 0.74rem;
  font-weight: 800;
  letter-spacing: 0.04em;
  line-height: 1;
  text-transform: uppercase;
  text-decoration: none;
}

body.workspace-page.nbs-page .nbs-enquiry__email {
  color: var(--white);
}

body.workspace-page.nbs-page .nbs-enquiry__call {
  border: 1px solid var(--ink);
  color: var(--ink);
}

@keyframes nbs-enquiry-rise {
  from {
    opacity: 0;
    transform: translateY(20px) scale(0.97);
  }
}

@media (prefers-reduced-motion: reduce) {
  body.workspace-page.nbs-page .nbs-enquiry[open] {
    animation: none;
  }
}

/* Motion - button hover physics on --lux-ease, no arrows added anywhere. */
body.workspace-page.nbs-page .top-cta,
body.workspace-page.nbs-page .global-email-cta,
body.workspace-page.nbs-page .primary-action,
body.workspace-page.nbs-page .secondary-action,
body.workspace-page.nbs-page .workspace-arrival-mobile-cta,
body.workspace-page.nbs-page .nbs-mobile-cta a,
body.workspace-page.nbs-page .nbs-plan-tab-btn,
body.workspace-page.nbs-page .contact-footer a {
  transition: background 320ms var(--lux-ease), border-color 320ms var(--lux-ease), color 320ms var(--lux-ease), transform 320ms var(--lux-ease), box-shadow 320ms var(--lux-ease);
}

body.workspace-page.nbs-page .site-top nav a {
  transition: color 260ms var(--lux-ease), border-color 260ms var(--lux-ease);
}

body.workspace-page.nbs-page :is(.top-cta, .global-email-cta, .primary-action, .secondary-action, .nbs-mobile-cta a):active {
  transform: scale(0.98);
}

/* Scroll reveals (companion to the [data-reveal] observer in script.js,
   which now also gates on body.nbs-page - see the shared IIFE below). */
body.workspace-page.nbs-page.nbs-reveal-ready [data-reveal] {
  transition:
    opacity 0.45s var(--lux-ease),
    transform 0.45s var(--lux-ease),
    filter 0.45s var(--lux-ease);
}

body.workspace-page.nbs-page.nbs-reveal-ready [data-reveal]:not(.is-revealed) {
  /* Partially visible, not hidden: fast scrollers and full-page captures
     should still read this as content, not a blank cream gap. */
  opacity: 0.3;
  transform: translateY(10px);
}

@media (min-width: 720px) {
  body.workspace-page.nbs-page.nbs-reveal-ready [data-reveal]:not(.is-revealed) {
    filter: blur(2px);
  }
}

body.workspace-page.nbs-page.nbs-reveal-ready [data-reveal].is-revealed {
  opacity: 1;
  transform: none;
  filter: none;
}

/* Film grain - fixed, non-scrolling, above all page layers (header 10,
   mobile bar 95). Very low alpha; skip entirely if it ever needs to go. */
body.workspace-page.nbs-page::after {
  content: "";
  position: fixed;
  inset: 0;
  z-index: 96;
  pointer-events: none;
  opacity: 0.028;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='180' height='180'%3E%3Cfilter id='g'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.82' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='180' height='180' filter='url(%23g)'/%3E%3C/svg%3E");
  background-size: 180px 180px;
}

/* Landing intro (2026-07-08, reworked same day; shortened 2026-07-28): "Welcome
   to" rises first, the brand mark follows, then the dark ground FADES into
   the hero while script.js flies the mark (Web Animations API) from centre
   stage to the header brand mark's exact position - a shared-element
   handoff, the intro logo visually BECOMES .nbs-wordmark-mark. The overlay
   still self-dismisses via a pure-CSS fade if JS never runs (script.js
   cancels that fallback with inline animation:none when it takes over).
   z-index 200 sits above the film grain (96) and header (10). */
body.workspace-page.nbs-page .nbs-intro {
  position: fixed;
  inset: 0;
  z-index: 200;
  display: grid;
  place-items: center;
  background-color: var(--workspace-obsidian);
  transition: background-color 700ms var(--lux-ease);
  animation: nbs-intro-fade 700ms ease 1.5s forwards;
}

body.workspace-page.nbs-page .nbs-intro.is-leaving {
  background-color: transparent;
  pointer-events: none;
}

body.workspace-page.nbs-page .nbs-intro__lockup {
  display: grid;
  justify-items: center;
  gap: clamp(14px, 2vw, 22px);
}

/* Ink on the cream ground (2026-07-09 - the obsidian intro went with the
   dark zones; the flying mark is now the solid coral badge). */
body.workspace-page.nbs-page .nbs-intro__welcome {
  margin: 0;
  color: rgba(51, 49, 42, 0.82);
  font-family: "Fraunces", Georgia, "Times New Roman", serif !important;
  font-optical-sizing: auto;
  font-size: clamp(1.15rem, 2vw, 1.55rem);
  font-style: italic;
  font-weight: 480;
  font-variation-settings: "opsz" 144;
  letter-spacing: 0.04em;
  opacity: 0;
  animation: nbs-intro-rise 800ms var(--lux-ease) 200ms forwards;
}

body.workspace-page.nbs-page .nbs-intro.is-leaving .nbs-intro__welcome {
  opacity: 0;
  transition: opacity 380ms var(--lux-ease);
  animation: none;
}

body.workspace-page.nbs-page .nbs-intro img {
  width: clamp(200px, 26vw, 320px);
  height: auto;
  opacity: 0;
  animation: nbs-intro-rise 900ms var(--lux-ease) 600ms forwards;
}

@keyframes nbs-intro-rise {
  from {
    opacity: 0;
    transform: translateY(16px) scale(0.97);
  }

  to {
    opacity: 1;
    transform: none;
  }
}

@keyframes nbs-intro-fade {
  to {
    opacity: 0;
    visibility: hidden;
  }
}

/* Hero entrance - only when the intro actually plays (script.js stamps
   .nbs-intro-active before first paint; skipped sessions land straight on
   the settled hero with zero flash). No element here waits on the flight
   landing (2026-07-28: the hero-copy badge that used to gate on
   .nbs-intro-done is gone, the flight now lands on the header mark
   instead), so the whole block just rises in on its own stagger. */
body.workspace-page.nbs-page.nbs-intro-active .workspace-hero-copy > * {
  animation: nbs-hero-rise 760ms var(--lux-ease) both;
}

body.workspace-page.nbs-page.nbs-intro-active .workspace-hero-copy > *:nth-child(1) { animation-delay: 1s; }
body.workspace-page.nbs-page.nbs-intro-active .workspace-hero-copy > *:nth-child(2) { animation-delay: 1.1s; }
body.workspace-page.nbs-page.nbs-intro-active .workspace-hero-copy > *:nth-child(3) { animation-delay: 1.2s; }
body.workspace-page.nbs-page.nbs-intro-active .workspace-hero-copy > *:nth-child(4) { animation-delay: 1.3s; }

body.workspace-page.nbs-page.nbs-intro-active .workspace-hero-media img {
  animation: nbs-hero-photo 1400ms var(--lux-ease) 0.8s both;
}

@keyframes nbs-hero-rise {
  from {
    opacity: 0;
    transform: translateY(22px);
  }

  to {
    opacity: 1;
    transform: none;
  }
}

@keyframes nbs-hero-photo {
  from {
    opacity: 0.4;
    transform: scale(1.045);
  }

  to {
    opacity: 1;
    transform: none;
  }
}

@media (prefers-reduced-motion: reduce) {
  body.workspace-page.nbs-page .nbs-intro {
    display: none;
    animation: none;
  }

  body.workspace-page.nbs-page.nbs-intro-active .workspace-hero-copy > *,
  body.workspace-page.nbs-page.nbs-intro-active .workspace-hero-media img {
    animation: none;
    opacity: 1;
  }
}

@media (prefers-reduced-motion: reduce) {
  body.workspace-page.nbs-page [data-reveal],
  body.workspace-page.nbs-page .top-cta,
  body.workspace-page.nbs-page .primary-action,
  body.workspace-page.nbs-page .secondary-action,
  body.workspace-page.nbs-page .global-email-cta {
    transition: none;
  }

  body.workspace-page.nbs-page [data-reveal] {
    opacity: 1;
    transform: none;
    filter: none;
  }
}

/* ============================================================
   NBS desktop scale-down (2026-07-08, client feedback: "everything
   is VERY BIG on desktop" and the hero doesn't fit the page).
   Audited at 1366x768 / 1440x900 / 1920x1080: header+hero ran to
   120-126% of viewport height with the intro copy cut at the fold,
   and single h2s (80-102px) filled whole screens. Display type
   drops ~30-35%, section padding caps drop from 132-176px to
   ~104-120px, and header (72px) + hero now land within 100vh with
   the full copy block visible. Desktop-only (≥981px) - the
   approved tablet/mobile scale is untouched.
   ============================================================ */
@media (min-width: 981px) {
  body.workspace-page.nbs-page .workspace-hero {
    padding-top: clamp(44px, 5vh, 64px);
    padding-bottom: clamp(44px, 5vh, 64px);
  }

  /* Tara 2026-07-09: "keep one font and make larger. Also make logo larger"
     - heading and badge step back up within the 100vh hero budget.
     2026-07-09 second pass: "larger text" again on the hero, a more
     confident jump this time - kicker and paragraph scale up a notch too
     so the hierarchy stays balanced against the bigger headline.
     2026-07-28: cap lowered from 6rem - the 720px hero column (see
     .workspace-hero-content above) breaks "Flexible City workspace,
     ready now" onto a dangling third line ("now" alone) at ~86px and up;
     5rem keeps it a two-line wrap at every width ≥981px. */
  body.workspace-page.nbs-page .workspace-hero h1 {
    font-size: clamp(4rem, 6vw, 5rem);
  }

  body.workspace-page.nbs-page .workspace-hero .kicker {
    font-size: 0.78rem;
  }

  body.workspace-page.nbs-page .workspace-hero-copy > p:not(.kicker) {
    max-width: 620px;
    font-size: clamp(1.15rem, 1.6vw, 1.55rem);
  }

  body.workspace-page.nbs-page .workspace-arrival-heading h2 {
    font-size: clamp(40px, 3.9vw, 60px);
  }

  body.workspace-page.nbs-page .workspace-breathing-copy h2 {
    font-size: clamp(2.9rem, 4.2vw, 4.3rem);
  }

  body.workspace-page.nbs-page .occupier-section h2,
  body.workspace-page.nbs-page .workspace-connection-table .commute-heading h2 {
    font-size: clamp(2.7rem, 3.9vw, 4.4rem);
  }

  body.workspace-page.nbs-page .workspace-suite-copy h2 {
    font-size: clamp(2.6rem, 3.8vw, 4.2rem);
  }

  body.workspace-page.nbs-page .workspace-footer h2 {
    font-size: clamp(2.4rem, 3.6vw, 4rem);
  }

  body.workspace-page.nbs-page .workspace-arrival-editorial {
    padding-top: clamp(56px, 7vw, 104px);
  }

  body.workspace-page.nbs-page .workspace-breathing-room {
    padding: clamp(64px, 7vw, 112px) clamp(22px, 7vw, 110px);
  }

  body.workspace-page.nbs-page .workspace-plan-suite {
    padding: clamp(60px, 7vw, 104px) clamp(22px, 6vw, 96px);
  }

  body.workspace-page.nbs-page .occupier-section {
    padding: clamp(68px, 8vw, 120px) clamp(24px, 8vw, 120px);
  }

  body.workspace-page.nbs-page .occupier-section dl > div {
    min-height: 110px;
  }

  body.workspace-page.nbs-page .workspace-connection-table {
    padding: clamp(64px, 7vw, 112px) clamp(24px, 8vw, 120px);
  }

  body.workspace-page.nbs-page .workspace-service-suite {
    padding: clamp(64px, 7vw, 112px) clamp(24px, 7vw, 110px);
  }

  body.workspace-page.nbs-page .workspace-footer {
    padding: clamp(68px, 8vw, 120px) clamp(24px, 8vw, 120px);
  }
}

/* Lombard Street v2 visual bug-fix layer.
   Desktop: availability rhythm, third-floor CGI containment, media-pair balance.
   Mobile: slimmer two-row header, full wordmark, nav that fits, cohesive hero facts panel. */

@media (min-width: 1181px) {
  body.lombard-page.lombard-v2 .lombard-v2-availability {
    align-items: center;
    row-gap: clamp(36px, 3.5vw, 54px);
    padding-top: clamp(64px, 7vw, 104px);
    padding-bottom: clamp(64px, 7vw, 104px);
  }
}

@media (min-width: 901px) {
  body.lombard-page.lombard-v2 .lombard-floor--third .lombard-floor__media .lombard-floor-photo {
    width: 100%;
    max-width: 100%;
    height: auto;
    aspect-ratio: 7 / 10;
    align-self: center;
  }

  body.lombard-page.lombard-v2 .lombard-floor--third {
    padding-bottom: 36px;
  }

  body.lombard-page.lombard-v2 .lombard-v2-floor-divider {
    margin-top: clamp(14px, 1.8vw, 26px);
  }

  body.lombard-page.lombard-v2 .lombard-v2-media-pair {
    align-items: stretch;
  }

  body.lombard-page.lombard-v2 .lombard-v2-media-pair figure:last-child {
    height: auto;
    aspect-ratio: auto;
  }

  body.lombard-page.lombard-v2 .lombard-v2-media-pair figure:last-child img {
    width: 100%;
  }
}

@media (max-width: 900px) {
  body.lombard-page .site-top > .wordmark {
    grid-row: 1;
    grid-column: 1;
  }

  body.lombard-page .site-top > .site-top__actions {
    grid-row: 1;
    grid-column: 2;
  }

  body.lombard-page .site-top nav {
    grid-row: 2;
    grid-column: 1 / -1;
  }
}

@media (max-width: 720px) {
  body.lombard-page.lombard-v2 .wordmark strong {
    max-width: none;
    overflow: visible;
    font-size: 10px;
    letter-spacing: 0.08em;
  }

}

@media (max-width: 560px) {
  body.lombard-page.lombard-v2 .site-top nav {
    gap: 4px;
  }

  body.lombard-page.lombard-v2 .site-top nav a {
    padding: 7px 5px;
    font-size: 0.6rem;
    letter-spacing: 0.02em;
  }
}

@media (max-width: 480px) {
  body.lombard-page.lombard-v2 .wordmark strong {
    max-width: none;
  }

  body.lombard-page .wordmark {
    min-height: 38px;
  }
}

/* Lombard mobile conversion bar */
.lombard-mobile-cta {
  display: none;
}

@media (max-width: 720px) {
  body.lombard-page .lombard-mobile-cta {
    position: fixed;
    inset: auto 0 0 0;
    z-index: 95;
    display: grid;
    grid-template-columns: 1fr 1.35fr;
    gap: 10px;
    padding: 10px 14px calc(10px + env(safe-area-inset-bottom, 0px));
    border-top: 1px solid var(--line);
    background: color-mix(in srgb, var(--surface-strong) 96%, white);
    box-shadow: 0 -12px 34px rgba(23, 17, 15, 0.14);
  }

  body.lombard-page .lombard-mobile-cta a {
    display: flex;
    align-items: center;
    justify-content: center;
    min-height: 46px;
    border-radius: 999px;
    font-size: 0.74rem;
    font-weight: 900;
    letter-spacing: 0;
    line-height: 1;
    text-transform: uppercase;
    text-decoration: none;
  }

  body.lombard-page .lombard-mobile-cta__call {
    border: 1px solid var(--ink);
    color: var(--ink);
    background: transparent;
  }

  body.lombard-page .lombard-mobile-cta__book {
    border: 1px solid color-mix(in srgb, var(--accent) 78%, var(--ink));
    background: var(--accent);
    color: var(--white);
  }

  /* keep page content and floating UI clear of the bar */
  body.lombard-page.lombard-v2 {
    padding-bottom: 68px;
  }

  body.lombard-page .lombard-contact-popup {
    bottom: calc(80px + env(safe-area-inset-bottom, 0px));
    max-height: min(430px, calc(100svh - 96px));
  }
}

/* Lombard v3 - editorial luxury layer
   Typography (Fraunces display / Plus Jakarta Sans body), eyebrow pills,
   double-bezel cards, button-in-button CTAs, scroll reveals, film grain.
   Everything scoped to body.lombard-page.lombard-v2 - never shared rules. */

@font-face {
  font-family: "Fraunces";
  src: url("assets/fonts/fraunces-var.woff2") format("woff2");
  font-weight: 400 700;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: "Plus Jakarta Sans";
  src: url("assets/fonts/plus-jakarta-sans-var.woff2") format("woff2");
  font-weight: 400 800;
  font-style: normal;
  font-display: swap;
}

/* Typography.
   The shared template-page layer forces `font-family: var(--brand-font) !important`
   on every element, so this page re-points that token at Plus Jakarta Sans and the
   serif display set re-asserts Fraunces with !important (scoped to this page only). */
body.lombard-page.lombard-v2 {
  --brand-font: "Plus Jakarta Sans", system-ui, -apple-system, "Segoe UI", Arial, sans-serif;
  font-family: var(--brand-font);
  font-optical-sizing: auto;
}

body.lombard-page.lombard-v2 button {
  font-family: inherit;
}

body.lombard-page.lombard-v2 h1,
body.lombard-page.lombard-v2 h2,
body.lombard-page.lombard-v2 .lombard-floor__copy h3,
body.lombard-page.lombard-v2 .lombard-v2-availability-grid strong,
body.lombard-page.lombard-v2 .lombard-v2-stations strong,
body.lombard-page.lombard-v2 .lombard-v2-hero__facts dd,
body.lombard-page.lombard-v2 .wordmark__badge-outline,
body.lombard-page.lombard-v2 .wordmark__badge-solid,
body.lombard-page.lombard-v2 .lombard-v2-brand-pull {
  font-family: "Fraunces", Georgia, "Times New Roman", serif !important;
  font-optical-sizing: auto;
}

body.lombard-page.lombard-v2 h1,
body.lombard-page.lombard-v2 h2,
body.lombard-page.lombard-v2 .lombard-floor__copy h3 {
  font-weight: 590;
  font-variation-settings: "opsz" 144;
  letter-spacing: -0.01em;
  line-height: 1.04;
}

body.lombard-page.lombard-v2 .lombard-v2-availability-grid span,
body.lombard-page.lombard-v2 .lombard-v2-availability-grid small,
body.lombard-page.lombard-v2 .lombard-v2-stations span,
body.lombard-page.lombard-v2 .lombard-v2-hero__facts dt,
body.lombard-page.lombard-v2 .lombard-v2-place-lists span,
body.lombard-page.lombard-v2 .lombard-v2-floor-divider,
body.lombard-page.lombard-v2 .lombard-v2-media-pair figcaption,
body.lombard-page.lombard-v2 .lombard-floor-plan figcaption,
body.lombard-page.lombard-v2 .lombard-floor-photo figcaption,
body.lombard-page.lombard-v2 .lombard-v2-contact-card a small,
body.lombard-page.lombard-v2 .lombard-v2-contact-brochure small {
  font-weight: 700;
  letter-spacing: 0.12em;
}

/* Eyebrow pills */
body.lombard-page.lombard-v2 .kicker,
body.lombard-page.lombard-v2 .lombard-floor__eyebrow {
  display: inline-flex;
  width: fit-content;
  align-items: center;
  padding: 4px 12px;
  border: 1px solid rgba(201, 80, 60, 0.35);
  border-radius: 999px;
  background: rgba(201, 80, 60, 0.06);
  color: var(--accent);
  font-size: 0.66rem;
  font-weight: 700;
  letter-spacing: 0.2em;
  line-height: 1.5;
  text-transform: uppercase;
}

body.lombard-page.lombard-v2 .lombard-v2-hero .kicker,
body.lombard-page.lombard-v2 .lombard-v2-gallery .kicker {
  border-color: var(--accent);
  background: var(--accent);
  color: var(--ivory);
}

body.lombard-page.lombard-v2 .lombard-v2-gallery .kicker {
  border-radius: 0;
}

body.lombard-page.lombard-v2 .lombard-v2-contact .kicker {
  border-color: rgba(255, 248, 236, 0.4);
  background: rgba(255, 248, 236, 0.1);
  color: var(--ivory);
}

/* Feature chips */
body.lombard-page.lombard-v2 .lombard-v2-pill-list li,
body.lombard-page.lombard-v2 .lombard-floor__tags span {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 36px;
  padding: 8px 14px;
  border: 0;
  border-radius: 999px;
  background: var(--surface-strong);
  box-shadow:
    0 0 0 1px rgba(42, 37, 33, 0.1),
    inset 0 1px 0 rgba(255, 255, 255, 0.55),
    0 12px 24px -18px rgba(42, 37, 33, 0.3);
  color: color-mix(in srgb, var(--ink) 86%, var(--accent));
  font-size: 0.68rem;
  font-weight: 600;
  letter-spacing: 0.14em;
  line-height: 1.2;
  text-transform: uppercase;
}

@media (max-width: 720px) {
  body.lombard-page.lombard-v2 .lombard-floor__tags span {
    min-height: 40px;
    padding: 9px 12px;
  }
}

/* Double-bezel cards: availability grid */
body.lombard-page.lombard-v2 .lombard-v2-availability-grid {
  gap: clamp(12px, 1.4vw, 18px);
  padding: 0;
  background: transparent;
}

body.lombard-page.lombard-v2 .lombard-v2-availability-grid article {
  position: relative;
  padding: clamp(24px, 2.4vw, 34px);
  border-radius: 22px;
  background: linear-gradient(180deg, color-mix(in srgb, var(--surface-strong) 86%, white) 0%, var(--surface-strong) 100%);
  box-shadow:
    0 0 0 1px rgba(42, 37, 33, 0.08),
    inset 0 1px 0 rgba(255, 255, 255, 0.55),
    0 24px 48px -24px rgba(42, 37, 33, 0.18);
}

/* Mobile: availability cards compress into ledger rows - label left, figure right */
@media (max-width: 720px) {
  body.lombard-page.lombard-v2 .lombard-v2-availability-grid {
    gap: 10px;
  }

  body.lombard-page.lombard-v2 .lombard-v2-availability-grid article {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    grid-template-areas:
      "label figure"
      "caption figure";
    align-items: center;
    column-gap: 18px;
    row-gap: 2px;
    min-height: 0;
    padding: 18px 22px;
    border-radius: 18px;
  }

  body.lombard-page.lombard-v2 .lombard-v2-availability-grid span {
    grid-area: label;
    align-self: end;
    font-size: 0.7rem;
  }

  body.lombard-page.lombard-v2 .lombard-v2-availability-grid small {
    grid-area: caption;
    align-self: start;
    font-size: 0.64rem;
  }

  body.lombard-page.lombard-v2 .lombard-v2-availability-grid strong {
    grid-area: figure;
    margin: 0;
    font-size: clamp(2rem, 9.8vw, 2.7rem);
    text-align: right;
  }
}

/* Double-bezel cards: floor frames and media pair */
body.lombard-page.lombard-v2 .lombard-floor-plan,
body.lombard-page.lombard-v2 .lombard-floor-photo,
body.lombard-page.lombard-v2 .lombard-v2-media-pair figure {
  border: 0;
  border-radius: 20px;
  background: linear-gradient(180deg, color-mix(in srgb, var(--surface-strong) 86%, white) 0%, var(--surface-strong) 100%);
  box-shadow:
    0 0 0 1px rgba(42, 37, 33, 0.08),
    inset 0 1px 0 rgba(255, 255, 255, 0.55),
    0 24px 48px -24px rgba(42, 37, 33, 0.22);
}

body.lombard-page.lombard-v2 .lombard-floor-photo,
body.lombard-page.lombard-v2 .lombard-v2-media-pair figure {
  padding: 8px;
}

body.lombard-page.lombard-v2 .lombard-floor-photo img,
body.lombard-page.lombard-v2 .lombard-v2-media-pair figure img {
  height: 100%;
  border-radius: 12px;
}

body.lombard-page.lombard-v2 .lombard-floor-plan img {
  border-radius: 10px;
}

/* Opportunity section extends the hero's dark editorial theme before the page
   moves back into the lighter availability rhythm. */
body.lombard-page.lombard-v2 .lombard-v2-opportunity {
  background:
    radial-gradient(100% 86% at 100% 0%, rgba(201, 80, 60, 0.16), transparent 58%),
    linear-gradient(180deg, var(--obsidian) 0%, #171411 100%);
  color: var(--ivory);
}

body.lombard-page.lombard-v2 .lombard-v2-opportunity .kicker {
  border-color: var(--accent);
  background: var(--accent);
  color: var(--ivory);
}

body.lombard-page.lombard-v2 .lombard-v2-opportunity .lombard-v2-copy h2 {
  color: var(--ivory);
}

body.lombard-page.lombard-v2 .lombard-v2-opportunity .lombard-v2-copy p:not(.kicker) {
  color: rgba(255, 248, 236, 0.76);
}

body.lombard-page.lombard-v2 .lombard-v2-opportunity .lombard-v2-pill-list li {
  background: rgba(255, 248, 236, 0.08);
  box-shadow:
    0 0 0 1px rgba(255, 248, 236, 0.18),
    inset 0 1px 0 rgba(255, 248, 236, 0.12);
  color: rgba(255, 248, 236, 0.9);
}

body.lombard-page.lombard-v2 .lombard-v2-opportunity .lombard-v2-media-pair figure {
  background: rgba(255, 248, 236, 0.08);
  box-shadow:
    0 0 0 1px rgba(255, 248, 236, 0.12),
    inset 0 1px 0 rgba(255, 248, 236, 0.1),
    0 28px 80px rgba(0, 0, 0, 0.28);
}

@media (max-width: 900px) {
  body.lombard-page.lombard-v2 .lombard-v2-opportunity .lombard-v2-media-pair {
    grid-template-columns: 1fr;
  }

  body.lombard-page.lombard-v2 .lombard-v2-opportunity .lombard-v2-media-pair figure:last-child {
    display: none;
  }
}

/* Double-bezel cards: gallery images (dark zone) */
body.lombard-page.lombard-v2 .lombard-v2-gallery__grid img {
  border: 0;
  border-radius: 0;
  box-shadow: none;
}

body.lombard-page.lombard-v2 .lombard-v2-gallery__grid img:not(:first-child) {
  box-shadow: -24px 0 54px rgba(0, 0, 0, 0.34);
}

@media (max-width: 720px) {
  body.lombard-page.lombard-v2 .lombard-v2-gallery__grid img:not(:first-child) {
    box-shadow: none;
  }
}

/* Double-bezel cards: contact cards - translucent glass so the terracotta reads through */
body.lombard-page.lombard-v2 .lombard-v2-contact-card,
body.lombard-page.lombard-v2 .lombard-v2-contact-brochure {
  position: relative;
  border: 0;
  border-radius: 20px;
  background: linear-gradient(180deg, rgba(255, 248, 236, 0.13) 0%, rgba(255, 248, 236, 0.06) 100%);
  box-shadow:
    0 0 0 1px rgba(255, 248, 236, 0.26),
    inset 0 1px 0 rgba(255, 248, 236, 0.2),
    0 26px 52px -26px rgba(80, 28, 20, 0.4);
  color: var(--ivory);
}

body.lombard-page.lombard-v2 .lombard-v2-contact-card::before,
body.lombard-page.lombard-v2 .lombard-v2-contact-brochure::before {
  content: "";
  position: absolute;
  inset: 8px;
  border-radius: 12px;
  box-shadow: 0 0 0 1px rgba(255, 248, 236, 0.12);
  pointer-events: none;
}

body.lombard-page.lombard-v2 .lombard-v2-contact-card h3,
body.lombard-page.lombard-v2 .lombard-v2-contact-card a,
body.lombard-page.lombard-v2 a.lombard-v2-contact-brochure {
  color: var(--ivory);
}

body.lombard-page.lombard-v2 a.lombard-v2-contact-brochure:hover,
body.lombard-page.lombard-v2 a.lombard-v2-contact-brochure:focus-visible {
  color: #ffffff;
  box-shadow:
    0 0 0 1px rgba(255, 248, 236, 0.45),
    inset 0 1px 0 rgba(255, 248, 236, 0.24),
    0 26px 52px -26px rgba(80, 28, 20, 0.4);
}

body.lombard-page.lombard-v2 .lombard-v2-contact-card a {
  border-top-color: rgba(255, 248, 236, 0.18);
}

body.lombard-page.lombard-v2 .lombard-v2-contact-card a:hover span,
body.lombard-page.lombard-v2 .lombard-v2-contact-card a:focus-visible span {
  color: #ffffff;
  text-decoration: underline;
  text-underline-offset: 4px;
}

body.lombard-page.lombard-v2 .lombard-v2-contact-card a small,
body.lombard-page.lombard-v2 .lombard-v2-contact-brochure small {
  color: rgba(255, 248, 236, 0.64);
}

body.lombard-page.lombard-v2 .lombard-v2-contact-brochure::after {
  color: rgba(255, 248, 236, 0.64);
}

body.lombard-page.lombard-v2 .lombard-v2-contact .brochure-disclaimer {
  color: rgba(255, 248, 236, 0.72);
}

body.lombard-page.lombard-v2 .lombard-v2-location .site-map-wrap {
  border: 0;
  border-radius: 20px;
  box-shadow:
    0 0 0 1px rgba(42, 37, 33, 0.1),
    0 24px 48px -24px rgba(42, 37, 33, 0.28);
}

body.lombard-page.lombard-v2 .lombard-static-map {
  display: block;
  margin: 0;
  background: #d8d1c5;
}

body.lombard-page.lombard-v2 .lombard-static-map img {
  position: absolute;
  inset: 0;
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  filter: saturate(0.94) contrast(1.02);
}

body.lombard-page.lombard-v2 .lombard-contact-popup {
  border: 0;
  border-radius: 20px;
  box-shadow:
    0 0 0 1px rgba(42, 37, 33, 0.1),
    inset 0 1px 0 rgba(255, 255, 255, 0.55),
    0 32px 64px -32px rgba(42, 37, 33, 0.4);
  transition: opacity 220ms var(--lux-ease), transform 220ms var(--lux-ease);
}

/* Button hover physics */
body.lombard-page.lombard-v2 .global-email-cta {
  transition: background 340ms var(--lux-ease), color 340ms var(--lux-ease), transform 340ms var(--lux-ease), box-shadow 340ms var(--lux-ease);
}

body.lombard-page.lombard-v2 .lombard-cta,
body.lombard-page.lombard-v2 .lombard-contact-popup__actions a,
body.lombard-page.lombard-v2 .lombard-mobile-cta a {
  transition: background 340ms var(--lux-ease), border-color 340ms var(--lux-ease), color 340ms var(--lux-ease), transform 340ms var(--lux-ease);
}

body.lombard-page.lombard-v2 :is(.top-cta, .lombard-cta, .global-email-cta, .lombard-contact-popup__actions a, .lombard-mobile-cta a):active {
  transform: scale(0.98);
}

/* Scroll reveals (companion to the [data-reveal] observer in script.js) */
body.lombard-page.lombard-v2.lombard-reveal-ready [data-reveal] {
  transition:
    opacity 0.8s var(--lux-ease),
    transform 0.8s var(--lux-ease),
    filter 0.8s var(--lux-ease);
}

body.lombard-page.lombard-v2.lombard-reveal-ready [data-reveal]:not(.is-revealed) {
  opacity: 0;
  transform: translateY(26px);
}

@media (min-width: 720px) {
  body.lombard-page.lombard-v2.lombard-reveal-ready [data-reveal]:not(.is-revealed) {
    filter: blur(5px);
  }
}

body.lombard-page.lombard-v2.lombard-reveal-ready [data-reveal].is-revealed {
  opacity: 1;
  transform: none;
  filter: none;
}

body.lombard-page.lombard-v2.lombard-reveal-ready .lombard-v2-gallery__grid [data-reveal] {
  opacity: 1;
  transform: none;
  filter: none;
}

/* Film grain - fixed, non-scrolling, above all page layers (header 80, popup 90, mobile bar 95) */
body.lombard-page.lombard-v2::after {
  content: "";
  position: fixed;
  inset: 0;
  z-index: 96;
  pointer-events: none;
  opacity: 0.035;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='180' height='180'%3E%3Cfilter id='g'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.82' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='180' height='180' filter='url(%23g)'/%3E%3C/svg%3E");
  background-size: 180px 180px;
}

@media (prefers-reduced-motion: reduce) {
  body.lombard-page.lombard-v2 [data-reveal],
  body.lombard-page.lombard-v2 .top-cta,
  body.lombard-page.lombard-v2 .lombard-cta,
  body.lombard-page.lombard-v2 .global-email-cta {
    transition: none;
  }

  body.lombard-page.lombard-v2 [data-reveal] {
    opacity: 1;
    transform: none;
    filter: none;
  }
}

@media (prefers-reduced-motion: reduce) {
  .lombard-contact-popup {
    transition: none;
  }
}

/* Lombard media and mobile floor-list refinement.
   Removes the padded image-in-frame treatment while keeping the existing
   aspect ratios, captions and compare controls intact. */
body.lombard-page.lombard-v2 .lombard-floor-plan,
body.lombard-page.lombard-v2 .lombard-floor-photo,
body.lombard-page.lombard-v2 .lombard-v2-media-pair figure {
  border: 0;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
}

body.lombard-page.lombard-v2 .lombard-floor-plan,
body.lombard-page.lombard-v2 .lombard-floor-photo,
body.lombard-page.lombard-v2 .lombard-v2-media-pair figure {
  padding: 0;
}

body.lombard-page.lombard-v2 .lombard-floor-plan img,
body.lombard-page.lombard-v2 .lombard-floor-photo img,
body.lombard-page.lombard-v2 .lombard-v2-media-pair figure img {
  border-radius: 0;
}

body.lombard-page.lombard-v2 .lombard-compare {
  border: 0;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
}

@media (max-width: 720px) {
  body.lombard-page.lombard-v2 .lombard-floor__spec {
    grid-template-columns: 1fr;
    gap: 0;
    margin-bottom: 0;
    padding: 0;
    border-top: 1px solid rgba(42, 37, 33, 0.16);
    border-right: 0;
    border-bottom: 0;
    border-left: 0;
    border-radius: 0;
    background: transparent;
  }

  body.lombard-page.lombard-v2 .lombard-floor__spec li {
    min-height: 0;
    padding: 13px 0;
    border: 0;
    border-bottom: 1px solid rgba(42, 37, 33, 0.16);
    border-radius: 0;
    background: transparent;
    color: var(--ink);
    font-size: 0.86rem;
    font-weight: 650;
    letter-spacing: 0;
    line-height: 1.35;
    text-transform: none;
  }

  body.lombard-page.lombard-v2 .lombard-floor__tags {
    display: grid;
    grid-template-columns: 1fr;
    gap: 0;
  }

  body.lombard-page.lombard-v2 .lombard-floor__tags span {
    justify-content: flex-start;
    min-height: 0;
    padding: 13px 0;
    border-radius: 0;
    background: transparent;
    box-shadow: none;
    color: var(--ink);
    font-size: 0.86rem;
    font-weight: 650;
    letter-spacing: 0;
    line-height: 1.35;
    text-align: left;
    text-transform: none;
  }

  body.lombard-page.lombard-v2 .lombard-floor__tags span + span {
    border-top: 1px solid rgba(42, 37, 33, 0.16);
  }
}